Codeaがお手伝いします。

iPadアプリを作るのは簡単ではありませんが、不可能ではありません。誰もがどこかで始めなければならない、その最初の一歩を少しでも楽しくするために、さまざまなアプリやサービスがあります。

コーデアもその一つです。App Storeからわずか15ドルで購入できますが、iPadをかなり強力なアプリ作成キットに変えることができます。コードを書くことに抵抗がある、でもやってみたいという方におすすめです。

ステップ1

Codeaで新しいプロジェクトを始めると、基本的なhelloworldスクリプトが表示されます。コーディングが初めての人も、プログラムを初めて使う人も、いじってみる価値はあります。

これらは非常に基本的なもので、setup関数は一度だけ呼ばれ、draw関数は連続的に呼ばれます。これは、スクリプトに独自のコードを配置する場合、重要な検討事項となります。

5行目では、コンソールのテキストとしてHello World!を表示するだけです。また、11行目で背景色を、13行目で筆者注にあるように、後で描くストロークの幅を設定しています。

背景色を示す数字をタッチすると、標準のコードエディタとは異なる方法でCodeaを見ることができます。このカラーピッカーは、タッチインターフェースで簡単に正確な色合いを選択することができます。

画面右下の再生ボタンをクリックすると、コードが実行されます。

ご覧の通り、今のところあまり進展はありません。しかし、ハロー、ワールド!がコンソールに表示され、背景が好みの赤色に変更されました。インターフェイスに慣れてきたところで、さらに大きな変更に着手します。

図形の描画

次に、このコードを使って円を描きます。画面左下の戻る矢印で、スクリプトエディターに戻ります。次に、draw関数に以下のコードを追加します。

楕円(WIDTH/2, HEIGHT/2, 200)

シンプルにオンにしてみましょう。楕円のコマンドは、円を描くことを意味している。画面の幅と高さの合計を2で割って、画面の中心に配置するショートカットを使って、画面上の位置を決める。あるいは、単に数値参照を宣言することもできます。最後に、200という数字で、欲しいサイズを指定します。ストロークの幅は、スクリプト内ですでに設定されています。

バーチャルキーボードの「再生」ボタンを押すと、コードが実行されます。

私たちの円はこのような形をしているはずです。私たちのコードに手を加えて、結果がどう変わるか、自由に見てください。次に、よりインタラクティブにしたい。

インタラクションを追加する

さて、図形を描いたところで、ユーザーが図形を使って何かできるようにコードを編集してみましょう。たった1行のコードを変えるだけで、タッチスクリーンを使って図形を操作できるようになります。

18行目を以下のように変更するだけです。

楕円(CurrentTouch.x, CurrentTouch.y, 200)

スクリプトエディタでは、以下の画像のように表示されるはずです。

つまり、円のXとYの座標は、ユーザーの指がタッチスクリーン上でどのような位置にあるかに対応する必要があるということです。draw関数に入れたので、常に更新され、ユーザーが図形をドラッグして移動できるようになります。

再生」ボタンを押して、うまく円を動かせるかどうか見てみましょう。

出発しました。非常にシンプルなアプリケーションで、実際にいくつかのことができるようになりました。ただ問題は、実はそれほど便利なものではなかったということです。次に、実際に目的を果たすためのアプリケーションを作ることでした。

次のステップ

Codeaの真のパワーは、iPadの最も便利な機能のいくつかにアクセスでき、それらをあなたのプロジェクトに簡単に実装できるようにすることです。その位置情報サービスと連携していく。

私が知る限り、スコットランドのエディンバラにある「モスク・キッチン」が一番おいしいカレーだと思います。そのため、どれくらいの距離を歩けば食べられるのか、正確に知っておきたいと思うことがよくあります。この情報を提供するための簡単なアプリを書きます。

まず、アプリケーションが位置情報サービスにアクセスできるようにする必要があります。そのためには、新しいプロジェクトを立ち上げて、このコード **setup function を入れてください。

location.enable()

一度だけ実行すればよいので、マッピングではなく、設定に置いていることに注意してください。アプリケーションを実行して、位置情報へのアクセスを要求されるかどうかを確認することで、正しく動作するかどうかをテストすることができます。

次に、選択した場所と端末との距離を取得し、テキストとして表示するコードを追加します。別の場所を使用するアプリケーションを設定する場合は、その場所の緯度と経度をすぐに取得します。

次に、draw関数に以下のコードを追加します。

text("You are...", WIDTH/2, 250)
text((location.distanceTo(55.945, -3.185)), WIDTH/2, 200)
text("...この辺で一番おいしいカレーまであと何メートル？", WIDTH/2, 150)

このコードの1行目と3行目は単なるテキストで、これも画面の最大幅を2で割って中央揃えにしていますが、3行のテキストがすべてきれいに揃うように、特定の番号のリファレンスを使用しています。

この場所です。距離コマンドは、目的の場所の緯度と経度を指定するだけです。通常テキストが入る場所にiPadを置くと、その位置を計算し、この数字を画面に表示します。

再生ボタンを押して、アプリケーションをテストしてみましょう。

それだけです。CodeaはiOSのコーディングを本当に簡単にしてくれます。まだ始めたばかりですが、すでにタッチスクリーンコントロールと位置情報サービスを実装することができました。ここでは、空は無限大です。

コーデアを活用するためのアドバイスがあれば教えてください。あるいは、特定のプロジェクトに関するヘルプをお探しですか？いずれにせよ、以下のコメント欄で会話に加わってみてはいかがでしょうか？