はじめてのiOSアプリ開発

背景色に合わせてラベルの色を変えてみよう

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
背景色の明るさに合わせて、ラベルの色を白にするか黒にするかを、変えられるようにしてみます。
講師:
07:32

字幕

このレッスンでは背景色の明るさに合わせて ラベルの色を白にするか 黒にするかということを 自動的に切り替えられるように してみたいと思います 現在はラベルの色は黒一色になっていますので このように若草色も それからその次の天色も そして紅紫 紺鼠と全ての色に対してこのように 暗い色に対しても黒のラベルで 色が表示されるようになっています ということでこれを暗い色の時は 白色になるように変えてみたいと思います ではXcodeに戻って作業をしてみましょう Xcodeの中でどこにこの作業― この操作を入れるのかと言いますと テキストラベルのアニメーションを つけたところと同じなんですけれども アニメーションがちょうど1.0秒かけて このsetAlpha を使って0.0秒で 透明にすると書いてあるところから その透明にし終わったところが このcompletionでもらえている ここのタイミングがあります このタイミングで この背景色に合わせた ラベルの色の変更を行ってやると ちょうどラベルが 見えなくなっている時ですので きれいにラベルの色を 変えていくことができます では実際にやってみましょう まず4つ変数を定義する必要があります どのような変数かと言いますと CGfloat 型の "h s b a” という4つの変数です この "h s b a” がどういう変数かというのは すぐに出てきますので まず4つこうやって変数を 用意すると思ってください 今度は現在の色に対して この4つの色の情報をもらってきます どういうことかというのは すぐにわかると思いますが 現在の色はcolors の colorIndex 番目で 参照することができますので この現在の色に対して あるメソッドを呼び出します どういうメソッドかと言いますと getHue saturation brightness alpha という こういうメソッドです このようなメソッドは 今までに出てきたことのない種類の メソッドだと思うんですけれども 今までは setBackgroundColor とか それからsetAlpha とか こういうメソッドを呼び出して来ましたけど これは例えばビューだったらビューに対して このcolor をset してくださいと言って この色の情報を向こうに渡す プッシュするということをしてきました なんですけれども colors のcolorIndex 番目の色に対して 現在の色の情報をくださいということを 次はやってやりたいんですね 色の情報をくださいという時には 色の情報を引っ張ってくる プルする側になりますので そういう風な色の情報を もらってくるということを書く時には 今までにやったことのない 書き方だと思うのですが & マークをつけてこのfloat 型の h を渡してやると こういう書き方をします 同じようにsaturation のところも & マークをつけて s そしてその次のbrightnessのところも & マークをつけて b そしてAlpha に&マークをつけて a という風に書いて この色に対して この色がどういう色なのかという 情報をくださいというのを書くことができます さあ ここで h の中にはこの色が どういう色味なのかということが格納されます 色味というのは赤っぽいのかとか 青っぽいのかとか 緑っぽいのか あるいは黄色なのかとか そういう情報がこのh の中に 数字として格納されます 同じようにこの色がどれぐらい 鮮やかなのかという情報がsaturation s の中に格納されます そしてbrightness の中には色がどれぐらい 明るいのかという情報が格納されます このレッスンの中で必要になってくる情報は brightness 明るさの情報です ですので b というのを基にして テキストラベルの色を変更するコードを 次に書いてみたいと思います この b がちょうど50%の明るさよりも 大きかったらっていう そんな感じでいいんですけども 今回はこれが 0.7よりも小さかったら すなわち70%の明るさよりも小さい時には 結構この色は暗いという風に判断して 暗い時にはこのテキストラベルの色を― colorNameLabel の色を setTextColor を使って UIColor のwhiteColor を指定しましょう このようにしてテキストカラーを白にします そうでない場合 70%以上の明るさが すでにある場合は この色の後ろに黒い色のラベルを 持ってきても大丈夫だろうということで ここではblackColor を指定します このように70%の明るさが あるかどうかを基準にして テキストラベルを変更する ソースコードをここに挟みました ここに関しては特にアニメーションを させていませんけれども もうすでにラベルが完全に Alphaが0.0になって消えた状態の操作で まったくユーザーの目に触れませんので 特にアニメーションさせなくても いいと思います では実際にこれでアプリケーションの 実行を確認しておきましょう 実行ボタンを押して実行します アプリケーションが実行されました 現在 若草色は明るい色ですので 黒でラベルが表示されています ではタップして次の色に行きます そして天色 天色も結構 明るいんですかね 黒になりました そして紅紫は結構暗い色ですので このように白い色になっています そして紺鼠も結構暗い色ですので 白になっています このように明るさが どれぐらい明るいのかということを このXcodeの中では色に対して getHue saturation brightness Alpha という この4つの情報を取得することによって 確認しながらその明るさを基にして 処理を分岐していくということができます 以上で日本の色をタップしながら 切り替えていくという 色のカタログアプリを 実装することができました 今回作成したプログラムは ダウンロードしていただいた サンプルプロジェクトの フォルダの中にあります

はじめてのiOSアプリ開発

このコースではXcodeを使ったiOS用アプリの開発に必要な基礎知識を学びます。Xcodeの基本的な使い方から本格的なゲーム制作のためのSprite Kitを用いた制作方法まで、カウントダウンタイマーやスピード暗算ゲームなど3つの簡単なiOS用アプリを作りながら説明します。このコースを見れば、本当に必要なアプリ開発の知識を着実に身に付けられるでしょう!

5時間55分 (52 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2015年06月04日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。