創報堂ブログ

2021.12.21 karita

iOSアプリってどうやって作るの?

昨日出前館で2000円クーポン使って得した気持ちと一昨日までなら3000円クーポンがあったのにという後悔がせめぎあってるかりたです。

前回予告した通りiosアプリってどうやって作るのということですがiosアプリは前提としてmacOSでないと作れないです。(正しくは作れるけどほぼ不可能)

macを立ち上げたらXcodeをインストールします。App Storeでもappleの公式サイトからでもできます。(アップデートでさえ1時間以上かかることがざらにあってつらいですが耐えましょう)

今回は足し算のみできるアプリを作成します。

Xcodeを立ち上げて、new projectを押してiOSタブのSingle View Appを選択すると以下の画面になるかと思います。

Product Nameにアプリ名を入力して、interfaceをStoryboard、LanguageをSwiftにしてNextを押します。

画像はTodoAppになってますがアプリに則した名前を付けましょう。(CalcAddApp SumAppなど)

すると以下のような画面になります。

左側にファイル一覧があるので今回編集するファイルの説明をします。

  • ViewController: プログラムを書くファイル。これが全てみたいなところある。
  • Main: storyboardファイル。このファイルを開いてボタンとかの部品をぺちぺち貼る。

Mainを開くとiphoneの画面があると思います。

右上に+ボタンがあるので押すとiosでよく見る部品一覧が出てきます。

この部品をiphoneにドラッグ&ドロップ(めんどうなので以下DD)すると部品が配置できます。

今回はlabel x1、textfield x2、button x1を配置しましょう。

配置した部品を選択すると右側のタブでボタンのいろいろな設定ができます。

部品一覧のボタンの下にある横線バーってなってるボタンを押し、Assistantを押すと画面が半分に割れてプログラムファイルが表示されます。

部品を選択して右クリックしながらプログラムファイルに線をびょ~んと伸ばしてDDしましょう。

すると変数名を入力する画面が出てくるので入力しましょう。

今回はボタン以外をresultLabel, firstnumTextField, secondnumTextFieldと入力しましょう。

ボタンはviewDidLoadという関数のしたにびょーんとしてください。

そして同じようにdidTapCalcButtonと入力すると関数を作成してくれます。ここにボタンを押したときの処理を書きます。今やった作業は配置した部品とプログラムの紐づけをしました。これをしてあげないとボタンを押してもどのボタンを押したのかわからないので何も起きません。

この段階では以下のようなコードになっているかと思います。

 

didTapCalcButtonの中に以下を記述します。

流れとしては、テキストフィールドに入力された値をそれぞれ取得。入力がなければ何もしない。

取得した値を足し算してresultに代入。

ラベルのテキストにresultを代入。

という流れです。

右上の再生ボタンを押すとエミュレータが立ち上がってアプリが立ち上がります。

テキストフィールドに数字を入れてボタンを押すとラベルに足し算された値が表示されます。

 

こんな感じでアプリを作成していくわけですがこのアプリは致命的なバグがあります。

それは数字以外を入れてボタンを押すとアプリが落ちるということです。

プログラムの知識がある人ならわかると思いますが、途中でIntにキャストをしているのが理由です。

こんな簡単なアプリでもバグがあるので大規模アプリのバグは仕方ないと思ってあきらめましょう。

以上です。

 

お問い合わせ

ご相談や制作についてのご質問、その他ご不明な点などございましたら どうぞお気軽にお問い合わせくださいませ。

  • TEL:079-284-9304 受付時間 平日9:00~18:00
  • お問い合わせフォーム
有限会社創報堂

兵庫県姫路市にあるホームページ制作・システム開発の総合クリエイティブ会社
有限会社創報堂

〒670-0932 兵庫県姫路市下寺町129 Nビル2F
TEL 079-284-9304 FAX 079-284-9305

© 2005 SOUHOUDOU