スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


このエントリーをはてなブックマークに追加

ViewBasedApplicationからテーブルビューに遷移(サンプルあり)

テーブルビューやナビゲーションビューを扱いたい場合、Navigation-Based Applicationを使うのが手っ取り早い。しかし、View-Based Applicationからこれらのビューに遷移する場合は以外と面倒になる。

今回は、ビュー上の「設定画面」ボタンをクリックするとテーブルビューが表示されるようなプルグラムを作ってみた。

(1)View Based Applicationのプロジェクトを作成

「NaviTest」という名前で新規プロジェクトを作成。この時、「View Based Application」を選択する。

(2)ビューに「設定画面」のボタンを貼付ける

navi-1.jpg

(3)ボタン押下時のイベント処理関数を作成

ボタンが押された時に実行される関数を作成する。

NaviTestViewController.hに以下のコードを追加。


- (IBAction)onClickSetting;



続いてNaviTestViewController.mにも以下のコードを追加。


// 「設定画面」ボタン押下時イベント処理
- (IBAction)onClickSetting {

}



最後にInterfaceBuilderでアクションとコントロールを結びつける。
(NaviTestViewController.xibのFile's Ownerで右クリック。OnClickSettingの○印をボタンまでドラッグして、「Touch Up Inside」を選択)

(4)Window.xibにNavigationViewControllerを追加

InterfaceBuilderでMainWindow.xibにNavigation Controllerを追加する。

navi-03.jpg

(5)テーブルビュー用のUIViewControllerを追加

ファイルメニュー>新規ファイル でUIViewControllerを追加する。
この時、「UITableViewController subclass」と「With XIB for user interface」にチェックを付けておく。ファイル名は「SettingViewController.m」としておこう。

(6)追加したビューに最低限のコードを追加

追加したばかりのUITableViewControllerのサブクラスは、そのままではコンパイルすら通らない。そこで、サンプルとして最低限のコードを追加する。元々の関数を編集して以下のようにしよう。


- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    // Return the number of sections.
    return 1;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    // Return the number of rows in the section.
    if (section == 0) {
        return 1;
    }
    else {
        return 0;
    }
}

// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    static NSString *CellIdentifier = @"Cell";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
    }
    
    // Configure the cell...
    if (indexPath.section == 0 && indexPath.row == 0) {
        cell.textLabel.text = @"第1セクション1行目";
    }
    
    return cell;
}



NavigationControllerの上に乗っているビューを(6)で追加したテーブルビューに設定するために、以下の操作を行う。
まずはInterfaceBuilderで以下の項目を選択。
 →MainWindow.xib>NavigationControll>View Controller (Root…)
Identify Inspectorの第4(iマーク)タブのClassを「SettingViewController」に変更

navi-04.jpg

(8)Delegateクラスに各ビューへの参照を追加

現時点では、それぞれのビューコントローラはお互いを参照できないので、Delegateクラスにその参照を設定する。スマートなやり方かどうかは怪しいが、Delegateクラスはグローバル変数的な使い方が出来るので便利♪(多分あまりよくないんだろうな~)

まず、NaviTestAppDelegate.h を以下のようにする。


#import <UIKit/UIKit.h>
#import "SettingViewController.h"

@class NaviTestViewController;

@interface NaviTestAppDelegate : NSObject <UIApplicationDelegate> {
    UIWindow *window;
    NaviTestViewController *viewController;
    UINavigationController *naviController;
    SettingViewController *settingViewController;
}
    
@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet NaviTestViewController *viewController;
@property (nonatomic, retain) IBOutlet UINavigationController *naviController;
@property (nonatomic, retain) IBOutlet SettingViewController *settingViewController;

@end



次に、ヘッダファイルにも以下の2行を追加。


@synthesize naviController;
@synthesize settingViewController;



最後に、これらをビューとアウトレットで接続する。

**** 2010/11/10追記 ****
コメントで質問があったため、アウトレットの接続方法を追記。
(settingViewControllerで説明しますが、naviControllerも同様の手順です)

Interface BuilderでXIBファイルを開き、Delegateクラス上で右クリックする。
下の画像のようなポップアップが出るので、settingViewControllerの右端の○印を紐付けたいオブジェクトにドラッグする。

outlet.jpg

この操作によって、上記コードで宣言したプロパティsettingViewControllerに、Interface Builderで作成したビューコントローラのインスタンスを設定します。通常、ビューコントローラのインスタンスは、専用のxibファイルを作成して、プログラムコード(initWithNibName)で生成するのが一般的ですが、この方法では、MainWindow.xibファイル読み込み時に、自動的にインスタンスが生成されます。
**********************************

(9)テーブルビュー呼び出しのコードを作成

NaviTestViewController.mのonClickSettingメソッドに、テーブルビュー(ナビゲーション)表示のコードを追加する。


// 「設定画面」ボタン押下時イベント処理
- (IBAction)onClickSetting {
    NaviTestAppDelegate *app_del = (NaviTestAppDelegate*)[[UIApplication sharedApplication] delegate];

    // 現在のビューを親ウィンドウから削除
    [self.view removeFromSuperview];

    // 設定画面のナビゲーションを表示
    [app_del.window addSubview:app_del.naviController.view];
}



これで、「設定画面」ボタンをクリックすると、ナビゲーション+テーブルビューの画面に遷移する。では、戻るにはどうしたらいいか?
・・・それはまた今度。(今日は眠いので)

**** 2010/11/10追記 ****
サンプルはこちら
**********************************


このエントリーをはてなブックマークに追加

コメント

非公開コメント

お教え願います。

初めまして、お世話になります。
とても参考にさせて頂いているのですが、
「settingViewController」について
コンパイルエラーが発生してしまいます。
おそらく、「(8)Delegateクラスに各ビューへの参照を追加」の
最後の行の「最後に、これらをビューとアウトレットで接続する。」が
出来ていないのだと思うのですが、
やり方がわからないので、もう少し詳しくお教え願えないでしょうか?
初心者なもので申し訳ありませんが宜しくお願いいたします。

Re: お教え願います。

>八咫烏さん
初めまして。コメントありがとうございます。
アウトレットの接続をしていなくても、コンパイルは通るような気がします。プロパティがnilになるので正しく動作はしませんけど・・・。
省略して記述している部分や誤記等もあると思うので、記事の末尾にサンプルプログラムを追加しておきました。
アウトレットの接続についても、詳しいやり方を記事に追記しています。参考になれば幸いです。

No title

サンプルプログラム有難う御座います。
おかげ様で自分の至らなかった所がよくわかりました。

「NaviTestAppDelegate」の「Outlets」の設定が
(正しく理解)出来ていませんでした。
また、コンパイルが通らなかったのは、
恥ずかしながらヘッダファイルの宣言が足りなっかたみたいです。
(初歩的なミスでスイマセン!)

今回の件、本当に有難う御座いました。
また、質問させて戴く事があるかもしれませんが
その時は、よろしくお願い致します。


Re: No title

解決おめでとう御座います。
私もまだまだ初心者なので、情報共有しながら頑張りましょう!!
iPhoneアプリ紹介
パズルナビ for パズドラ 2016
最強のコンボツール!
colorization-large-icon.png

スクリーンショットを読み込むとコンボを自動計算してくれるパズドラの攻略アプリです。


AirRuler
(簡易距離計)

リモートで簡単に距離を測定できるアプリ!
colorization-large-icon.png

目標地点に向けてiPhoneを傾けるだけで簡単に距離を測定できます。ゴルフの距離測定機能付きパターの代わりにも使えます。


補色残像アート
~見えない色が見えてくる~
白黒なのにカラーに見えてしまう不思議な映像を体験しよう!
colorization-large-icon.png

補色残像という目の錯覚を利用して、白黒写真がカラーに見える不思議な映像を作成できます。作成した映像は、アニメGIFに変換したり、Twitterに投稿することもできます。


タイピング革命
フリック練習はタイピング革命で!ネットランキングで盛り上がろう!
icon-l-typing.jpg

オンラインランキング上のプレイを閲覧できるリプレイ機能付き!フリック入力とローマ字入力に完全対応したタイピング練習アプリです。初心者も安心のトレーニングモード付き。

★なんと!あのAppBank様に紹介して頂きました!!
typing-sale-led.gif


簡単3Dカメラ
iPhoneで手軽に3D写真を楽しもう!平行法/交差法/アナグリフ/グラグラ3Dに対応。
icon-l-3d.jpg

2枚の写真を撮影するだけで、裸眼で立体視できる3D写真が作成できます。85円でステレオ写真もアナグリフも楽しめるのは簡単3Dカメラだけ!

プロフィール

あらきんぐ☆

Author:あらきんぐ☆
はじめまして。あらきんぐです。
4月からiPhoneを購入し、その魅力に取り付かれて、気がついたらアプリ開発の道へ!仕事でプログラム開発をしていますが、基本「動けばOK!」な適当エンジニアです。適当でもアプリは作れる!っていう事を、ブログを通じて証明していきたと思います。

最新記事
最新コメント
最新トラックバック
カテゴリ
FC2カウンター
全記事表示リンク

全ての記事を表示する

Twitter
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR
アクセスランキング
[ジャンルランキング]
コンピュータ
385位
アクセスランキングを見る>>

[サブジャンルランキング]
プログラミング
51位
アクセスランキングを見る>>
オススメ商品
iPhone/iPodと一般オーディオを繋ぐ貴重なアイテム!
アプライドオリジナルアイテム MBB...

アプライドオリジナルアイテム MBB...
価格:3,980円(税込、送料別)

開発中級者にオススメ!「こんなことができるんだ!」と驚かされる一冊
【送料無料】iPhone...

【送料無料】iPhone...
価格:1,500円(税込、送料別)

安い!シンプル!カッコいい!
希少なiPhone対応キーボード内蔵ケース
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。