コラム記事

JointAppsの使い方！

ツイート

アンドロイドとPCブラウザがあればできる！としてサービス展開している、JointApps。『誰でも、カンタンに、自分だけのAndroidアプリがつくれる』をコンセプトにしているだけあって、小学生でもアンドロイドアプリ作成にトライできるというのだから、驚きです。WEB系のスクール運営に定評があるデジタルハリウッド社がサービス提供しているということで、アンドロイドアプリ作成のすそ野を広げる期待が持たれています。

では、JointAppsの使い方を順番にご紹介していきましょう。

JointApps、2つの必須

JointAppsを使うにあたって必須な2つの機能をご紹介します。

1. ポータルサイト・・・ブロック（プログラム入り）をつないでアプリを作るブロックエディタ搭載
2. アンドロイドアプリ・・・「1」で作ったアプリデータを再生するJointAppsPlayer

まずは、ポータルサイトにあるブロックエディタを利用するためのユーザー登録（無料）を行います。ユーザー登録後、GooglePlayからJointAppsPlayerをダウンロード＆インストールします。
準備はこれで完了です。

シンプル簡単！画面切り替えアプリの作り方

使い方はシンプルで簡単。
例として、画面切り替えアプリ作成の流れをご紹介します。

2.ページを1ページだけ追加する。

ページ追加はページボタンを押し、プラス文字のついたボタンを押すと作成可能です。
ページを追加すると自動的に追加したページに切り替わります。

ページ切り替えはそれぞれのページ名をクリックする事で可能です。

2.ブロックをつなげてみる。
画面下のブロックの一覧より、ドラッグ＆ドロップで枠にあてはめます。
これが基本的な作業になります。
ブロックは合計4種類で、同じ色のブロックのみはめることが可能な仕様になっています。

今回はまず、緑のタブから画像表示のブロックを1列目につなぎます。

3.ブロックの中身を設定してみる。
画像表示やボタンなど、目に見えるもののブロックは設定が必要となるため要注意です。
特に、

1. どんな画像を表示させるか？
2. どんなボタンにするか？
3. 文字は何を入れるか？

などの項目です。

“ブロックをつなげたら必ず設定”という流れを忘れないようにしましょう！

ブロック設定は、つないだブロックを1回クリックします。
すると設定画面が右に出てくるので、今回は画像表示ブロックを選択し、
あらかじめ用意されている画像の中から好きなものを選びます。

4.画面にレイアウトしてみる。
ブロックを枠にはめて、画像を設定することもできます。
この状態では、画像の位置、大きさが設定されていませんので、レイアウトを施していきましょう。
右のボタン列の左から3番目、レイアウトボタンを押してレイアウト画面に切り替えます。
真ん中にグレーの枠と、左にピンクの四角の並ぶ画面が出ます。
このグレーの枠がアンドロイドの画面の枠になります。
ピンクの四角が目に見えるブロックの要素になります。

グレーの枠は、3種類。HD・QHD・WVGAです。
この種類は画像の解像度の種類のことを指し、自分のアンドロイドスマートフォンにあわせて切り替えていきます。

以上、たったの4ステップで完了です！！

この機能は例えばアプリゲームで、次の場面に行くための機能として応用できそうですね。
ある場面で登場人物二人が会話していて、森へ行けと言われてボタンを押して森の場面に変わるとか・・・。

皆さんもぜひトライしてみてください！