XcodeでUIStepperを追加する方法【初心者向け】

iPhoneアプリ開発では、アプリの画面を作るのに便利なUIパーツが多数用意されています。

今回は、XcodeでUIStepper（ステッパー）を追加する方法を初心者向けに解説します。

 

なお本記事は、TechAcademyのiPhoneアプリ開発オンラインブートキャンプの内容をもとに紹介しています。

 

UIStepperについて

UIStepperは、下限値と上限値および増減量を決めて値を変化させるために使います。デフォルトでは「+（プラス）」と「-（マイナス）」のボタンが表示されます。

iOS5から追加されたUIパーツです。

 

 

UIStepperを配置する

ストーリーボードにUIStepperを配置していみましょう。

「Stepper」と表示されている箇所です。

 

これを他のUIパーツでと同じように、ドラッグ&ドロップで配置します。

 

今回は現在の値を示すためにLabelも配置しておきます。

 

また、UIStepperの4つの値（下限値・上限値・現在値・増減量）はインスペクタで設定できます。

パーツの配置は以上です。

 

 

[PR] iPhoneアプリの開発で挫折しない学習方法を動画で公開中

UIStepperの使い方

配置しただけでは動きませんので、動くように設定していきます。

まずはUIStepperのIBOutletを作成します。ドラッグ&ドロップの操作でこのような画面が表示されることを確認してください。

 

この時の名前はuiStepperとしておきます。

 

同じように、値を表示するLabelのIBOutletも作成します。

 

こちらの名前はlabelValueとしました。

 

続いて、UIStepperのActionを作成します。

 

この際の名前はstepperChangedとします。対象となるEventはValue Changedです。

 

ここまで操作すると、ViewController.hに以下の3行が追加されます。

@property (weak, nonatomic) IBOutlet UIStepper *uiStepper;
@property (weak, nonatomic) IBOutlet UILabel *labelValue;
– (IBAction)stepperChanged:(id)sender;

 

最後にUIStepperの値が操作された時の処理を記述します。単純にUIStepperの現在値をラベルに表示するだけのコードです。

– (IBAction)stepperChanged:(id)sender
{
_labelValue.text = [NSString stringWithFormat:@”%zd”, _uiStepper.value];
}

 

これでUIStepperの値を取得することができるようになりました。

今回の記事は以上です。

 

他のUIパーツも追加してみたい場合は、XcodeでUITableViewを追加する方法も合わせてご覧ください。

[お知らせ]TechAcademyでは初心者でも8週間でオリジナルアプリが作れるiPhoneアプリ開発オンラインブートキャンプを開催しています。