0
    いよいよ今回は、アプリに動きを加えていきたいと思います

    [今回の内容]
    ■ImageViewを作る〜座標を考える
    ■UIButton(ボタン)を作る


    ■ImageViewを作る〜座標を考える

    はじめに復習を兼ねて、キリンさんのUIImageViewをつくります

    ではまずは、UIImageViewから...

    TestGameViewController.h を選択します
    そして、キリンさんの UIImageView である kirinIV を追加しましょう

    UIImageView *greenIV, *kirinIV;

    ViewContoroller.h

    文字数が増えますが、もちろんこっちの書き方でも問題ありません

    UIImageView *greenIV;
    UIImageView *kirinIV;

    ViewContoroller.h_2

    画像やボタン、ラベルなどが増えてくると、見づらくなりそうなので、
    今回は、はじめの書き方にしておきます

    次は、TestGameViewController.m の中身です

    キリンさん(kirinIV)を配置しますが、サイズを縦横ともに40ピクセルにして、
    画面中央に配置しましょう
    iPhoneの画面が、横:320ピクセル/縦:480ピクセルなので、
    真ん中は、X座標:160.0/Y座標:240.0 ですね?

    色はもちろん黄色(yellowColor)で!

    記述方法は、greenIVと同じです

    - (void)loadView
    {
        [super loadView];
       
        UIView *view = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
        view.backgroundColor = [UIColor brownColor];
        [self.view addSubview:view];
        [view release];
       
        greenIV = [[UIImageView alloc] initWithFrame:CGRectMake(0.0, 0.0, 50.0, 50.0)];
        greenIV.backgroundColor = [UIColor greenColor];
        [self.view addSubview:greenIV];
       
        kirinIV = [[UIImageView alloc] initWithFrame:CGRectMake(160.0, 240.0, 40.0, 40.0)];
        kirinIV.backgroundColor = [UIColor yellowColor];
        [self.view addSubview:kirinIV];

    }

    そして、dealloc もお忘れなく

    - (void)dealloc
    {
        [kirinIV release];
        [greenIV release];
       
        [super dealloc];
    }

    ViewContoroller.m

    えぇい、[Run]!
    run_kirin


    ?... ???... ちょっと真ん中じゃないような?

    そうです、真ん中じゃないんです(気付いてました?)

    先ほど指定した座標は、キリンさんの四角の左上の角になるので、
    中心から少し右下にずれた位置に配置されるんです

    ということは、キリンさんのサイズが 40ピクセルx40ピクセルなので、
    X,Y座標ともに、20ピクセルずつずらせばいいのかな?

    だから〜、中央が (160.0, 240.0) なので〜
    (160.0-20.0, 240.0-20.0) で〜
    座標は、(140.0, 220.0) ですね!
    revise

    では、修正しましょう

        kirinIV = [[UIImageView alloc] initWithFrame:CGRectMake(140.0, 220.0, 40.0, 40.0)];
        kirinIV.backgroundColor = [UIColor yellowColor];
        [self.view addSubview:kirinIV];


    position

    そして、[Run]!
    run_kirin

    キリンさんは無事、中央に移動することができました... めでたし

    ...


    ■UIButton(ボタン)を作る

    で〜も〜、キリンさんがジッとしてたら面白くないので、
    キリンさんを移動させるためのボタンをつくりましょう

    ボタンは、UIButton でつくります

    では、TestGameViewController.h

    ボタンの名前は「moveLBT」にしましょう
    「L」ってなに?... ここはまぁ何も聞かず「L」にしといてください
    @interface TestGameViewController : UIViewController
    {
        UIImageView *greenIV, *kirinIV;
       
        UIButton *moveLBT;
    }

    UIButton

    そして、TestGameViewController.h へ移ってボタンをつくっていきますが、
    今回はまず、初期化と座標・サイズの指定だけしておきます
    - (void)loadView
    {
        [super loadView];
       
        UIView *view = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
        view.backgroundColor = [UIColor brownColor];
        [self.view addSubview:view];
        [view release];
       
        greenIV = [[UIImageView alloc] initWithFrame:CGRectMake(0.0, 0.0, 50.0, 50.0)];
        greenIV.backgroundColor = [UIColor greenColor];
        [self.view addSubview:greenIV];
       
        kirinIV = [[UIImageView alloc] initWithFrame:CGRectMake(140.0, 220.0, 40.0, 40.0)];
        kirinIV.backgroundColor = [UIColor yellowColor];
        [self.view addSubview:kirinIV];
       
        moveLBT = [[UIButton alloc] initWithFrame:CGRectMake(110.0, 380.0, 100.0, 50.0)];
    }
    ※ボタンなので赤いところに注意!

    もちろん、dealloc
    - (void)dealloc
    {
        [moveLBT release];
       
        [kirinIV release];
        [greenIV release];
       
        [super dealloc];
    }

    initialize

    このまま [Run] しても何もおきませんので、
    これから、ボタンの機能と見た目を追加していきます

    (修正:2011/9/23---以下の作業は必要ありませんでした)
    TestGameViewController.h にもどって、一行追加します
    追加の位置に気をつけて
    @interface TestGameViewController : UIViewController
    {
        UIImageView *greenIV, *kirinIV;
       
        UIButton *moveLBT;
    }

    - (void) moveL_touchDown:(id)sender;

    @end

    action
    (修正ココマデ)


    TestGameViewController.m でボタンの詳細を...

    まずは、以下の記述を
    -(void)loadView の } の下にしておきましょう
    - (void) moveL_touchDown:(id)sender
    {
        NSLog(@"MOVE");
    }
    これは、ボタンを押したときに呼び出される部分になります
    NSLog についてはもう少しあとに説明します

    そして、ボタンの記述は、6行追加
    moveLBT = [[UIButton alloc] initWithFrame:CGRectMake(120.0, 400.0, 80.0, 50.0)];
    [moveLBT setTitle:@"MOVE" forState:UIControlStateNormal];
    [moveLBT setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [moveLBT addTarget:self action:@selector(moveL_touchDown:)
                                            forControlEvents:UIControlEventTouchDown];

    moveLBT.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:moveLBT];

    1行目:ボタンに「MOVE」の文字をセットする
    2行目:文字の色を黒にする
    3〜4行目:ボタンを押したときの動作を指定(一行で書いてよい)
    5行目:ボタンの色を白にする
    6行目:Viewに貼り付ける

    注目してほしいところは、3〜4行目ですが、
    赤い文字のところが、先に追加した - (void) moveL_touchDown:(id)sender と
    同じになっています
    これは、「ボタンを押したときに moveL_touchDown の内容を呼びますよ」ってことです

    button

    それでは、いよいよ [Run] してみましょう
    run_button

    それでは、ボタンを押してみてください...

    ...

    ...

    何も起こりません...

    ...

    呼び出されるはずの - (void) moveL_touchDown:(id)sender の中には
    NSLog(@"MOVE");
    と記述しています
    で、NSLog ってなんだ???

    でも、ちょっとまって?
    プログラムの下になにか出てますね
    NSLog

    実は、ボタンを押して - (void) moveL_touchDown:(id)sender を呼び出し、
    NSLog 通過したときに「All Output」の欄に、
    NSLog の @"〜" の中身が表示されていたのです

    今回は MOVE って表示されてます(よね?)

    これで、ボタンが反応していることが、めでたく確認できました
    (何度かボタンを押してみて確認してください)

    このように、NSLog を使うことで、
    プログラムがちゃんと動いているのかを確認することができます

    例えば、思ったように動かなかったり、エラーで強制終了されたりした時に、
    それらしきところに NSLog を挿入することで、その原因を特定しやすくなります

    ... さて、終わりますか?

    でも、MOVE って出るだけじゃ面白くありませんね

    なので、がんばります

    が、長くなったので、続きはこの後すぐ!



    この記事のトラックバックURL
    トラックバック

    Calendar
    S M T W T F S
       1234
    567891011
    12131415161718
    19202122232425
    262728293031 
    << August 2018 >>
    My Apps
    有料アプリ

    無料アプリ

    Selected entries
    Categories
    AdSense
    Sponsored Links
    Archives
    Recent comment
    Links
    Profile
    Search this site.
    Others
    Mobile
    qrcode
    powered
    無料ブログ作成サービス JUGEM