iPhoneでHello world!

2010.07.08 23:02
 Hello world!をいったい人生のうちで何回体験することになるのか...ということにうんざりしている皆様。iPhoneでも残念ながらHello worldでした。たぶん例としてあげる変数の値も="hogehoge"になること間違いなしです。
 ここでは初めての文字表示方法をかなり簡単に説明します。実際、こんなやり方じゃテキストなんて表示できない!と思うかもしれませんが、最初なので仕方がありません。誰にでも初めがあるのです。

1. まずXcodeを立ち上げます。立ち上げると、プロジェクトの選択を迫られるので「新規Xcodeプロジェクトを作成」を選択します。
xcode-newproject.jpg2. 新規プロジェクトのテンプレートを選択:画面になります。アプリを作る際にベースになるテンプレートを既に用意してくれているというかなり親切なフレームワークです。後々様々なテンプレートを選択して開発の効率化をねらいますが、初心者は常に「View-based Application」を選びましょう。それ以外のことは考えなくてもいいです。
 それから中程にあるProductのプルダウン選択では、iPhoneとiPadが選択できますが、ここではiPhoneを選択します。最後に「選択」ボタンを押して次に進むとプロジェクト名とそのプロジェクトの保存先を聞いてきます。ここではhelloworldというプロジェクト名にして適当な場所に保存してください。
xcode-template.jpg3. 立ち上がった画面ではすでに様々なデフォルトのファイルが準備されています。それぞれ機能的にはまっさらな状態のファイルですが、そのファイルの関係はお互いにインポートされていたり呼び出されていたり内部でつながっていたりといろいろやってくれています。詳細で鬱陶しい作業をすべて自動化してくれているというわけです。
xcode-open.jpg4. 次に左メニューのResourcesディレクトリからhellowworldViewController.xibファイルをダブルクリックします。
 このファイルは、その名の通り、このプロジェクト(アプリ)の最も表面に近いインターフェイス(ViewController)を設定するファイルです。ファイルはファイルなのですが、このファイルはこれまた便利なことにinterfacebilderというフレームワークと連動しています。つまりインターフェイスだかViewContorollerだかという違った言葉で同じ意味のような...つまり我々が使っているiPhoneのガラス面直下の部分のデザインを作り上げるという作業なのです。実際その場所にHello world!を表示するわけです。
helloworld-xib.jpg5. この<プロジェクト名>ViewController.xibというファイルをダブルクリックすると、Viewという画面と<プロジェクト名>ViewController.xibという二つの画面が出てくることと思います。そしてここではすでにXcodeからInterface Builderというソフトに遷移しています。感触としてはPhotoshopからPremierとか、WordからPowerpointへ...みたいな感触です。XcodeとInterface Builderもそういうような関係です。
 さて、ここでは<プロジェクト名>ViewController.xibという画面は無視してください。この画面は実際のxibファイルをわかりやすく実体化したものというだけで、ここでは使いません。注目はViewの画面です。
helloworldview.jpg6. Viewの画面を選択しておいたまま、メニューバーにある「Tools」→「Inspector」を選択します。このInspectorは非常によく使いますので、いずれ体に染み付いてくることでしょう。また、同時に「Tools」→「Library」も表示させておきます。これも頻繁に使います。
library.jpginspector.jpg

7. Library画面の一番上部にある3つの選択肢(iPhone的にはセグメントコントローラーというらしいです。)の「Objects」を選択します。それからスクロールバーをたぐってゆくとLabelなるものを発見すると思います。このコントロールパーツ(iPhone的にはObject)が文字を表示させるオブジェクトになります。このラベル(Label)をドラッグして、Viewの画面のど真ん中まで引っ張ってやります。そしてドロップ(落っことす)するとめでたく「Label」という文字が表示されます。
 表示する文字は実際のオブジェクトにマウスを当てて入力してもいいですし、先ほど開いたInSpectorから上部のTextの入力フォームから入力することもできます。ここでは約束どおり、Hello World!と入力します。
hekkoworld-view-set.jpg   ここでちょっと説明ですが、Libraryでは、iPhone的にはオブジェクト(インタフェイスのデフォルトの部品)の選択やオブジェクトクラスの選択などインターフェイスのその部品(オブジェクト)とその関係項を設定するコーナーです。Inspectorはそのオブジェクト部品の属性(プロパティー)を設定する部分です。といわれてもよくわからない場合は適当に読んでおいてください。

8. ここまで終えたら、FileメニューからSaveを選択して構築したインターフェイス(といってもタダの文字列ですが...)を保存します。(ここではInterface Builderに保存されているだけでXcodeには保存されていません。)
 それからXcodeに戻ります。ただいま保存したView(インターフェイス)をXcodeに組み込んでアプリとして機能するようにします。説明は面倒臭い感じですが、方法は簡単でいわゆるビルドというのを一発で行います。「ビルドと実行」というボタンを押すだけです。
 「実行可能ファイルを中止」という画面が出るかもしれませんが、構わずOKを押します。そうすると自動的にシュミレーターが立ち上がって先ほどの文字列「Hello World!」がiPhine画面に表示されます。これで完了です。
build.jpg
hw-iphone.gif

まとめ

map.jpg  ここでは実に3つのソフトを使っています。Xcode、Interface Builder、iPhoneシュミレーターです。これらの関係は図のようになっているわけですが、文字列を表示するだけなのにこんな3つのソフトを使う必要があるのです。しかしこれだけ複雑な機能を持つiPhoneのアプリをこんなに簡単に作成してくれるフレームワークはなんとすばらしいことだ!と、むかしながらのコテコテのプログラマーは喜びます。
 一連の動作を概念的にまとめてみると、
  1. プロジェクトを立ち上げてアプリ開発に必要な関係ファイルをすべて構築します。これでアプリの原型(テンプレート)を作成しています。Xcodeを使ってこの作業は(自動的に)行われます。
  2. xibファイルを使ってアプリのインターフェイス(操作部分...つまりiPhone的にはオブジェクト)を作成して最も表面的な部分の画面を作ります。この作成に使用するのがInterface Builderです。
  3. これらのインタフェイスの設定を保存してXcodeに混ぜ合わせます。混ぜ合わせる作業がビルドといわれる作業です。ビルドするとiPhoneアプリとして作動する準備が整います。
  4. これをシュミレーターを使って動作の確認をします。無事作動していたら成功です。






プロフィール



  • Name :: 山上オサム ♂(39)
  • Hobby :: 武術
  • Work :: Web Designer