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

第8回 アプリの完成を目指して

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

前回から進めているアプリ開発を,さらに進めて完成させます。

バーゲン教師を作る

今回は,実際にリリースされているアプリを見ながら,これまでに学んだことを復習していきます。まずは,App Storeで公開されている「バーゲン教師」と同じものを作ってみましょう。

バーゲン教師の画面

バーゲン教師の画面

パーツの配置と接続

バーゲン教師の画面構成と動作について説明します。画面上のパーツをより詳しく見ると,次のようになります。

バーゲン教師の画面を構成するパーツ。青い点線で囲まれたパーツは単なるラベル

バーゲン教師の画面を構成するパーツ。青い点線で囲まれたパーツは単なるラベル

まず,(1)のテキストフィールドに金額を入力します。その後,(2)のセグメンテッドコントロールで割引率を選択すると,(3)のラベルに割引率をパーセント表示するとともに,(5)のラベルに割引後の金額が表示されます。(4)のスライダーを左右に動かすことで,5%から95%までの割引率を5%単位で調整することができます。(6)のボタンを押すと,(5)のラベルに表示されている金額と(7)のラベルに表示されている金額を合計して(7)のラベルに再表示します。(8)のボタンを押すとカートをクリアしてよいか確認するダイアログが表示され,ユーザがクリアを選択すると(7)のラベルが0になります。

(1)のテキストフィールドには数字を入力しますので,キーボードは「Number Pad」を選択しておきます。(4)のスライダーは5%から95%までの範囲が選択できるように,ValuesのMinimumを0.5に,Maximumを0.95に設定しておきましょう。

パーツと接続するアウトレットおよびアクションの組み合わせは次の通りです。

アウトレット
  • priceOriginal - (1)テキストフィールド
  • discountButton - (2)セグメンテッドコントロール
  • discountPercent - (3)ラベル
  • discountSlider - (4)スライダー
  • priceNew - (5)ラベル
  • cartPrice - (7)ラベル
アクション
  • buttonValueChanged: - (2)セグメンテッドコントロール / Value Changed
  • sliderValueChanged - (4)スライダー / Value Changed
  • escapeButtonPush: - (2)セグメンテッドコントロール / Value Changed ,(4)スライダー / Value Changed
  • pushAddCart - (6)ボタン / Touch Down
  • pushClearCart - (8)ボタン / Touch Down

これまでアクションの名前には最初から付いている「myAction1:」などを利用してきましたが,これもアウトレットと同じように好きな名前に変更することができます。ただし,変更する際はアクション名の最後に「:」(コロン)を付けるのを忘れないようにしてください。

また,アクション「escapeButtonPush」には2つのパーツのきっかけが設定されていますが,このように複数のきっかけをひとつのアクションに設定することができます。

上記の組み合わせをもとにInterface Builderを使ってパーツを配置し,File's Ownerにアウトレットとアクションを作成して接続してみましょう。これまでに学んだことを生かして,それぞれのアウトレットからどういった情報を取得するのか,またアクションの中ではどういった処理を行うのか,バーゲン教師の機能と見比べながら考えてみてください。

背景色は,パーツが何も選択されていない状態(Viewのタイトルバーをクリックすると選択が解除されます)で,インスペクタの「View Attributes」にある「Background Color」から変更することができます。カラーパレットから好きな色を選びましょう。

パーツの配置とラベルの入力,さらにアウトレット・アクションの接続が完了したら,File's Ownerが選択された状態で「File」「Write Class Files...」を選択してファイルに書き出しましょう。

著者プロフィール

皮(かわ)

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

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

コメント

  • Re: actionsheet

    Class '**ViewController' does not implement the 'UIActionSheetDelegate' protocol.
    の警告は、第7回の5ページ目の「デリゲートの設定」の項を参照すると解決すると思います。

    Commented : #6  ushi (2010/10/23, 17:18)

  • カートに追加するためのボタンが押された時のアクション

    - (IBAction)pushAddCart:(id)sender {
    [cartPrice setText:[NSString stringWithFormat:@"%d", ];
    }
    のところは、
    正しくはこんな感じでしょう。
    int price_new = [ [priceNew text] intValue];
    int cart_price = [ [cartPrice text] intValue];
    cart_price = cart_price + price_new;
    [cartPrice setText:[NSString stringWithFormat:@"%d", cart_price]];

    Commented : #5  ushi (2010/10/23, 17:15)

  • カートに追加するためのボタンが押された時のアクション

    - (IBAction)pushAddCart:(id)sender {
    [cartPrice setText:[NSString stringWithFormat:@"%d", ];
    }
    のところは、
    正しくはこんな感じでしょう。
    int price_new = ;

    Commented : #4  ushi (2010/10/23, 17:13)

  • actionsheet

    UIActionSheet *actionSheet = [[UIActionSheet alloc] initWithTitle:@"カートをクリアしますか?" delegate:self cancelButtonTitle:@"キャンセル" destructiveButtonTitle:@"クリアする" otherButtonTitles:nil];
    の個所で次のエラーがでます。
    Class '**ViewController' does not implement the 'UIActionSheetDelegate' protocol.

    どなたかよろしくお願いします。

    Commented : #3  hiro (2010/07/26, 16:40)

  • コード間違えてますよ

    - (IBAction)pushAddCart:(id)sender {
    [cartPrice setText:[NSString stringWithFormat:@"%d", ];
    }
    のところ
    - (IBAction)pushAddCart:(id)sender {
    [cartPrice setText:[NSString stringWithFormat:@"%d", ]];
    }
    だと思います。

    Commented : #2  人間です (2010/05/23, 01:17)

1ページ(1/2)    

コメントの記入