足し算
2つの入力エリアに入力された文字を足した値を画面に表示するアプリを作成します。
1 – プロジェクトを作成する
Welcomeウィンドウの[新規作成]セクションからiPhoneを選択します。
アプリをを作成する準備ができました。
2 – 画面を作成する
入力エリアの挿入
-
ツールバーの挿入メニューを開きます。
4. インディケータの「Text Input」セクションの「入力の型」をクリックします。
5. 「入力の型」を「数字」に変更します。
6. キャンバス上で右クリックをしてレイヤメニューを表示し、「複製」をクリックします。
7. 複製されたレイヤは同じ位置にあるので、両方のレイヤが見えるようにレイヤをドラッグして位置を変更します。
テキストレイヤの挿入
8. 挿入メニューから「テキスト」を選択します。
9. 画面上の自由なテキストを挿入したい位置をクリックしてテキストレイヤを追加します。
10. テキストレイヤをダブルクリックしてテキスト編集モードに入ります。
11. キーボードから入力を行なってテキストレイヤの内容を「0」にします。
3 – Blue Printを編集する。
1. 1つ目の入力エリアを選択します。
2. 「BluePrintを編集」ボタンをタップします。
3. 変更時に呼ばれるノードが追加されます。
ナビゲーションタブから「デザイン」を選択してデザインキャンバスに戻ります。
4. 2つ目の入力エリアを選択して「BluePrintを編集」をクリックします。
5. BluePrintエディタを右クリックして「文字を数字に」というノードを追加します。
これを2回繰り返して2つの「文字を数字に」というノードを追加します。
6. 2つの「入力エリアの変更時」というノードと「文字を数字に」というノードをそれぞれ接続します。
7. BluePrintエディタを右クリックして足し算を行うための「＋」というノードを追加します。
8. 2つの「文字を数字に」というノードと「＋」ノードを接続します。
9. BluePrintエディタを右クリックして「数字を四捨五入」というノードを追加します。
10. 「＋」ノードと「数字を四捨五入」というノードを接続します。
11. ナビゲーターエリアのレイヤセクションから「テキスト」をBluePrintエディタにドラッグ＆ドロップして、テキストを変更するためのノードを追加します。
12. 「数字を四捨五入」ノードと「テキストをセット」ノードを接続します。
13. 2つの「入力エリアの変更時」ノードのイベントソケットを「テキストをセット」ノードのイベントソケットに接続します。
3. Xcodeが自動的に立ち上がります。左上の実行ボタンからアプリの実行を行うことが可能です。
Xcodeがインストールされてない場合は「Xcodeが必要です」というウィンドウが表示されます。「Install」ボタンからXcodeをインストールしてください。
4. 実行を行うとアプリを使用することができるようになります。
