質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.48%

  • Swift 2

    1334questions

    Swift 2は、Apple社が独自に開発を行っている言語「Swift」のアップグレード版です。iOSやOS X、さらにLinuxにも対応可能です。また、throws-catchベースのエラーハンドリングが追加されています。

Swift:tableviewの中にtextfieldを配置したい

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 2,295

TatsunoriKoda

score 45

現在Swift2を使ってアプリ開発をしています。
ログイン画面を
イメージ説明
のようにしたいのですが実装方法がまったくわかりません。
想定は、
UITableViewを使って、
UITextFieldを配置
のかと思っているのですがSwift及びXcodeでの開発初心者ということもあり、うまく実装できません。

【実現したいこと】
上の図のように1つのテーブルの中に複数のセルがあり、それぞれのセルにはラベルとテキストが入力できるフィールドが入っているデザインにしたい。

【課題】
添付ファイルのようにやりかけてはいますが、Storyboardでは実現が困難かと思っています。
イメージ説明
なのでコード(Swift)にてこのようなデザインを実装する方法を知りたいです。

Objective-cでのサンプルはいくつか見つけたのですが、Swiftではどのようにすれば実現可能でしょうか?
参考Webページなどでも良いので、教えていただけると大変助かります。

よろしくお願いします。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • happy_ryo

    2016/04/11 14:41

    今現在作業されている状態がどうなっているのかの画像等があると、回答しやすいです。

    キャンセル

回答 1

checkベストアンサー

0

完成形の例になっている画像のビューが古い iOS の物でしたが、見た目は質問内で言及されていなかった為

【実現したいこと】 
上の図のように1つのテーブルの中に複数のセルがあり、それぞれのセルにはラベルとテキストが入力できるフィールドが入っているデザインにしたい。

上記の部分に絞って回答します。

  1. Table View Cell の Style を Custom に変更する
  2. Cell の中に UILabelView と UITextField を配置する
  3. Auto layout の設定をしてそれぞれのパーツの位置を決める
  4. UITextField の Border Style を一番左の非表示に変更する
  5. Table View の Prototype Cells を "2" に変更する
  6. それぞれの cell のラベルの文字を変更する
  7. パスワード側の UITextField の Secure Text Entry にチェックを入れる
  8. それぞれの cell の identifier を任意の物に変更する
  9. UITableViewController を継承、または Table View 関連の delegate を実装する場所で以下のように書く(indexPath.row == 0 は適当なので状況にあわせて書き換えて下さい)
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 2
}

override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    if indexPath.row == 0 {
        let cell = tableView.dequeueReusableCellWithIdentifier("ID側のidentifier", forIndexPath: indexPath)
        return cell
   }else {
        let cell = tableView.dequeueReusableCellWithIdentifier("パスワード側のidentifier", forIndexPath: indexPath)
        return cell
    }

}

ex.
Table View の Style を Grouped にすると添付されていた画像のイメージに多少近づくと思います。

イメージ説明

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/04/11 16:30

    happy_ryo様
    ここまでの詳細のご提示、本当にありがとうございます。
    早速試しています。
    重ねていくつか質問させてもらえないでしょうか。
    ・TableViewにある「Master」というのはToolbarでしょうか?設置の仕方がわかっていません。
    ・TableViewに対応するSwiftコード
    ・これらの設定に関するデリゲートコード(AppDeleate.swift?)
    を参考までにいただけないでしょうか。
    お手数おかけしますが、何卒宜しくお願い致します。

    キャンセル

  • 2016/04/11 16:50

    ・Master と表記されている部分は NavigationBar です。 UINavigationController を別に用意し、該当の UITableViewController を rootviewcontroller として設定しています。
    ・Table View に関する Swift コードは先の回答内に含めたもので全てです
    ・上に同じ

    キャンセル

  • 2016/04/13 10:01

    最後までご親切な回答、本当にありがとうございました。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.48%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • Swift 2

    1334questions

    Swift 2は、Apple社が独自に開発を行っている言語「Swift」のアップグレード版です。iOSやOS X、さらにLinuxにも対応可能です。また、throws-catchベースのエラーハンドリングが追加されています。