iOS5で搭載された新UI!UIStepper(ステッパー)の使い方

公開日: : 最終更新日:2014/01/06 iOSアプリ開発

2011 10 20 15 15 39

こんにちは。iOS5で追加された新しいAPIをいろいろと試している@akio0911です。

今回は、iOS5で新しく追加されたUI部品「UIStepper(ステッパー)」の使い方を紹介したいと思います。

        

         

UIStepper(ステッパー)とは?

iOS5で新しく追加されたUI部品です。

2011 10 20 15 15 39

右側にある「ー」「+」と書いてあるのが、ステッパーです。

     

ステッパーの使い方

テストアプリを作りながら、解説していきましょう。

     

ラベルとステッパーを配置する

まず、ラベルとステッパーを画面に配置します。

2011 10 20 15 08 50

これがステッパーです。

     

2011 10 20 15 10 13

こんな感じで、ラベルとステッパーを配置します。

    

ラベルのアウトレットを作成する

2011 10 20 15 20 39

ViewControllerに、ラベルのアウトレットを作成します。

    

#import

@interface ViewController : UIViewController

@property (retain, nonatomic) IBOutlet UILabel *label;

@end

2011 10 20 15 20 54

こんな感じ。

   

ステッパーのアクションを作成する

2011 10 20 15 23 31

名前は「changeStepper」としておきましょう。イベントには「Value Changed」を使います。

        

#import

@interface ViewController : UIViewController

@property (retain, nonatomic) IBOutlet UILabel *label;

– (IBAction)changeStepper:(id)sender;

@end

2011 10 20 15 23 46

こんな感じ。

   

ステッパーのアウトレットを作成する

2011 10 20 15 25 52

名前は「stepper」としておきましょう。

    

#import

@interface ViewController : UIViewController

@property (retain, nonatomic) IBOutlet UILabel *label;
@property (retain, nonatomic) IBOutlet UIStepper *stepper;

– (IBAction)changeStepper:(id)sender;

@end

2011 10 20 15 26 02

こんな感じです。

    

ステッパーを初期化する

ステッパーを初期化するコードをviewDidLoadに追加します。

– (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

self.stepper.value = 0;
self.stepper.minimumValue = 0;
self.stepper.maximumValue = 10;
self.stepper.stepValue = 1;
}

2011 10 20 15 26 16

valueは現在の値、minimumValueは最小値、maximumValueは最大値、stepValueはボタンをタップした時の増減値です。

    

ステッパーのアクションに処理を追加する

ステッパーのボタンがタップされたタイミングでラベルの値を書き換えるコードを追加します。

– (IBAction)changeStepper:(id)sender {
self.label.text = [NSString stringWithFormat:@”%d”, (int)self.stepper.value];
}

2011 10 20 15 58 42

changeStepper:メソッドに、上記のようなコードを追加します。stepper.valued現在の値を取得し、それを文字列化してself.label.textに設定しています。

    

実行してみる

シミュレーターで実行してみましょう。

2011 10 20 15 31 07

マイナスボタン・プラスボタンをタップすると、ラベルの値が変化します。

どちらかのボタンを押しっぱなしにすると、値が変化し続けます。

    

押しっぱなしで値が変化しないようにするには

– (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

self.stepper.value = 0;
self.stepper.minimumValue = 0;
self.stepper.maximumValue = 10;
self.stepper.stepValue = 1;
self.stepper.autorepeat = NO;
}

2011 10 20 15 36 14

autorepeatプロパティの値をNOに設定します。

これでボタンを押しっぱなしにしても値が変化しないようになります。

    

まとめ

ステッパーは見た目がシンプルで分かりやすく、UIStepper使いやすいクラスだと思います。

ぜひアプリに組み込んでみてください。

    

iOS5新機能に関する他の記事はこちらからどうぞ。

iPhoneアプリ開発に関する他の記事はこちらからどうぞ。

    

関連記事

サンフランシスコのピア39にあるチャウダーズでクラムチャウダーを食す!

アップルの開発者向けイベント「WWDC2014」に参加するため

ミスドのカルピスドーナツとカルピスポンデリングを食べてみた!

ミスドで期間限定のカルピスコラボ商品「カルピスドーナツ」と「カルピ

十三カレー計画で牛すじカレーネギのせを食す!(大阪・十三)

「iPhoneアプリ開発キャンプ@大阪」のランチで、十三カレー計画

大阪・難波の加寿屋 法善寺でかすうどんを食す。ランチタイムはおにぎり2個まで無料!

大阪・難波の加寿屋 法善寺 (かすうどん KASUYA)で、かす

ライブドアブログで運営していた「あきお商店」を「卵は世界である」に改名しました

少し前からライブドアブログで「あきお商店」というブログをやって

→もっと見る

PAGE TOP ↑