スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

【1-3】SwiftによるiOSプログラミング基礎(スタンフォード大学)

はじめに

スタンフォード大学の「Swiftで作るiOS開発入門」の講義がiTunesで配信されていることが話題になりました。
私も観てみたのですが基礎から教えてくれてとてもわかりやすい。
でも動画だとどうしても時間が掛かってしまうのでこのシリーズでは講義のエッセンスをまとめていきます。
https://itunes.apple.com/us/course/developing-ios-8-apps-swift/id961180099

シリーズ全体の目的

アップルの新しいプログラム言語「Swift」でiOSのイケてるアプリを作ること

シリーズ1の目的

「Swift」でCalculator(電卓)をつくる

この記事(シリーズ1-3)の目的

Xcodeでオブジェクトを配置する



前回のつづきで実際にオブジェクトをシーンに配置していく。

16.jpg
オブジェクトの中から「Label」をシーンに配置したいので、Labelをシーンにドラッグ&ドロップするが、


17.jpg
ドロップする時に青い点線が出てくる。この点線はオブジェクトを配置する補助をしてくれる線で、オブジェクトの整列に役立つ。このLabelは左上に置きたいので図のように青い点線が出てくるところでドロップする。


18.jpg
この青い点線はオブジェクトのサイズを変更した時にも出てくる。
Labelを横に伸ばしたいのでドロップしたLabelの右端をドラッグして青い点線が出てくる場所でドロップする。


19.jpg
このLabelはCalculatorの計算結果を表示する領域にしたいのでLabelではなく「0」と表示しておきたい。
そこでLabelと表示されている部分をダブルクリックして編集モードにした後、「0」と入力する。


20.jpg
数値は普通右寄せにするので「0」を右に寄せたい。そこでユーティリティーズエリアの上部、左から4つ目にある「アトリビュートインスペクター」によって設定を行う。「0」と書かれたLabelを選択した状態でアトリビュートインスペクターを開くと図のようなLabelの設定画面が表示される。
まずは右寄せにするためにAlignmentの右寄せを選択する。
また、文字が小さいので、Fontをクリックし、Sizeを32に変更する。


21.jpg
フォントを大きくすると0の上下が切れてしまうので、Labelの下端をドラッグ&ドロップして縦に長くする。


22.jpg
それでは一旦この状態でアプリを動かしてみる。
XcodeをインストールしていればMac上で動くiOSのシミュレータも一緒にインストールできている。
上図の場所には色々なデバイスのシミュレータがリストになっている。実機で試す場合にもここで実機を選択するのだが、それはもっと先なので、ここではシミュレータのiPhone6を選択する。


23.jpg
Xcodeの左上にあるプレイボタン(再生ボタン)を押すと指定したシミュレータが立ち上がり、アプリを起動できる。


24.jpg
iPhone6の解像度は非常に高いので、小さいモニタのMacでシミュレータを表示させると上図のようにはみ出してしまう。


25.jpg
そこで
iOS Simulator > Window > Scale
から表示する比率を選択するとiPhone6の画面全体を表示することができる。


26.jpg
比率を変えたのが上図。しかし、表示されるべきLabelの「0」がシミュレータ上に表示されていない。
シミュレータの下に編集していたシーンを置いてみるとわかるように、シーンがiPhone6の画面を付き出してしまっていることがわかる。つまり、実際にはLabelの「0」という表示はiPhone6のシミュレータの外側に表示されているということ。



▶次回はオブジェクトを正しく整列させる

コメント

コメントの投稿

非公開コメント

PR

PR

プロフィール

何でも書くman

Author:何でも書くman
思ったことや備忘録など、とりあえずなんでも書きます。IT系のことや趣味、生活に関わることなども。

ページの先頭へ戻る
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。