初心者から始める診断系アプリの作り方(3/5)

【動作環境】

Swift1.2 Xcode6.3 

【対象レベル】

超初心者

【学習内容】

ViewController同士のデータのやり取り

テキストボックスのキーボードの実装

分岐処理(switch文,if文)

配列処理

【再生時間】

20:50


動画の音声の書き起こし

前回の続きということで、コードの方を書いていきたいと思います。


まず、左側のナビゲータエリアから、AppDelegate.swiftを選択してください。

ここに、各ViewController.swift同士でデータを受け渡しするために必要な記述を、

いくつかしていきたいと思います。


まず、名前のデータを受け渡しするために、

String型のnameというプロパティを書いていきます。


var name: String = ""

初期値の設定をしないといけないので、最初は空の文字列をいれておきましょう。


そして、genderですね。この名前の変数には、性別をいれます。

同じく、中身は空にしておきます。

var gender: String = ""


で、scoreです。

これはint型の整数です。

初期値として0をいれておきます。


そして、これらのデータをまとめていれるための配列を、

プロパティとして宣言しておきます。

今回は文字列とか数字とかいった様々な型を扱いますので、

AnyObjectにしておきましょう。

最初は空の配列ですので、空の配列を初期値としておきます。

var records: [AnyObject] = []


それでは、各ViewControllerの記述の方に移りましょう。

まず、「Question1ViewController」の記述に移ります。

ここにまず、IBOutletを使って、ストーリーボード上の

各セグメントコントロールとの紐付けを行っていきたいと思います。


名前だけはテキストフィールドです。

@IBOutlet var name: UITextField!

と書きます。


あと性別です。

@IBOutlet var gender: UISegmentedControl!


あと質問です。

@IBOutlet var q1: UISegmentedControl!

最初の画面に質問が3つありますので、q1、q2、q3まで作っていきましょう。

@IBOutlet var q2: UISegmentedControl!

@IBOutlet var q3: UISegmentedControl!


以前のObjective-Cでは、IBOutletの前の「@」は必要なかったんですが、

swiftでは「@」が必要になっています。


あとは画面遷移する寸前に、呼び出したいメソッドがありますので、

そちらの方変えていきたいと思います。

画面遷移する寸前に呼び出されるのは、prepareForSegueメソッドです。

override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {

で、この中に記述をすると、画面遷移する寸前に、処理が実行されることになります。


で、ここでAppDelegateを使ってAppDelegateにデータの受け渡しをしていきます。

let aD: AppDelegate = UIApplication.sharedApplication().delegate as! AppDelegate

です。

これでOKです。


このaDの、先ほど設定したnameプロパティに、

先ほどのnameというテキストフィールドに表示されている文字をいれていきます。

aD.name = name.text


次はswitch文を使います。

selectedSegmentIndexが、今セグメントコントロールで選択されている番号です。

この値によって、違う文字列をaDのgenderに入れていきたいと思います。


「case 0」ですね。0の場合は男です。

そして「case 1」の場合は、「gender = "女"」にします。


次は、swiftのswitch文は必ず全ての選択肢を網羅しないといけないんです。

ですので、defaultを設定します。

defaultの中には必ず何かを設定しなければなりませんので、

特に何もしないbreakをいれていきたいと思います。


次は、scoreです。

scoreはq1の今の選択肢と、q2の今の選択肢の番号と、q3の今の選択肢の番号を

足し合わせたものをいれていきたいと思います。


ここまでが、prepareForSegueの内容です。


あと、名前をいれるためのテキストフィールドです。

ストーリーボード上のテキストフィールドをタップすると、

キーボードが下からぴょこんと飛び出してきます。

で、その飛び出したキーボードを閉じるときに、そのままでは閉じないんです。

リターンボタンを押して閉じるようにするには、そのための記述が必要になります。

今からそれをしていきたいと思います。

UITextFieldDelegateというのを書いていきます。

これはいわゆるプロトコルというものです。

この技術を実装することにより、リターンボタンを押したときに呼ばれる、

いわゆるDelegateメソッドというものを実装することが可能となるわけです。

name.delegate = self


このViewControllerのインスタンス自身をこのnameのテキストフィールドにもたしてやることで

このClassの中に抱えている、ViewControllerの中に抱えているメソッドが、

nameから指定されたタイミングで呼び出されることになるわけです。

では、その部分を変えていきましょう。


このメソッドが、リターンボタンを押したときに呼ばれます。

func textFieldShouldReturnですね。

この中に書いていきます。


この中に、キーボードを閉じる

textField.resignFirstResponder()ですね。

return trueと返してやれば、これでキーボードが閉じることになります。


では次行きましょう。

Question2ViewControllerですね。


これにも、Question1ViewControllerと同様に、

まずIBOutletの記述からしていきます。

@IBOutlet var q4: UISegmentedControl!

ですね。最後に!をつけて、この中が「nil」じゃないことを明示しないと、

XCODEではエラーと認識してしまうわけです。


4、5、6、7、8まで質問を作ります。

(@IBOutlet var q4: UISegmentedControl!をコピーして)

5、6、7、8と作っていきます。


あとは先ほどと同様に、prepareForSegueの方を使って、

データの受け渡しを行っていきます。


ViewDidLoadの下の方に書いていきましょう。

override func prepareForSegue

ですね。

で、この中に書いていきます。


先ほどのaDの記述をしていきます。

AppDelegateを使って、データの受け渡しをします。


Question1ViewControllerからここの部分をコピーして、

ここにペーストします。


そして、scoreです。scoreに足し合わせます。

こういう感じでscoreの値を足し合わせていきます。

これでscoreの質問の選択肢に、選択された番号を足し合わせた値が入ることになります。


これでデータの受け渡しはできたことになります。


次に結果の表示画面の方を作っていきます。

ResultViewControllerですね。

この中に、まずIBOutletの記述をいくつかしていきたいと思います。

scoreLabel: UILabel!

ですね。

messageLabel、nameLabel、genderLabel。

このように、LABELを4つ宣言します。


そしてviewDidLoadの中で、先ほど合計したscoreの値に応じて、

違った結果を、これらのLABELに表示していくという

ロジックを組んでいきたいと思います。


まずは合計scoreの値を取り出しますので、

共同のAppDelegateを使っていきます。

そしてこのaDからscoreを取り出して、このscoreを使っていきます。


scoreはint型です。

scoreに5倍くらいかければ、インパクトのある点数表記になるかなと思います。


そしてscoreLabelの非表示です。

scoreLabelの表示をこう書くことで、整数型をいれることができます。

score + %表記ですね。


次に、このscoreの値によって、違った表記をmessageLabelの方に書き変えていきます。

これにはif文をつかっていきたいと思います。


if scoreが30より小さかったら、

このようなメッセージを表示します、ということですね。

messageLabel.txt = "プランクトン級"

else if scoreが50より小さかったら、"カブトムシ級"にしましょうか。

scoreが70より小さかったら、"サラリーマン級"にしましょうか。

90より小さかったら、"お笑い芸人級"にしましょうか。

110より小さかったら、"お笑い魔人級"。

それより点数が大きかった場合に、"笑いで人が殺せる級"にしましょうか。


あとは、先ほどのscoreをリセットして、元に戻しておきます。

aD.score = 0に戻しておきます。


そして、nameLabelの表示です。

nameLabel.text = "\(aD.name)は"

"+"で、文字列同士の足し合わせを行うことができます。


genderLabel.text = "面白い" + aD.gender + "だ!"


そして、レコードの方に、今の結果をいれてやります。

recordsにappendしていきます。

[]でかこってやって、配列として加えてやるんですね。

こうなります。

型はAnyObjectにしてありますので、数値型でも文字列でもいれられることになります。


それでは、ここまでできましたので、

動かして動作の方チェックしていきましょう。


今回まだiPhone5sのサイズにしか対応していませんので、

シミュレータでiPhone5sを選択して実行してみます。


その前に、ストーリーボードでの接続が必要でしたね。

最初の質問画面のViewControllerで接続を行います。


genderがこれです。

nameがこれです。

q1がこれ。

q2がこれ。

q3がこれになります。


で、次の画面です。

q4がこれ。

q5がこれ。

q6がこれ。

q7がこれで、

q8がこれになります。


で、最後の画面です。

ここも同様に、

genderLabelがここ。

messageLabelがここ。

nameLabelがここ。

scoreLabelがここになります。


これで、実行してみましょう。

実行ボタンをタップすると、シミュレータの方が起動します。


起動しましたね。

「すた~と」して、名前をいれます。

適当な名前をいれますね。(今回はTekuru)

returnをタップすると、キーボードが閉じます。

適当な選択肢を選択して、「診断する」、と。


「Tekuruは70%面白い。例えるならお笑い芸人級」

と表示されましたね。

これはひとまず大丈夫なんですけど、

ちょっと文字が途切れちゃいましたね。

この文字の表示領域を広げましょう。

ここの表示領域を広げて、これくらいにしましょう。


で、文字を中央寄りにして、ここもそうですね。

ここも、めいっぱい広げて、中央寄りにします。


で、再び実行します。

「すた~と」して、名前を入れ、適当な選択肢を選択して、「診断する」。


「Tekuruは55%面白い男だ。例えるならサラリーマン級」と表示されました。


これで、このアプリのロジックが無事動いていたことがわかります。

このような感じで、次回もさらに機能を追加していきます。

今回の動画は以上になります。

1 2 3 4 5

Tekuruプログラミングスクールでは、

動画だけでは伝わりきらない、アプリ開発の楽しさや、

気軽に質問できる雰囲気で、プログラミングを学ぶことができます。

もっと深く、プログラミングを理解したい方は、ぜひ無料体験にお越しください。