読者です 読者をやめる 読者になる 読者になる

せでぃのブログ

ブログ初心者おいどんのどうでもいい愚痴やどうでもいい愚痴やどうでもいいマメ知識などを披露するチラシの裏です。

FESSとJSONその3

iphoneアプリ開発 fess9.2.0 JSON Objective-C SimVersion8.1 xcode6.1.1

20150315修正:インスタンス変数itemsの書き方を修正
[iOS] JSONをパースして配列を取得・テーブルビューに表示

StoryBoardでSegueを使った簡単な画面遷移 - chulip.org
 この辺を参考に、JSONのデータをtableview cellに入れ込むだけの機能を作ってみた。tableviewが電波表示のところまで食い込んだり、セルが自動追加されるとナビゲーションバーがセルと一緒に下まで行くのでかなり悩んだ。NavigationControllerってこのためにあったのか?!

完成画像

f:id:Sediment:20150306133626p:plain
csny/fess-json · GitHub
 test100がアップロードしたプロジェクト。

作成手順

1.xcodeの初期設定
 SingleViewで始める。名前や保存場所は適当に。
f:id:Sediment:20150305011427p:plain

2.ストーリーボードにある既存のviewcontrollerとクラスファイルViewController.mと.hを削除
f:id:Sediment:20150306154039p:plain
f:id:Sediment:20150306173605p:plain

3.ストーリーボードのオブジェクト及びクラスファイルを新規作成
 ストーリーボードの何もない空間にNavigationControllerを追加。
f:id:Sediment:20150306153647p:plain
 クラスファイルを新規作成し、CocoaTouchClass→UITableViewControllerサブクラスのTableViewControllerというクラス名のファイルを。
f:id:Sediment:20150306153850p:plain
f:id:Sediment:20150306153728p:plain
f:id:Sediment:20150306153742p:plain

3.5.ストーリーボード操作のコツ

  • ストーリーボードでのオブジェクト貼り付けは、必ず縮尺率100%でやる。それ以外の縮尺だと貼り付けできない。
  • 何もない場所でControlキー+クリックまたは、Editor→Canvas→Zoomで縮尺変更。
  • Commandキー+十字キーもストーリーボードの操作が楽になる。
  • オブジェクトはかなり掴みづらくなっているので、オブジェクト一覧みたいなところも使う。

f:id:Sediment:20150306155929p:plain

4.「NavigationController」を最初に起動するオブジェクトとして設定
 ストーリーボードの「NavigationController」のAttributes inspectorの「is Inityal View Controller」にチェックを入れる。
f:id:Sediment:20150306164613p:plain

5.ストーリーボードのオブジェクトとクラスファイルの紐付け
 3.で作ったクラスファイル名「TableViewController」をコピーして、
f:id:Sediment:20150306154526p:plain
ストーリーボードでRootViewControllerのClassに貼り付けて、リターン。Classの項目は、Identity inspectorにある。
f:id:Sediment:20150306154818p:plain

6.RootViewControllerのTable Viewの設定確認と、コードとの紐付け
 まずはTable Viewの確認。ストーリーボードのTable ViewのAttributes inspectorを開き、以下の状態になっていること。
f:id:Sediment:20150306161848p:plain

Content: Dynamic Prototypes
Prototype Cells: 1
Selection: Single Selection

 Assistance editorを選択し、右側の画面を「TableViewController.h」に変更する。
f:id:Sediment:20150306162625p:plain
 ストーリーボードのTable Viewのオブジェクト上でControlを押しながら、「TableViewController.h」の@interfaceの下の行あたりにドロップ。
f:id:Sediment:20150306163449p:plain
StrageがStrongタイプであることを確認し、「tableView」という名前にする。
f:id:Sediment:20150306163534p:plain

7.インスタンス変数を宣言しておく
 「TableViewController.h」の@interfaceの下あたりに以下を追記。

// property*itemsは手入力、ストーリーボードとのひもづけなし
@property NSArray *items;

 貼り付け後の「TableViewController.h」はこうなっているはず。
fess-json/TableViewController.h at master · csny/fess-json · GitHub

8.RootViewControllerのTable View Cellの設定
 StyleをSubtitleに変更。identifierに「Cell」と入力。ストーリーボードの操作はここまで。
f:id:Sediment:20150306164817p:plain

9.TableViewController.mのコード修正
 コードの最終形がこれなので、「TableViewController.m」の中身を丸ごと消して、書き換えてもおk。
fess-json/TableViewController.m at master · csny/fess-json · GitHub

 肝は、以下の3つ。
 9.1.(void)viewDidLoadの修正。
f:id:Sediment:20150315212233p:plain
 9.2.(void)getJSONメソッドの追加。
f:id:Sediment:20150315212255p:plain
 9.3.tableview必須の以下の2つのメソッドを追加。
tableView numberOfRowsInSection:
tableView cellForRowAtIndexPath:
f:id:Sediment:20150315212307p:plain
 これで完成。



10.おまけ
 新しくViewControllerを追加し、
f:id:Sediment:20150306174858p:plain
RootViewControllerにボタンを追加し、
f:id:Sediment:20150306174913p:plain
ボタンから新しいControllerViewにshow Segue(昔のpush segue、deprecated済み)を追加してやると、
f:id:Sediment:20150306172551p:plain
新しいViewControllerに、漏れなくBack機能が付いてきて便利。
f:id:Sediment:20150306182021p:plain
NavigationControllerか、やるじゃん!

広告を非表示にする