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

バーゲン教師を作る

今回は，実際にリリースされているアプリを見ながら，これまでに学んだことを復習していきます。まずは，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...」を選択してファイルに書き出しましょう。