【DroidScript】スマホでスマホアプリを作る① Hello World!


概要

DroidScriptと言うスマホアプリがある。

javascriptを記述して、オリジナルアプリを開発できるらしい。しかもスマホで!そりゃあスマホアプリなんだからそうなんだろうけど何か衝撃。

GASを覚えたことで、javascriptなら行けんじゃね?と、ちょっと触ってみることにした。

DroidScript

Playストアから入手可能。

サンプルコードが大量にあるためヒントは多いけど、ググっても日本語のサイトはあまりヒットしないし、Qiitaの記事もゼロ・・・操作は手探りになりそう(´・ω・`)

サンプルコードを見ると、横スクロールのゲームやらメディアプレイヤーやらある他、カメラ、メール、USBなどなど、出来ることはかなり多い。

アプリの画面をPCに表示させる方法もあって、スマホでチマチマやらなくてもキーボードでコード入力できるみたい(ちな、今回は全てスマホから操作)。

基本操作は全て無料!プラグインが豊富で、APKファイルへのビルドやブルートゥース対応など、一部のプラグインが有料になっている。

目的

以前に、WEBアプリ導入の練習で「電子レンジワット数で加熱時間を換算するアプリ」を作ったので、今回も同じお題で練習してみる。

参照:【GAS】電子レンジワット数で加熱時間を換算するwebアプリを作ってみた

Hello World!

何事もハローワールド!から。

アプリをインストールしたところ、最初にサンプルアプリが用意されていたので起動してみた。

画面にはドロイド君と「Press Me」と書かれたボタンが1つ(左画像)。ボタンをタップすると「Hello World!」と画面に表示された(右画像)。

コードを表示させたところこんな感じ。

//Called when application is started.
function OnStart()
{   
  //Create a layout with objects vertically centered.
  lay = app.CreateLayout( "linear", "VCenter,FillXY" ); 

  //Create image 1/5 of screen width and correct aspect ratio.
  img = app.CreateImage( "Img/Hello World.png", 0.2, -1 );
  lay.AddChild( img );      

  //Create a button 1/3 of screen width and 1/10 screen height.
  btn = app.CreateButton( "Press Me", 0.3, 0.1 );
  btn.SetMargins( 0, 0.05, 0, 0 );
  lay.AddChild( btn );

  //Set function to call when button pressed.
  btn.SetOnTouch( btn_OnTouch );

  //Add layout to app.
  app.AddLayout( lay );
}

//Called when user touches our button.
function btn_OnTouch()
{   
  //Show a popup message.
  app.ShowPopup( "Hello World!" );
}

英語は読めないけど、どうやらOnStart()がアプリを開いたときに呼び出される関数みたい。

app.CreateLayoutで宣言したlay.AddChildで表示させたいアイテムを放り込み、app.AddLayoutでアプリに渡してるんだなぁ・・・とか、

btn.SetOnTouch( btn_OnTouch )でボタンがタップされた時の関数を呼び出してるみたいだなぁ・・・とか、

function btn_OnTouch()では、app.ShowPopupでメッセージがポップアップするんだろうなぁ・・・など、

何とか分かりそう。

次回

次回から自作アプリの作成。
スマホでスマホアプリを作る② 背景やテキストの追加

つづく

シリーズ

DroidScript電子レンジアプリ作成
スマホでスマホアプリを作る① Hello World!
スマホでスマホアプリを作る② 背景やテキストの追加
スマホでスマホアプリを作る③ スピンボタンとシークバー
スマホでスマホアプリを作る④ 実行ボタン
スマホでスマホアプリを作る シリーズまとめ

外伝
【GAS】電子レンジワット数で加熱時間を換算するwebアプリを作ってみた