2011年8月8日月曜日

自作アプリ「TaskTodo」おんぼろ開発秘話 前編


こんにちは、Pineです。
何となく成り行きで、iPhoneのTodoアプリを作ってみました。
かなり簡単なもので、アプリとも呼べないような出来ですが、簡単に作り方
をまとめてみました。

詳細は以下から........
昨日はブログ書くのを徹底的にさぼって何をしていたかというとですね
アプリを作っていたんです。iPhoneの。


僕のMacは時代から少しだけ乗り遅れているLeopard(今がLion、その前が
Snow Leopard)なので、最新の開発環境は使っていません。
しかもAppleにお金払って契約していないので、AppStoreにアプリを出す
こともできません。

そんな僕でも、唯一アプリをリリースすることができる場所があります。
脱獄ユーザーなら誰でも知っている、Cydiaです。


僕は自分用にリポジトリを作って、そこでひっそりと自分で作ったアプリ
等を公開しています。自分以外使ってませんが。
作ったアプリをパッケージというインストールするための形にして、それ
の情報を集めたファイルを自動生成させて、それをサーバーに置いて、自分
でCydiaからインストール、という手順を踏み、公開を行います。


では、本題のアプリの作り方に入りましょう。
アプリを作っているときの画面はざっとこんな感じです。






手順を簡単な言葉だけでまとめてしまえば、


1 アプリの構成とレイアウトを練る 

2 作るアプリに一番適したサンプルを選択する 

3 レイアウト通りにパーツを並べる 

4 コードをつらつらと書く 

5 コード内の処理や設定を3で作ったパーツにくっつける 

6 必要があれば3に戻って機能を積み重ねて行く 

7 アイコンやプログラムの詳細事項をざざっとまとめる 

8 完成&公開 


という感じになります。
一番気になるのは、4の面倒くさそうなコーディングの作業ではなく、
3や5の視覚的な作業なのではないでしょうか。


では一つ一つ、細か目に追って行きましょう。



1 アプリの構成とレイアウトを練る 

まず、どんなアプリを作りたいか考えます。
これをやらなきゃ、アプリなんて完成し得ませんからね。
僕は今回ブログのネタをささっとまとめるTodoアプリが欲しかったんです。
がしかし、今あるアプリは期限設定があったり、いろいろといらない機能が
多い気がします。
僕は、記事のタイトルと簡単な内容だけまとめられればそれでいいんですね。

というわけで、こんなアプリ草案を思いつきました。






フラッシュのたき方が下手なせいで色が飛んでしまいましたがこんな感じです。
字、汚いですね。
線は定規で引きましたが、こんな丁寧に書く必要はありません。
ざざっと書くのがポイントです。ざざっと。

左側が予定を追加するときの画面。右側が閲覧しているときの画面です。

こんな大雑把な案が固まったら、プログラムを作り始めましょう。



2 作るアプリに一番適したサンプルを選択する 

アプリを作るときは、プロジェクトと呼ばれるアプリを作るための
いろいろなファイルのまとまりを作ります。
そのためには、まずアプリの型を選びます。

と、その前にアプリを何で作るかの説明を忘れていました。
Xcodeと呼ばれる開発環境を用います。




これをAppleのサイトからダウンロードします。
そして起動すると、プロジェクトの型を選ばされます。






型はいくつかありますが、今回は一番適している「Navigation-based 
Application」という型を選びます。
その型を選んでプロジェクトを作成すると、

・必要なソース

・レイアウトを定義するファイル

・ユーザーは普通編集しないソース

と、3種類のファイルができあがります。
まずはこのうちの2つ目、レイアウトを定義するファイルの編集を行いましょう。



3 レイアウト通りにパーツを並べる 

レイアウトを定義するファイルは、Interface Builderというアプリケーション
で編集を行います。




ファイルを開くと、あらかじめ定義されているスタイルが表示されます。
今回の場合はこんな感じ






View
と表示されているところに表が表示される予定です。
ここで型から作り出したプロジェクトは、すぐにアプリにして実行できます。
実行するとき、二通りの方法でおこなうことができます。
一つが実機での検証、もう一つがiPhone Simulatorというアプリでの検証です。




アプリをテスト実行すると、標準でこのアプリケーションが立ち上がり、
その中で実行をしてくれます。





上が今回のものを実行している様子です。
こんな風なアプリがさっそくできあがったわけです。型そのままですが。
この型の通りできあがったものに手を加えていくんです。



さて、型からアプリの基本形が作成ができましたので、今日はこの辺に
しましょう。
そろそろPineが記事を書く限界が.....

それではまた明日ー

0 コメント:

コメントを投稿

Related Posts Plugin for WordPress, Blogger...

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Walgreens Printable Coupons