2014年12月19日
Posted by 屋台ブルー at
2014年12月19日00:00 Comment(0)
Swiftで遊ぼう! - 161 - アプリを作ろう - 10 Auto Layout 2
Auto Layoutの使い方の勉強の続きです。もっともシンプルなDoument Outlineから設定する方法から入りました。
最初にLabelに対して2つのルール(コンストレイント)を規定したところだ。しかし、問題が生じた。Labelにオレンジ色のアウトラインができていて、黄色い三角の警告サインがいたるところに出現している。
一番情報が多いのはナビゲーターエリアのアイコン左かあ4つ目「イシューナビゲーター」が選択(ショートカット:command + 4)された状態になっているだろう。問題は発生したときにここに問題の詳細が出ていくる。
実はこのラベル表示されていないのにかなり幅を広げてViewに配置しているため、実行時にラベルのサイズが実際と異なる可能性があるという警告である。
オートレイアウトボタン
じゃあどうやって修正したらいいのか考えてみよう。ここで使用するのがストーリーボードも右下に並んでいる4つのアイコンだ。これらはAuto Layoutボタンと呼ばれて、「Align(アライン)」「Pin(ピン)」「Resolve Auto Layout Issues(オートレイアウト問題解決)」「Resizing Behavior(サイズの再変更)」で、問題解決は当にオートレイアウトの問題解決を使うことになる。
そしてこの食べるの問題はサイズなんでフレームをアップデイトすればいい。するとラベルは小さくなりオレンジラインも消えて警告も消えた。
もう一つ修正法は、Document Outlineにある黄色い警告をクリックすると警告の詳細が見えるでしょう。その横にある黄色い三角警告サインをクリックしたら次のようなポップアップウインドウが出てくるのでそこで修正もできますね。
さあ、ランしてみよう。見事に動くだろう!
今日はここまで。
最初にLabelに対して2つのルール(コンストレイント)を規定したところだ。しかし、問題が生じた。Labelにオレンジ色のアウトラインができていて、黄色い三角の警告サインがいたるところに出現している。
一番情報が多いのはナビゲーターエリアのアイコン左かあ4つ目「イシューナビゲーター」が選択(ショートカット:command + 4)された状態になっているだろう。問題は発生したときにここに問題の詳細が出ていくる。
実はこのラベル表示されていないのにかなり幅を広げてViewに配置しているため、実行時にラベルのサイズが実際と異なる可能性があるという警告である。
オートレイアウトボタン
じゃあどうやって修正したらいいのか考えてみよう。ここで使用するのがストーリーボードも右下に並んでいる4つのアイコンだ。これらはAuto Layoutボタンと呼ばれて、「Align(アライン)」「Pin(ピン)」「Resolve Auto Layout Issues(オートレイアウト問題解決)」「Resizing Behavior(サイズの再変更)」で、問題解決は当にオートレイアウトの問題解決を使うことになる。
そしてこの食べるの問題はサイズなんでフレームをアップデイトすればいい。するとラベルは小さくなりオレンジラインも消えて警告も消えた。
もう一つ修正法は、Document Outlineにある黄色い警告をクリックすると警告の詳細が見えるでしょう。その横にある黄色い三角警告サインをクリックしたら次のようなポップアップウインドウが出てくるのでそこで修正もできますね。
さあ、ランしてみよう。見事に動くだろう!
今日はここまで。