.-- --

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
スポンサー広告 comment(-) trackback(-)
.12 2009

Interface Builder を使ってみる(2)

Tasaki です。

前回、途中までだった Interface Builder の
導入手順の続きを紹介します。

前回の最後の操作では、クラスアウトレットを追加しました。
これを使ってクラス同士を結びつける必要があります。
Nib ファイルウィンドウのアウトレットを追加したクラスの
アイコン上でControl + クリック操作を行うと
下のようなポップアップが表示されます。
これはコネクションパネルと呼ばれています。

Popup1.png

Outlets の下に追加したアウトレットが表示されていますね。
window の行の右には◉が表示されていますが、
label の行の右には○が表示されています。
◉はクラスが対応済みであるのに対し、
○はクラスが未対応であることを表します。

それでは、label の右にある○を選択し、
そのまま Nib ファイルウィンドウの Label( Label ) へドラッグ&ドロップしてみます。
すると、下のように◉に表示が変わりました。
これでクラスとアウトレットが対応しました。

Popup2.png

次に Nib ファイルウィンドウ上の Label を
Window の任意の位置へドラッグ&ドロップします。

Layout.png

ひとまず、Interface Builder での作業は完了しましたので、
メニューから "File" > "Save" を選び、保存します。

次に Xcode で、Window の例にならい、
アウトレットを追加したクラスのインターフェース部に
UILabel *label オブジェクト変数を
IBOutlet UILabel *label プロパティを追加します。
コードはこのようになります。
#import <UIKit/UIKit.h>

@interface IBTestAppDelegate : NSObject < UIApplicationDelegate > {
UIWindow *window;
UILabel *label;
}

@property ( nonatomic, retain ) IBOutlet UIWindow *window;
@property ( nonatomic, retain ) IBOutlet UILabel *label;

@end

次に実装部の冒頭に
@synthesize label;
を追加し、
window のサブビューに label を追加します。
実装部のコードはこのようになります。
#import "IBTestAppDelegate.h"

@implementation IBTestAppDelegate

@synthesize window;
@synthesize label;

- ( void ) applicationDidFinishLaunching:( UIApplication *) application {
 [ window addSubview: label ];
 [ window makeKeyAndVisible ];
}

- ( void ) dealloc {
 [ label removeFromSuperview ];
 [ window release ];
 [ super dealloc ];
}

@end

これで完成です。
ビルドして実行すると、シミュレータでは、このように表示されます。

Simulator.png
Interface Builder 側だけで完結しないのが
今ひとつしっくりきませんが、
これで、UI の設計はコードをいじることなく
視覚的に行えるようになります。

最終的に Nib ファイルを使わない場合でも、
初めのうちはこのようにして、
レイアウトを考えておくのも
いいのではないでしょうか?

なにより、デモ画面の制作などには
特に活用できる気がします。


関連記事
スポンサーサイト

Comment

Post comment

  • comment
  • secret
  • 管理者にだけ表示を許可する

Trackback

trackbackURL:http://appteam.blog114.fc2.com/tb.php/15-24dbf796

ブログ内検索

関連リンク

製品情報

最新記事

カテゴリ

プロフィール

neoxneo



NEXT-SYSTEM iOS Developers Blog


  • UTO:
    カナダ版iPhone4Sは、マナーモードでシャッター音がならない…


  • Ehara:
    ...


  • Hayate:
    ...


  • Tasaki:
    Developer登録完了...したのはいいけど


  • Ueda:
    ...



リンク

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