平屋真吾(170)7361736件のシェア(とっても話題の記事)この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。はじめにiPhoneアプリは、Macが1台あれば作ることができます。(OSのバージョンは10.7.4以降である必要があります)「とりあえず動くものを作ってみよう!」といった感じで簡単なアプリを作ってみたいと思います。「アプリの画面」や「画面の遷移」を視覚的に作成できる「Storyboard」を使いながら、コードを書かずにできるとこまでを今回はやってみます。StoryboardとはXcode4.2から導入されました。iOS5以降を対象としたアプリの開発で使用出来ます。下の画像のような画面で「画面内のUIパーツのレイアウト」や、「画面から画面への遷移」を視覚的に作成出来ます。用意するものは以下の通りです。10.7.4以降がインストールされたMac開発ツール「Xcode」Xcodeは無料でインストールできます。最新版のバージョンは4.6.2です。Xcodeの概要とインストール手順等は以下の記事などを参考にしてみてください。iOSアプリ開発初心者に捧ぐ開発環境Xcodeの概要とインストール今回はXcode4.6.2を使用します。4.2Storyboard使用ARC使用プロジェクト作成それではアプリ開発を進めていきたいと思います。Xcodeを起動し、新規プロジェクトを作成します。iPhoneアプリ開発ではアプリごとにプロジェクトを作成して開発を進めていきます。project」をクリックします。Applicationを選択し、「Next」をクリックします。次の画面ではアプリ名などを入力し、「Next」をクリックします。アプリの名前を入力する欄です。今回はstoryboardsTestとします。チェックを入れません保存場所を選択し、「create」をクリックします。プロジェクトが作成されました。Xcode画面の各部の主な名称や役割は以下の通りです。1つ目の画面を作成するそれでは、画面の作成を進めていきましょう。Xcode画面左側の「ナビゲーションエリア」内に自動で生成されたファイルが表示されています。アプリの動作に必要なファイルはひと通り作成されています。「MainStoryboard.storyboard」をクリックし、Storyboardファイルの内容を表示します。Storyboardファイルが表示できました。画面が一つ存在します。この画面の左についてる矢印は最初に表示される画面を意味しています。ラベルを追加するこの状態では真っ白の画面だけの状態なのでラベルを追加します。Xcode画面左側の「ユーティリティエリア」下部のオブジェクト一覧から「Label」を選択します。Storyboardファイル内の画面へドラッグ&ドロップします。ラベルが追加されました。追加したラベルをダブルクリックすると文字列を変更できます。"MainView"に変更しました。以後、この画面をMainViewと呼ぶことにします。アプリを動かすこの状態でアプリを動かしてみます。Runボタンを押すと実行出来ます。iPhoneシミュレーターが起動し、アプリが動きました。アプリの実行を止めるにはStopボタンを押します。2つ目の画面を作成する続いて、2つ目の画面を作ります。Controller」を選択し、MainViewの隣へドラッグ&ドロップします。2つ目の画面が追加されました。MainViewと同様にラベルを追加します。こちらはラベルの文字列を「SubView」にしました。こちらの画面はSubViewと呼ぶことにします。ひとつ設定を行います。MainViewとSubViewの見分けがつくようにSubViewに背景色を設定します。SubViewの空白部分をクリックした後、属性インスペクタを選択し、Background項目をクリックします。メニューが出てくるので一番下のOther...をクリックします。カラーパレットが出てくるので色を選択します。オレンジ色を選択しました。画面の遷移を設定するセグエ続いて、MainViewからSubViewへの画面遷移を設定します。MainViewにボタンを追加し、ボタンを押したらSubViewに遷移するようにしてみたいと思います。Storyboardで画面遷移を作るには「セグエ」と呼ばれるオブジェクトを使います。セグエの3つがあります。ここではPushセグエを使ってみたいと思います。Pushセグエは横方向へスライドするアニメーションと共に画面遷移するものです。Pushセグエの場合、「NavigationController」というパーツが必要なので追加します。NavigationControllerとボタンを追加するMainViewのステータスバー(画面上部の黒帯)をクリックしてMainViewの「ViewController」を選択状態にします。Controller」を選択します。Controllerが追加されました。ControllerはMainViewに関連付けられています。MainViewにボタンを追加します。オブジェクト一覧から「Label」を選択し、MainViewへドラッグ&ドロップします。ボタンをラベルの下へ持ってきてボタンのタイトルをSubViewに変更しました。このボタンを押すとMainViewからSubViewへ遷移するようにします。画面遷移を設定する「ボタンを押したらSubViewに遷移する」ように設定します。追加したボタンをクリックし、controlキーを押しながらボタンをSubView上までドラッグするとSubViewが選択され青くなるので、その位置でドロップします。ドロップするとメニューが出てきます。pushを選択します。画面遷移を担当するオブジェクトである「セグエ」が追加されました。ここで、Runボタンをクリックしてアプリを実行してみます。MainViewの「SubView」ボタンを押すと、SubViewに遷移します。MainViewへ戻るためのボタンは上部NavigationBarに自動で追加されています。「Back」ボタンを押すとMainViewへ戻ることができます。pushセグエはこんな動きの画面遷移になります。まとめ今回はPushセグエを使った画面遷移を作ってみました。次回は、別のセグエを使った画面遷移を扱ってみます。アプリに関するお仕事をしています。アプリの実装に関する情報を中心にお届けします。〜iOS7についての考察とfladdictデザイン論〜」に参加してきました。〜ログ収集、監視、分析を触って体感しよう!〜」を開催しますお申し込み受付は終了しました。ありがとうございました。今後セミナーのお知らせを受け取りたい方は、こちらからご登録をお願いします。CAFEのサービスが「LINEアプリ」として利用できるようになりました。これまではLINEのトークから利用する形でしたが、LINEサービス内から利用できるようになりました。これまでより便利に、シームレスにご利用いただけます。Cafe300件のシェア(そこそこ話題の記事)インフラ未経験の私が内定から入社までに読んだ技術書11冊ブログ記事2020年01月16日Yui300インフラ未経験で入社した私がインフラを勉強するために読んだ技術書11冊を感想とともにまとめました。平野重利123Pythonで、標準入力を変換して標準出力に出すCLIプログラムのテンプレートをご紹介します。菊池修治47こんにちは、菊池です。勉強会#1に登壇しました。サーバのみならずネットワーク機器の仮想化も年々進んでいます。スペックに縛られないこととか、展開のしやすさとか初期考慮点が少なくなるのは嬉しいです。武田隆志1098このエントリは、2018年、2019年に公開したAWS全サービスまとめの2020年版です。これまではいくつかに分割して公開していましたが、1エントリにまとめてほしいという要望をもらっていたため、今年は1エントリに集約してみました。CAFEのサービスが「LINEアプリ」として利用できるようになりました。これまではLINEのトークから利用する形でしたが、LINEサービス内から利用できるようになりました。これまでより便利に、シームレスにご利用いただけます。Cafe300件のシェア(そこそこ話題の記事)インフラ未経験の私が内定から入社までに読んだ技術書11冊ブログ記事2020年01月16日Yui300インフラ未経験で入社した私がインフラを勉強するために読んだ技術書11冊を感想とともにまとめました。悠紀235ShifterはWordPress環境をサーバーレスで立ち上げ、静的なサイトを生成することができるサービスです。FAQサイトをサクッと作ってみました。Takumi227こんにちは。DA事業本部の春田です。クラスメソッド株式会社が運営するAWS・iOS・HTML5に関する技術情報サイトです。