まずは前々回のサンプルの
message.backgroundColor = UIColor.orange
UIColor
色情報とは何か？
赤色なのか、青色なのか、暗めか、明るめか、鮮やかか、渋めか、表現は色々ですが、ハードウェアに依存した表現となるとRGB値ということになります。
RGB値ってなんだというと
親切本より
まず、色は目から受け取った光に対する、網膜を構成する3種類の細胞の生理学的反応です。そして、光はさまざまな波長の電磁波の集まりであり、3つの細胞はそれぞれに反応する電磁波の波長が異なります。
600nm前後の波長に反応する細胞は、脳に赤色を、550nm前後の波長は緑色、460nm前後は青色のイメージを作り出させます。
これら3つの波長の電磁波の比率が、人間の感じる色を決定するわけです。
したがって赤、緑、青、この3つの色を混ぜ合わせる事で、人間が感じる色はすべて(厳密にいえば、 レーザー光などで正確に表現できないものもある)再現できるということになります。
液晶画面も虫眼鏡などで拡大すると、ひとつひとつの点がRGBの発光体で構成されている事が わかります。
強弱を0.0 〜 1.0の範囲で表すとして、赤 :Red、緑 :Green、青 :Blue、すべて 1.0 なら真っ白になり、 すべて 0.0 なら真っ黒になります。赤だけ 1.0 で他が 0.0 なら真っ赤です。
このようにして色を指定する方法が RGB 値による色の表現で RGB 表色系といいます。 Wiki:色空間より
というように、液晶画面を虫眼鏡で見ると赤 :Red、緑 :Green、青 :Blueの3色のタイルのセットがずらずらと並んでるわけですよ。「スクールカーストとかヒエラルキとか」で話した液晶の画素ってのがこれです。
ダイレクトに色を表現するなら、このRGB値ってことになって、UIColorオブジェクトを作るときは次のように、RGB値をそれぞれ0.0〜1.0の範囲で指定することになってます。
UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 0.5)
ちなみに最後のalphaはアルファ値といって、色の不透明度の表現となります。
色付きのガラスの後ろの透け具合を想像してもらったらいいでしょう。0.0で無色透明で後ろが透け放題、1.0で完全に不透明になって後ろの色は透けなくなる。
この指定だと半透明の赤色ってことになりますね。
その他に、最初から用意されている馴染みの色もいくつかあって、red、blue、gray、whiteといった名前で、UIColorクラスオブジェクトのプロパティとして用意されていたりもします。
クラスオブジェクト
UIColorクラスオブジェクトってのは、クラスごとに1つだけ、アプリケーション起動時に自動的に用意されるオブジェクトです。
クラス定義では、プログラム中で個別に作成するオブジェクトと、このクラスオブジェクトの2種類を定義できるようになっていて、プロパティやメソッドの定義の前にclassキーワードをつけるとクラスオブジェクト側の定義ってことになります。
↓UIColorクラスの定義
class UIColor … {
↓クラスオブジェクト側のプロパティ定義
class var orange: …
↓個別に作るオブジェクト側のプロパティ定義
var cgColor: …
}
個別に作るオブジェクトごとじゃなく、クラスごとに用意したい特性は、こうやってクラスオブジェクト側に定義するのがSwift流です。というかObjective-C、というか、その源流であるSmalltalkからそうなんですが…
ま、それは置いといて、クラス名を書くことでUIColorクラスオブジェクトを指定したことになるので、いつも通り、そこから . （ドット）で繋げればプロパティを指定できます。
つまり
UIColor.orange
てのは、UIColorクラスオブジェクトのorangeプロパティの指定であり、このプロパティには橙色の色情報を持つUIColorオブジェクトが設定されてます。
これが
message.backgroundColor = UIColor.orange
で、messageのbackgroundColorプロパティに設定されることになるんで、messageの背景は橙色になるんですな。
で、いよいよ前回のサンプルの話。
のっけにViewControllerに2つのプロパティ、imageViewとmessageを用意してるのは、viewDidLoadで作ったUIImageViewとUILabelオブジェクトを別のメソッドでも使うためです。
class ViewController: UIViewController {
var imageView:UIImageView! // 人物用
var message:UILabel! // セリフ・説明用
プロパティ名の後ろに : （コロン）とクラス名を書いているのは、このプロパティが、どの型用に使われるかを教えるため。
これまでのように
let imageView = UIImageView(frame:…
とか
let message = UILabel(frame:…
ていうように、宣言時に ＝ で、記憶するべき内容を指定するのなら、わざわざ型を指定する必要はないんですが、今回の場合、記憶するべきオブジェクト（の識別子ね。参照と言います。何の話かわからん人は「こんにちはデベロッパの世界」を読みましょう）が設定されるのはViewControllerが作られた後のviewDidLoadメソッド呼び出し時なんで、それより前に用意されるプロパティには、型が決められないんですよ。
なので、コロンを挟んでの型の明示が必要になります。でもって、この変数宣言で値を設定しないのはミスじゃなくて故意だよってのをXcodeに知らせるために、型名の後ろに！をつけるってのがルールです。
で、その後に続く
let script = [
"雨の日はだるい…\n今日は学校休んじゃおっかな〜",
"誰だ"
]
てのは文字列配列の用意。
こいつは [ ] （ブラケットペア）で囲んだ中に、複数の文字列を , （カンマ）で区切って並べることで作ります。
こうすると、それぞれの文字列は配列の要素として格納され、配列の0番目の要素、1番目の要素というように、0から始まる続き番号（インディックス）で指定できるようになるんですよ。
プログラム中でのインディックスの指定方法は、配列名の後ろに [ ] で囲んだ数値という書き方で次のように書きます。
この [ ] で囲んだ数値は添え字と呼ばれ、これには整数型の変数・定数や計算式の結果も指定できるんですよ。
let str = ["a", "b", "c"]
↑ こんな感じで行を変えずに文字列を並べてもいい
1行に1文字列としたりするのは、読みやすさを考えてのこと
var a = 0
print(str[a]) ← 0番目の文字列 a が出力される
a += 1
print(str[a]) ← 1番目の文字列 b が出力される
a += 1
print(str[a]) ← 2番目の文字列 c が出力される
print(str[a - 2]) ← 0番目の文字列 a が出力される
これが、今回のサンプルの肝なわけで、場面の進行に合わせて表示する文字列を変えるのに使ってます。
それが、新しく追加しているtapメソッドでやってること。
func tap() {
if scriptIndex < script.count {
message.text = script[scriptIndex]
scriptIndex += 1
if scriptIndex == script.count {
UIView.animate(withDuration: 2, animations: {
self.imageView.alpha = 1
})
}
}
}
このメソッドはviewDidLoadメソッドで、画面をタップされるたびに呼び出されるように設定してて、配列scriptの要素数よりscriptIndexの値が小さい時だけ処理を実行するようにしています。それが最初のif文。
if scriptIndex < script.count { … }
配列scriptの要素数はcountプロパティで調べることができるので、scriptIndexがこれより小さいかどうかで比較して真偽を決定してる。
scriptIndexとscript.countの間の記号 < は数学の記号と同じ意味で、右側より小さいという意味になります。もしその通りなら真となってif文の { } 内の処理が実行されるわけですな。
ちなみに左側が右側以下の ≦ なら <= と書きます。右側より大きいは > 、右側以上は >= です。
実行されたらscriptIndexで指定される要素が新しい文字列としてmessage.textに設定され、scriptIndexの値は1つ増やされます。
message.text = script[scriptIndex]
scriptIndex += 1
でもって、scriptIndexが要素数と一致したなら、scriptIndexが示すインディックスは、配列の最後の要素を超えているってことになり（インディックスは0から始まるので、配列の最後の要素のインディックスは要素数-1）最後の場面に到着したことがわかる。
そこでimageViewをジワリと現れるアニメーション（フェードイン）で表示させるようにしてるのが、最後のif文
if scriptIndex == script.count {
UIView.animate(withDuration: 2, animations: {
self.imageView.alpha = 1
})
}
てやつです。
画面をタップされるとtapメソッドが呼ばれるようにするのはどうするか？imageViewをフェードインさせるアニメーションを実行させてるUIView.animate(withDuration:…てのは何なのか？
待て次回！
