スポンサーサイト

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

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

はじめに

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

シリーズ全体の目的

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

シリーズ1の目的

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

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

Xcodeでプロジェクトを作成する


前回の記事でも説明があったように、iOSアプリの開発にはXcodeというソフトウェアを利用する。
自分が使い慣れたものがあるので他のエディタを使いたいという要望があるかも知れないが、Xcodeはコードを書くだけではなくユーザーインターフェースの編集やデバッグ、コンパイルなど統合的な処理を行うツールなので現時点ではXcode以外の選択肢はない。Xcodeの最新版はAppleのサイトから無料でダウンロードできるので最新版を利用する。ベータ版は利用しない。

何でも書くmanから
この講義では触れられていないが、XcodeはMacOSでしか動かないので必然的にiOSアプリの制作はWindowsやLinuxではできない。あれこれ小難しいことをすればできないこともないらしいが、折角作ったのにめちゃくちゃになってしまった、などということを避けるためにMacOSを用意することをおすすめする。


何でも書くmanから
ちなみに、アプリを作成すればすぐに配布できるわけではない。
配布するにはAppleにディベロッパー登録して年会費を払い、証明書を発行して・・・というステップが必要となる。
作り終わったあとに「お金がかかるなら登録したくない、作らなきゃよかった」ということにならぬよう、先に言及しておく。


6.jpg
Xcodeを開いたら上のような画面が出てくるので「Create a new Xcode project」を選択。

7.jpg
すると上のような画面になる。
XcodeはiOSアプリの開発以外にも利用されるためどのプラットフォームかを選択させる画面。
iOS > Application > Single View Application
を選択。



8.jpg
プロジェクトの設定画面が出てくるので、
Project Name: Calculator
Organization Name: 企業名など好きな名前
Organization Identifier: あなたを表すユニークな名前(メールアドレスを逆にしたものを使うことが多いex. com.campany.last.first)
Bundle Identifier: 自動で入力されるアプリのユニークな名前
Language: Swift
Device: Universal (iPhoneでもiPadでも利用できる形式)
Use code data: チェックなし


9.jpg
保存先を聞かれるので例えば
home > Developer
などに保存。


10.jpg
次に出てきたのが実際に開発を行う画面。
左側の細長い領域はナビゲーターと呼ばれている。
ナビゲーターにはデバッグや検索などのツールがいくつか搭載されているが当面はファイル構成を表示する一番左のメニュー(デフォルトで表示されているもの)を利用する。


11.jpg
まずは今回は利用しないファイルを別のフォルダに移してしまう。
ナビゲーターにある下記の2つ以外のファイルを「Supporting Files」フォルダにドラッグ&ドロップする。
・ViewController.swft
・Main.storyboard


12.jpg
Main.storyboardをクリックすると図のような画面になる。
メイン画面にはおおきな四角が表示されているが、この画面がユーザーインターフェースを編集する画面だ。
この四角の中に+や-や数字などのボタンを配置してCalculatorを作成する。


13.jpg
続いてViewController.swftをクリックするとコードの編集画面になる。
この画面で編集したコード、例えば加算の結果など、を先ほどのユーザーインターフェースに表示させる。
ところでこのViewControllerというファイル名は良くない。
何のコードが含まれているのかわかりにくいからだ。例えばCalculatorViewControllerなどにすべきだ。
これをするのは少し面倒なので今回は割愛するが、わかりやすい命名をすることは非常に大事なことだ。


14.jpg
コードの作成の前にインターフェースの編集を行う。
中央にある白いボックスを「シーン」と呼ぶ。大きなアプリになるとシーンが複数個作成され、それぞれがどのシーンからどのシーンへ移動するかというマッピングが行われる。
ところで、作成するMacの画面サイズにもよるが、小さい画面だとシーンの全体が表示されていないことがある。そういう場合はシーンの外側で右クリックをするとズームイン・アウトをすることができる。
また、シーンをダブルクリックしたり、シーンの外側をダブルクリックすることでもズームイン・アウトは可能。


15.jpg
次に右側の列を見てみる。
この右側の列は「ユーティリティーズエリア」と呼ばれている。
ユーティリティーズエリアの下側、3つ目のタブは「オブジェクトライブラリ」と呼ばれており、オブジェクトがリスト化されている。



▶次回は実際にオブジェクトを配置していく

コメント

コメントの投稿

非公開コメント

PR

PR

プロフィール

何でも書くman

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

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