はてなブックマークに追加

スポンサーサイト

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

iPhoneアプリ・電卓をつくる その1




サイトを移行しました。
iPhoneアプリと、そのプログラム



これから数回にわたって電卓のiPhoneアプリを作っていきたいと思います。
単純に作業手順だけでなく、どうやって設計するのか?
まで伝えられたら良いかなと思ってます。

もとおもとはゼミの資料にする予定だったのですが、
せっかくなので公開しちゃおうということで(笑)

今回は難しいことは考えずに最小限の機能だけ実装していきましょう。
とりあえずの目標はiPhoneにデフォルトでついているこれ。

calc1.jpg

といっても、いきなりこれだけのものを作るのは大変だから、
もっと手前の段階からスタートして、徐々に電卓へと仕上げていきましょう。

ということで、電卓の前身であるカウンタから作っていきましょう。
雰囲気はこんな感じ。野鳥の会がもってるやつのディジタル版ですね(笑)
インタフェースはこんな感じ。

calc2.jpg

プラスボタンをタップしたら、数字がカウントアップされるという、
なんとも簡単なアプリです。
簡単ですが、iPhoneプログラミングに必要な要素はたくさん詰まっているので、
丁寧に見ていきたいと思います。


まずはプロジェクトを作成します。
Xcodeの「新規作成」-> 「ファイル」->「新規プロジェクト」を選択。
プロジェクトの種類「Application」でテンプレート「View-based Application」を選択。
プロジェクト名は「Calc1」にします。

まずはInterface Builderを使って、インタフェースを設計します。
左側にある「グループとファイル」カラムから「Resources」フォルダの中にある
「Calc1ViewController.xib」ファイルをダブルクリックしてください。
IBが起動し、4つのウインドウが開くと思います。

次に、Viewと書かれたウインドウにライブラリウインドウから
パーツをドラック&ドロップします。
今回は、次のように部品を配置してください。

calc3.jpg


配置できたら、UIButtonをダブルクリックして、ボタンの中に「+」を、
同様にUILabelをダブルクリックして「0」を記入してください。
また、UILabelのフォントを大きくしておきたいので、
Viewウインドウで一度Labelをクリックし、フォーカスを当てた状態で
インスペクタを次のように調整してください。

calc4.jpg


ここまでで、インタフェースの設計は一旦終了です。
次回はXcodeに戻ってプログラムを書いていきましょう。


iPhoneアプリ・電卓をつくる その2









スポンサーサイト

コメントの投稿

非公開コメント

開発アプリ

iDOF 色影 ラテアート ぱすてる

プロフィール

hokuson

Author:hokuson
京都在住。iPhoneアプリ「色影」や「iDOF」の開発者。アプリのレビューとかもしてみる。博士後期課程@R大学。ついに就職活動なるものをしなければいけないらしい。誰か雇ってください。笑。

カレンダー
03 | 2017/04 | 05
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 - - - - - -
カテゴリ
最新コメント
RSSリンクの表示
リンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。