こんばんは、yusuke#9です。
今回はボタンに反応させるアプリを作ってみましょう！
ボタンを押して画像を見えたり消えたりさせます。
Window-Based Applicationのプロジェクトを作成します。
プロジェクト名を"ButtonActionSample"としました。
名前は何でもよいですが、説明はこの名前でやります。
先にイメージを説明します。
画像に対して"image"と名前を持たせます。名前をつけることで
表示の切替を制御できます。
また、その制御をするために、ボタンのアクションを関連付けます。
関連づけるメソッドを"btnTouch"とします。
最初にコードを書いてしまいましょう。
ButtonActionSampleAppDelegate.hに次のコードを追加します。
画像はUIImageViewクラスに格納されます。実装はあとでInterface Builderを使うので、
宣言だけで大丈夫です。
ボタンのアクションもInterface Builderで関連付けをしますので、メソッドを宣言しておきます。
続けて、ButtonActionSampleAddDelegate.mに処理を追加します。
@synthesizeというのは、.hで宣言した@propertyとセットで、
定義した変数に対してアクセスできるようにします。
この辺、ぼくも詳しくはわからないのですが、こう書けば問題なく動きますので、
決まりだと思っててよいと思います。
btnTouchにはボタンを押したときの処理を書いておきます。
image.hiddenというのは、画像を格納したimageの表示状態を表す
hiddenというプロパティを示しています。
Objective-CのBOOL型にはYES/NOとTRUE/FALSEの書き方があるのですが、
どうやらこれは同じことのようです。書きやすいほうで書いていいですよ、
ってことだと解釈して他の言語でなじみの深いTRUE/FALSEのほうを使ってます。
特別な意味あるんですかね？？
で、image.hiddenはTRUE(YES)ならば非表示、FALSE(NO)ならば表示されます。
これで、コードは完成です。あとはInterface Builderで定義していきます。
MainWindow.xibをダブルクリックしてInterface Builderを起動しましょう。
まず、画像を組み込みます。
LibraryからImage Viewをウインドウにドラッグアンドドロップしてください。
ここで画像ファイルを用意してください。なんでもいいです。
ぼくは"image.png"というファイルを用意しました。
これをプロジェクトに組み込んでおきます。
Finderで画像ファイルを選んで、Xcodeの左側のリストのほうに
optionを押しながらドラッグアンドドロップすると、
ファイルごとプロジェクトにコピーされます。
Interface Builderに戻って、画像を設定します。
Inspectorウインドウを探してください。なければ
を押して開きます。
ImageViewが選択されている状態にしてください。ウインドウをクリックするか、
ファイル名のついたウインドウから選択することもできます。
この状態でImageのプルダウンからimage.pngを選択します。
画像をオブジェクトのサイズがあっていないので、サイズをあわせます。
あとは、画像を適当な位置に移動させてください。
続けて、ボタンを配置します。
LibraryからRound Rect Buttonをウインドウにドラッグアンドドロップします。
配置したボタンをダブルクリックすると文字入力ができるので、
文字をいれておきます。
これで配置は完了です。
続けて関連づけをしています。
ButtonActionSampleAppDelegateのところをcontrolを押しながらクリックして、
黒い画面を開きます。
Outletsのところからimageの横の○をクリックしたままウインドウの画像の
ところにドロップ。関連付けができます。
同じように、btnTouch:の横の○をボタンの上にドロップします。
このときにさらにウインドウが表示されるので、touchDownを選びます。
これで関連づけできました。
保存してXcodeに戻り、ビルドと実行をします。
以上です。
せっかくなので作ったファイルをダウンロードできるようにしました。
http://yupj.jp/ameblo-binary/101227/ButtonActionSample.zip
今回はボタンに反応させるアプリを作ってみましょう！
ボタンを押して画像を見えたり消えたりさせます。
Window-Based Applicationのプロジェクトを作成します。
プロジェクト名を"ButtonActionSample"としました。
名前は何でもよいですが、説明はこの名前でやります。
先にイメージを説明します。
画像に対して"image"と名前を持たせます。名前をつけることで
表示の切替を制御できます。
また、その制御をするために、ボタンのアクションを関連付けます。
関連づけるメソッドを"btnTouch"とします。
最初にコードを書いてしまいましょう。
ButtonActionSampleAppDelegate.hに次のコードを追加します。
@interface ButtonActionSampleAppDelegate : NSObject{
UIWindow *window;
UIImageView* image; // 追加（画像を格納する変数）
}
@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet UIView *image; // 追加（外部から参照できるように）
- (IBAction)btnTouch:(id)sender; // 追加（ボタンアクションを組み込むメソッド）
@end
画像はUIImageViewクラスに格納されます。実装はあとでInterface Builderを使うので、
宣言だけで大丈夫です。
ボタンのアクションもInterface Builderで関連付けをしますので、メソッドを宣言しておきます。
続けて、ButtonActionSampleAddDelegate.mに処理を追加します。
@implementation ButtonActionSampleAppDelegate
@synthesize window;
@synthesize image; // 追加
// 追加
- (IBAction)btnTouch:(id)sender{
if (image.hidden){
image.hidden = FALSE;
}
else{
image.hidden = TRUE;
}
}
@synthesizeというのは、.hで宣言した@propertyとセットで、
定義した変数に対してアクセスできるようにします。
この辺、ぼくも詳しくはわからないのですが、こう書けば問題なく動きますので、
決まりだと思っててよいと思います。
btnTouchにはボタンを押したときの処理を書いておきます。
image.hiddenというのは、画像を格納したimageの表示状態を表す
hiddenというプロパティを示しています。
Objective-CのBOOL型にはYES/NOとTRUE/FALSEの書き方があるのですが、
どうやらこれは同じことのようです。書きやすいほうで書いていいですよ、
ってことだと解釈して他の言語でなじみの深いTRUE/FALSEのほうを使ってます。
特別な意味あるんですかね？？
で、image.hiddenはTRUE(YES)ならば非表示、FALSE(NO)ならば表示されます。
これで、コードは完成です。あとはInterface Builderで定義していきます。
MainWindow.xibをダブルクリックしてInterface Builderを起動しましょう。
まず、画像を組み込みます。
LibraryからImage Viewをウインドウにドラッグアンドドロップしてください。
ここで画像ファイルを用意してください。なんでもいいです。
ぼくは"image.png"というファイルを用意しました。
これをプロジェクトに組み込んでおきます。
Finderで画像ファイルを選んで、Xcodeの左側のリストのほうに
optionを押しながらドラッグアンドドロップすると、
ファイルごとプロジェクトにコピーされます。
Interface Builderに戻って、画像を設定します。
Inspectorウインドウを探してください。なければ
を押して開きます。ImageViewが選択されている状態にしてください。ウインドウをクリックするか、
ファイル名のついたウインドウから選択することもできます。
この状態でImageのプルダウンからimage.pngを選択します。
画像をオブジェクトのサイズがあっていないので、サイズをあわせます。
あとは、画像を適当な位置に移動させてください。
続けて、ボタンを配置します。
LibraryからRound Rect Buttonをウインドウにドラッグアンドドロップします。
配置したボタンをダブルクリックすると文字入力ができるので、
文字をいれておきます。
これで配置は完了です。
続けて関連づけをしています。
ButtonActionSampleAppDelegateのところをcontrolを押しながらクリックして、
黒い画面を開きます。
Outletsのところからimageの横の○をクリックしたままウインドウの画像の
ところにドロップ。関連付けができます。
同じように、btnTouch:の横の○をボタンの上にドロップします。
このときにさらにウインドウが表示されるので、touchDownを選びます。
これで関連づけできました。
保存してXcodeに戻り、ビルドと実行をします。
以上です。
せっかくなので作ったファイルをダウンロードできるようにしました。
http://yupj.jp/ameblo-binary/101227/ButtonActionSample.zip