Xcodeを使って簡単なiOSアプリを作成して実行する方法を説明します。

今回作成するアプリの動作はとてもシンプルで、ボタンを押すとビューの背景の色が白からグレーに変わるというものです。簡単なアプリですが、実際に手を使って作成してみることでiOSアプリ開発のイメージがつかめると思います。

実機を使ってデバッグする方法は少し面倒な手順が必要となるため、ここではシミュレーターを使って実行する方法を説明します。

プロジェクトの作成

Xcodeを起動し「File > New > Project」を実行します。

S 2016 05 20 14 47 30

▲テンプレートの選択画面で「iOS > Application」を選択し「Single View Application」を選択します。Single View Applicationはその名の通りビューが一つしかないシンプルなアプリケーションの雛形を作成するものです。

S 2016 05 20 14 47 50

▲プロジェクトの情報を入力します。

  • Porduct Nmae: プロジェクトの名前です。
  • Organization Name: 組織の名前です。
  • Organization Identifier: 組織の識別子です。
  • Language: アプリ開発に使用する言語。Objective-CとSwiftが選べます。
  • Devices: Universalを選ぶとiPhone / iPadで実行できます。
  • Use Core Data: Core Dataを使用するかどうか
  • Include Unit Tests: ユニットテスト用のコードを追加するかどうか
  • Include UI Tests: UIテスト用のコードを追加するかどうか

Porduct NmaやOrganization Identifierは実際にApp Storeにアプリを登録する場合は重要な情報となりますが、デモアプリでは適当に決めてもかまいません。

プロジェクトを保存するフォルダを選択すれば準備完了です。

とりあえず実行してみる

S 2016 05 20 14 48 22

▲プロジェクトが作成できたら画面上部のアイコンをクリックするか、Command-Rを押してとりあえず実行してみましょう。

S 2016 05 20 14 50 09

▲シミュレーターが起動し真っ白なアプリが動きだします。シミュレーターがMacの画面に入りきらない場合、「Window > Scale」から倍率を変更できます。

機能の実装

ボタンを追加してボタンが押されたときの処理を作成します。

ボタンを追加するには画面左のファイルナビゲーターからMain.storyboardを選択します。.stroryboardというファイルはストーリーボードと呼ばれる画面の構成を管理するためのファイルで、クリックするとInterface Builderが起動します。

S 2016 05 20 14 51 55

▲画面右下のObject LibraryからButtonを選択しView Controllerにドラッグします。ボタンの位置はとりあえず左上にしておきましょう。

S 2016 05 20 14 53 06

▲次にボタンが押され時の処理を作成します。

画面右上にあるアイコンをクリックして「Assistant Editor」を開き、ボタンをCtrl-ドラッグして右側のエディタ部分似ドロップします。

表示されたポップアップウィンドウでConnectionを「Action」、名前を「buttonPushed」に設定して「Connect」ボタンを押します。

中身を以下のように変更します。

    @IBAction func buttonPushed(sender: AnyObject) {
        self.view.backgroundColor = UIColor.grayColor()
    }

viewのバックグラウンドカラーをグレーに変更してます。

Firstapp

▲実行しシミュレーター上で「押してみよう」ボタンをクリックすると背景がグレーに変わることが確認できます。