Scratch 3.0 自分専用機 を作ろう!! (2) Scratch3.0 を Androidアプリとして動作させてみよう (1)

By kyorohiro (河村潔広)

Scratch3.0 は、Scratch2.0と異なり、スマートフォンでも動作します。
今回は、それを、もう少し発展させて、Androidアプリとして動作させて見ましょう。

Scratch3.0はスマフォで動く。

みなさんがお持ちのスマフォでScratch3.0は動きます。Scratch2.0はFlashを利用していました。そのため、スマフォのブラウザー上で動作しませんでした。

試しに以下のサイトをスマフォでアクセスして見てください。結構、良い感じで動作します。
※ Tablet推奨!!

http://llk.github.io/scratch-vm/

なぜ、スマフォで動作しなかった..

Scratch2.0が開発された時は、Flash というブラウザー上で動作するVMが世の中を席巻していました。

https://ja.wikipedia.org/wiki/Adobe_Flash


それは、今のHtml5のベースとなるような様々なアイデアを年々も前に実現していたからです。様々なゲームやジョークアプリが作られました。
http://www.nicovideo.jp/tag/FLASH%E9%BB%84%E9%87%91%E6%99%82%E4%BB%A3

Scratchもこの、時代を先取りした環境で作られていました。

しかし、Apple社がiPhoneに、ブラウザー上でFlashを利用できなくしたあたりを切欠に、
Flash は、PCでしか動作しないVMとなりました。

Scratch3.0では、後発のHtml5を利用して作り直されています。

なぜ、Androidアプリとして動作させるか

作成したScratchアプリを、ScratchのSNS以外の場所で活躍させる事ができるようになります。

- 作成したゲームを自分のスマフォに入れて持ち歩いたり

- 別のSNSに投稿したり

- カレンダーとか、アドレス帳とか、個人的なデータを記録するアプリを作ったり

- 作成したアプリをプレゼントしたり

使い道が広がります。

Buildしてみよう!!

Androidアプリ化するのに、Cordova(https://cordova.apache.org/)を使いたいと思います。

今回は以下の手順ですすめてみましょう。

1. Cordovaをインストール
2. Cordovaで、ブラウザーアプリを動作させる
3. Cordovaで、Androidアプリを作成してみる
4. Scratch3.0 を、ビルドしてサーバを経由しなくても動作するようにする
5. 4で作成したScratchアプリをCordovaに移植してみる
6. Scratch3.0をCorodovaブラウザーアプリとして動作させてみる
7. Scratch3.0をAndroidアプリとして動作させてみる。


では、順番に進めて見たいと思います。

Cordovaをインストールしてみよう

https://cordova.apache.org/#getstarted

1. Cordovaをインストール!!
npm install -g cordova

2. Hello World Projectを作ろう
cordova create MyApp

3. ブラウザーアプリ Pluginを追加
cd MyApp
cordova platform add browser

4. Hello World アプリを動作させてみる

cordova run browser
startPage = index.html
Static file server running @ http://localhost:8000/index.html

と表示されるので、
http://localhost:8000/index.html をブラウザーで開いて見ましょう!!

無事、CorodvaでHello Worldが動作しました。

では、次回!!

ノ

PS

Scratch 3.0 自分専用機 を作ろう!! (0)

火の型 With Scratch 2.0 (プログラム入門) 第00巻

火の型 With Scratch 2.0 (プログラム入門) 第01巻

炎の型 With Scratch 2.0 (ゲームプログラム入門)


炎の型工房 ScratchとDartでゲームプログラム入門 Advent Calendar 2016

Qiita: Scratch Advent Calendar 2017