うたた寝ラウンジ

Lounge for Nap

状態によってボタンの背景色を変更する方法

iOSの開発もずいぶん普及してきたようだ。本屋に行けば多くの本が販売されているし、Appleのドキュメントも充実しているし、ググればだいたいの事が分かる。調べてすぐに分かるような事をブログに残しても仕方がないので、iOS開発の後発者である自分のブログネタになるようなものは(まだ)本当に少ない。今回はその少ないネタの一つ。ググってもすぐに解決しなかったものがあったので書いておく。その貴重な(?)ネタは、「ボタンの背景色を変える方法」。標準でインストールされている時計アプリのストップウォッチのようなボタンを実装する方法だ。

ヒントになったのはAppleiPhoneMixerEQGraphTestというサンプル。(ヒントと言うよりは回答そのもの。)細かな解説は省いて、「こうすれば出来る」というポイントのみ書いておく。(ちなみに、Appleのサンプルはかなり充実しているので、困った時やヒントが欲しい時に参照してみる事をお勧めする。)


1. リソースを用意する。

 今回は、iPhoneMixerEQGraphTestのgreen_button.pngとred_button.pngを流用する。


2. ボタンを作成。IBOutletで変数と関連づける。

 IBOutlet UIButton *startButton;


3. viewDidLoad()において、ボタン用のイメージを用意し、背景イメージとして関連づける。

 // 開始用のボタン

 UIImage *greenImage =

  UIImage imageNamed:@"green_button.png"]

   stretchableImageWithLeftCapWidth:12.0 topCapHeight:0.0];

 [startButton setBackgroundImage:greenImage forState:UIControlStateNormal];



 // 終了用のボタン

 UIImage *redImage =

  UIImage imageNamed:@"red_button.png"]

   stretchableImageWithLeftCapWidth:12.0 topCapHeight:0.0];

 [startButton setBackgroundImage:redImage forState:UIControlStateSelected];



4. 任意のメソッド(例えばボタンの押下処理)において状態によって背景のイメージを切り替える

 if (isPlaying)
 {

  self.startButton.selected = NO;

 }

 else

 {

  self.startButton.selected = YES;

 }


こんな感じで実装できる。もちろん、キャプション文字列の変更も可能。

f:id:yamamotonow:20110103144859p:image
f:id:yamamotonow:20110103144900p:image