1から始めるSwift言語。SwiftでiPhoneApp製作 その2 「Label」「TextField」
2016.02.11
この記事は最終更新日から1年以上が経過しています。
前回の、
1から始めるSwift言語。SwiftでiPhoneApp製作 その1
の続きとなります。
さて、Xcodeインストールして真っ白アプリ起動できましたね。
さすがにこれじゃ何にもできず、Appleさんに申請なんてとてもとても(笑)
ここで、一旦Appの設定をさらっと確認しましょう。
左のタブ(Navigator Area)のプロジェクトファイルをクリックすると、以下の様な 画面が表示します。
中央のタブ「General」で表示している内容で、AppのVersion、Buildナンバー
また、デプロイのターゲットとするOSを「Deployment Target」や、iPhoneの向きを設定する「DeviceOrientation」や
など、Appに関する設定の変更をここで行う事ができます。
また、作成したプロジェクトのフォルダ内にある「Main.storyboard」を選択することによって、
UIのレイアウト作成を行う事ができます。
「Main.storyboard」を選択で、Xcodeの中央に、以下の様に View Controllerの表示します。
こちらにUIkitのオブジェクトを配置する事によって、UIのレイアウトを行えます。
一番右カラム(Utility Area)では、UIレイアウトを行う際に画面サイズの変更などが行えますので、
特に指定しない最初の方は iPhone4.7 inch がレイアウト行いやすいかと思いますので、そちらを選択しておきましょう。
Label
それでは、テキスト系のUIkitオブジェクトである「Label」の振る舞いから。
通常、一番右カラム(Utility Area)の右下にUIkitのオブジェクトがリストで表示されます。
一番下に検索窓がありますので、オブジェクトを探す際にはこちらで検索する様にしましょう。
「Label」で検索すると、「Labelオブジェクト」がhitしますので、
これを「View Controller」の方にドラッグアンドドロップで配置する事ができます。
オブジェクトを動かす事によって、中央の補助線だったり端の補助線が表示しますので、
そちらに沿ってレイアウトすると良いでしょう。
「View Controller」に配置したLabelを選択すると、
一番右カラム(Utility Area)の表示が変更し、
こちらで「フォント」「色」「サイズ」などの変更を行う事ができます。
その他にもドロップシャドウ等の設定もこちらで行う事ができます。
一通り変更して、ビルドを実行するとシミュレータにも反映されているのが確認できるかと思います。
Text Field
「Text Field」はユーザーの入力を受け付けるオブジェクトとなっております。
Webで言う所の「input要素」ですね。
こちらも、ドラッグアンドドロップで配置。
こちらも選択すると一番右カラム(Utility Area)の表示が変更し、
こちらも「フォント」「色」「サイズ」などの変更の他に
未入力時にテキストを表示する「Placeholder」の設定もこちらで行えます。
ビルド実行し、「Text Field」を選択すると、iPhoneのキーボードが表示します。
その他にも、一番右カラム(Utility Area)のKeyboard Typeで表示するキーボードの設定なども行えます。
また、数字のみの入力が必要な場合は、Keyboard TypeをNumber Padに変更する事によって、
表示するキーボードを数字に変更する事ができます。
その他に色々と設定が行えますので、扱っていただければと思います。
と、今回もSwiftナッシングですが、何も書かなくても簡単にUIレイアウトが行えるのはいいですよね。
ではでは、また次回に。