目指せ!iPhoneアプリ開発エキスパート

第6回 画面とパーツの調整

この記事を読むのに必要な時間:およそ 3 分

スイッチ

スイッチは,タッチしてオンとオフを切り替えるためのパーツです。タッチするかスライドさせて,スイッチのオンとオフが切り替わるたびにアクションが発生します。

スイッチの配置

スイッチの配置

配置したら,インスペクタで初期状態(State)を選ぶことができます。

初期状態の設定

初期状態の設定

アクションは「Value Changed」に接続します。オンとオフが切り替わるたびにアクションが発生します。

スイッチのアクション

スイッチのアクション

スイッチの値を受け取るには,スイッチが接続されたアウトレットを通じて,次のメッセージを実行します。

[outlet isOn]

値は,オンの場合はYES,オフの場合はNOとなります。アウトレットを作成しなくても,アクションの引数であるsenderをアウトレットの代わりに利用することができます。その場合,次のように書きます。

- (IBAction)myAction1:(id)sender {
  if ([sender isOn] == YES) {
    
    ...
    
    //値がYESの場合の処理を記述
    
  }
}

スライダー

スライダーは,ある範囲内での任意の値を選択するためのパーツです。言葉で表すとわかりづらいですが,パーツの形状を見ればその使い方は一目瞭然でしょう。

スライダーの配置

スライダーの配置

スライダーには,一番左側に動かした時の値,すなわち最小値と,一番右側に動かしたときの値,すなわち最大値を設定できます。スライダーを選択した状態で,インスペクタの「Values」の値を変更して設定します。通常は最小値(Minimum)を0.00に,最大値(Maximum)を1.00に設定しておき,値は小数で受け取ります。初期値(Initial)も設定できます。

値の範囲を設定

値の範囲を設定

アクションはスイッチと同じ「Value Changed」に接続します。スライダーを動かして値が変わるとアクションが発生します。

スライダーのアクション

スライダーのアクション

スライダーの値を受け取るには,スライダーが接続されたアウトレットを通して,次のメッセージを実行します。

[(UISlider *)outlet value]

値は,設定されている最小値と最大値の間の小数となります。スイッチと同様,アクションの引数であるsenderをアウトレットの代わりに利用することができます。

- (IBAction)myAction1:(id)sender {
  if ([(UISlider *)sender value] == 0.5f) {
    
    ...
    
    //値が0.5の場合の処理を記述
    
  }
}

見た目の良さはアプリの良さ

パーツを調整することで,よりアプリらしい見栄えになることを実感していただけたと思います。繰り返しになりますが,パーツの調整は操作性に大きく影響する部分なので,できるだけ操作しやすい配置やわかりやすい画面構成を心がけることが大切です。アプリの良さのすべてが見た目の良さではありませんが,少なくとも見た目の良いアプリは使ってみようという気が起きるものです。

余裕があれば,片手で操作しても使いやすい構成にするとさらに良いでしょう。片手で操作する際は,あまり右上にボタンを配置すると押しづらかったり,あまり左下にボタンを配置すると誤って指の腹でタッチしてしまう,などということがあります。このように,実際にiPhoneやiPod touchで動作させてからは,自分の手で試しながらさらにパーツの配置などを細かく調整していく必要があります。

また,App Storeで配布されている「バーゲン教師」「割勘奉行」は,これまでに紹介したパーツのみを使って作られています。この2つのアプリは<ソースコードを公開>していますので,興味のある方はご覧になってみてください。

次回は,画面の下半分を覆ってしまうキーボードの消し方と,必要に応じて表示する選択肢ダイアログの出し方,さらにプログラム内でデータを保持しておく方法などを学んでいきます。

著者プロフィール

皮(かわ)

1980年宮崎県生まれ。納豆好き。

アイフォーンの皮:http://mixi.jp/view_community.pl?id=3531790