アプリ開発の入門として電卓アプリを作っていきます。面白味はあまりありませんが、ボタンやViewなどのオブジェクトの使い方を学ぶために、最初に作るアプリとしてはピッタリだと思います。
Contents
電卓アプリ作成
▼電卓アプリの外観はこんな感じ。上から計算表示用ラベルI(Label)、計算ログ(TableViiew)、ボタン×17個(Button)があります。簡単なプログラムにするためeval関数を用いるので数字や記号は全て半角とします。また各オブジェクトに必要なActionを設定してください。
▼スクリプト全体です。プログラムの概要を簡潔に記すと数字や記号ボタンを押すとラベルに追加され、Calcボタンを押すとラベルにある式をeval関数で評価し計算結果を表示します。それぞれの関数に対しての説明は以下に示します。
▼数字キーのイベント処理:0〜9の数字ボタンを押した際に動作する関数です。calcdは計算経過を示すフラグです、Trueであれば計算終了というわけです。
def on_number_tap(sender): global calcd s = display_label.text if calcd: s = ” calcd = False if s == ‘0’: s = ” display_label.text = s + sender.title |
▼演算キーのイベント処理:+,-,*,/の演算ボタンをを押した際に動作する関数です。簡単のため記号は演算記号をそのまま使用していますが、条件式を付け足せば×、÷を用いることも可能です。
def on_operation_tap(sender): global calcd display_label.text += sender.title calcd = False |
▼delキーのイベント処理:delボタンを押した際に動作する関数です。ラベルを最後の文字の除いた文字に更新し、ラベルの表示されている最後に入力した文字を削除する処理です。
def on_delete_tap(sender): display_label.text = display_label.text[:-1] |
▼CLキーのイベント処理:CLボタンを押した際に動作する関数です。ラベルを初期化しています。
def on_clear_tap(sender): display_label.text = ‘0’ |
▼Calcキーのイベント処理:Calcボタンを押した際に動作する関数です。calcdをTrueとし、ラベルのテキストをeval関数に入れ、その結果をラベルに表示しています。そのあと計算ログに追加しています。もし入力された文字列がeval関数で弾かれた場合にexceptのエラーの表示を出します。
def on_calc_tap(sender): global calcd calcd = True try: fml = display_label.text res = str(‘{:.2f}’.format(eval(fml))) display_label.text = res history_list.data_source.items.append(fml + ‘ = ‘ + res) except: display_label.text = ‘***ERROR***’ |
▼リストのイベント処理:TableViewの項目をタップ時に動作するアクションです。タップするとその項目をコピーすることができます。関数の前にある@から始まる文がありますが、これは’デコレータ’といってその次の関数に追加の処理や変更を加えるのに用いられます。今回は、TableViewの項目をタップした後にアラート表示をするのに必要な処理となります。(詳細は長くなってしまうので省略しています。)
@ui.in_background def on_list_tap(sender): n = sender.selected_row s = sender.items[n] clipboard.set(s) console.alert(s + ‘ をコピーしました。’) |
▼メイン処理:今まで通りの処理ですが、はじめにViewをロードしておきます。次に、あらかじめ複数の関数で用いる変数を取り出しておきます。そして最後にViewを表示しています。この際、Viewの向きを固定したい場合に’orientations’を指定します。
(縦向き:portrate、横向き:landscape)
v = ui.load_view() display_label = v[‘display_label’] history_list = v[‘history_list’] v.present(‘sheet’, orientations = [‘portrait’]) |
アプリのショートカット作成
▼下画像のように作成したアプリをホーム画面にショートカットとして追加する方法を記していきます。
▼作成したアプリのスクリプトの右上のスパナマークをタップします。
▼ショートカットと書かれたアイコンをタップします。
▼ショートカットの中のホームスクリーンアイコンをタップします。
▼アプリの名前やアイコンを変更することができます。Run Scriptはそのまま。
▼アイコンを設定できたらContinueで次に進みます。
▼書いてある通りに実行していきます。まずはツールバーの右上の↑マークをタップします。
▼次にホーム画面に追加をタップします。
▼右上の追加をタップして終わりです。
まとめ
電卓アプリは意外と単純でしたよね。一から作り上げようとすると大変ですが、アプリの設計をしてしまえばその通りにプログラムに起こすだけですからね。
慣れてきたところで次回ゲームアプリの開発をしようと思います。

コメント