画面レイアウト作成の基本

肝心の画面レイアウトの作成方法について、記述します。

ナビゲーションバーで、Main.storyboard ファイルを選択します。

StoryBoardを編集する画面、UIを編集する画面が真ん中に開きます。
これを、Interface Builder と呼びます。

こんな感じです。

画面のUIパーツ、または部品を選択できるようなエリアが右サイドに入っています。

下の図がそれです。
部品には、ボタンやラベルなど通常アプリを作る上で必要なものが揃っています。
（ここにないものは、自作かな..）

この部品をドラッグドロップでエディターエリアに移動させて、画面を作っていきます。

部品を選択すると、幅や高さ、ラベルの文字などを変更することができる箇所が右側に出てきます。
そこを編集して内容を変更していきます。

これが画面作りの基本です。

Swiftではじめる iPhoneアプリ開発の教科書【iOS 8&Xcode 6対応】/マイナビ: ￥3,229; Amazon.co.jp

たのしいSwiftプログラミング―[iOS 8&Xcode 6対応]/ビー・エヌ・エヌ新社: ￥3,024; Amazon.co.jp

絶対に挫折しない iPhoneアプリ開発「超」入門【Swift & iOS8.1以降完全対応】/SBクリエイティブ: ￥3,024; Amazon.co.jp

きれいパワー石川亜沙美、黒田知永子、田丸麻紀、小泉里子、森泉、藤井彩香、中島史恵、リサ・ステ.../徳間書店: ￥1,440; Amazon.co.jp

『Q』 iPhoneアプリ

こんばんは、先ほどまったりと飲んでいました。
たいして飲んでいないのに、回って回って。

一緒に飲んでいた人に勧められたアプリがありまして、それがなかなか面白いです。

『Q』というアプリで、指で線を描いて、その線で物理現象を起こして各ステージに用意されたお題をクリアするという、シンプルなミニゲームです。
２Dのパズルゲームの一種です。
ステージは私が観れたのは２０ステージですが、進めていくとどんどん増えるかも。

こちらがストアのWebサイトです。
https://itunes.apple.com/jp/app/q./id909566506?mt=8

例えばこのステージの場合、うまくいくと～　

こんな風になります！！

こちらのステージも、うまくいくと～　

こんな風になります！！

さらには、こんなステージも。

さあ、あなたは何ステージクリアできるでしょうか？

ストアの記述には、「私たち開発者にも解けないＱがある」とありますので、
難易度は高いですし、「上手さ」と「カオスの法則発動」による「運」が必要になる気がします。

アプリSTYLE (スタイル) 2015年 02月号 [雑誌]/アプリスタイル

￥842
Amazon.co.jp

このアプリゲームがすごい! 2015【豪華アイテム特典付き】/宝島社

￥918
Amazon.co.jp

松下奈緒カレンダー 2015年/株式会社ハゴロモ

￥2,400
Amazon.co.jp

松下奈緒フォトブック「Laugh&Leilani」/ワニブックス

￥2,052
Amazon.co.jp

UI 画面 ( .storyboard ) とプログラム( .swift )の接続　①

こんばんは。ジョナサンで食事してきました。これから再開します。

さて、storyboard の Interface Builder で画面のレイアウトを作ったあとは、私が慣れない間よく混乱した操作である、「UI 画面 ( .storyboard) とプログラム( .swift )の接続」についてです。
ただレイアウトを作っても、それだけでは何も起こりません。
何かを起こすために、プログラムファイルをいじる必要があります。

今回触るプログラムファイルは ViewController.swiftファイルです。
ちなみに、ViewController.swiftは画面レイアウトの数だけ存在します。

◇　接続方法

storyboardとプログラム画面を二つ並べます。

アシスタントエディター切り替えボタンを押してください。