iPhoneアプリ開発、その(38)　PNG画像を使ったボタンでアニメーション

　ど～も、のっぺらぼうのボタンがイマイチだよね。
　なので、ボタンに画像を使ってみます。PNG画像が指定できるのでアルファチャネルによるマスクも可能。
　アルファチャネルがない画像を画像の上に重ねると以下のように上になった画像でばっさり覆われちゃうわけだけど
Fig.1
　アルファチャネル付きだと、重ねるときに下側の画像を見せるべきか上側の画像を見せるべきかの指示情報としてアルファチャネル画像が機能するので以下のように自由な形で画像を重ね合わせることができる。
Fig.2
　でもって階調を持っているので、濃淡も指定可能。
Fig.3
　ま、今回は別に画像を重ね合わせるわけじゃないけど、やりたいのは金色の輪っかが明滅するイメージなんでやっぱアルファは必要。
　使う画像はこんなの。
Fig.4
　PNGファイルのプロジェクトへの登録の仕方はiPhoneアプリ開発、その(22)参照だ。
　で、肝心のボタンへの画像設定の方法は、やっぱりUICatalogに載ってるんだよね～。

　UIButton* bt = [[UIButton buttonWithType:UIButtonTypeRoundedRect] retain];

から

　UIButton *bt = [[UIButton alloc] initWithFrame:frame];

とし

　UIImage* buttonImage = [UIImage imageNamed:@"button.png"];
　[bt setBackgroundImage: buttonImage forState:UIControlStateNormal];

とするだけ。
　絵をボタンの左寄りに配置するか、右寄りか、下よりか、中央よりかは以下のように指定。

　bt.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
　bt.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;

　でも画像はボタンの矩形にぴったりおさまる形で表示されるので、あんま意味ないのでは？
　なんかマージンとかを指定可能なんだろうか？
　とりあえず、今は

　BUTTON_WIDTH

の値をいろいろ変えてみてどんな感じに変わるか試してみるといい。

Fig.5

　ちょっと、おしゃれになった。

　次回はChimpanzeeExaminerを実装してランダムに順序を変えてみる。
------------
サンプルプロジェクト：Chimpanzee-03.zip