PR

マネしてできる!scratchで作った作品を、androidアプリ(APK)にする方法 — cordovaのインンストール&使い方

Rintaが書いた

こんにちは。あなたはscratchで作った作品をandroidアプリに変換したいと思ったことはありますか?

 「アプリを作ってみたいけど、文字のプログラムは書けない・・・」
 「直感的にアプリを作りたい!」
 「自分で作ったscratchをアプリにしたい」
そんな方に今回の記事はおすすめです。

また、書いた人自身も勉強中の身なので間違っているところやもっと簡単にできる方法があるかもしれません。その際は温かい目で見てください。コメントもしてくれるとうれしいです。

スポンサーリンク
スポンサーリンク

手動で細かく設定をしながら作成する

とりあえずsb3からhtmlに変換する

まず、turbowarpにアクセスしてプロジェクトを読み込みましょう。

そしてファイル→プロジェクトをパッケージ化するを押します。

そのあとは、自分の好きなように設定を設定して、環境をzipにしてパッケージを押します。ダウンロードされたファイルを解凍して下さい。

HTMLをAPKにコンバートする

変換するツールは色々ありますが、今回はインストールしてあったのでcordovaを使用します。

cordovaのインストール※

node.jsをインストールしていない方は、インストールしてください。

まず、コマンドプロンプトを起動して、以下のコードでインストールしていきます。

npm install -g cordova

ですが、cordovaをインストールしただけでは動きません。必要なソフトや設定をいい感じにしていきましょう。

インストール系Lv1(インストーラーでいけるやつ)※

java dev kit(17)のインストール
https://www.oracle.com/jp/java/technologies/downloads/#jdk17-windows


android studioのインストール
https://developer.android.com/studio

インストール系Lv2(android studio)※

android studioを起動します。
more actionからsdk managerをクリックします

そしたら、なんか出てくると思うので
sdk platformsは、android14と、android13のところにチェックを入れます。
(自分は写真とは違ってandroid13のベータ版(33-ext5)からandroid api 35まで全部入れていますが、多分これでも動きます)

そして、sdk toolsでは右下のshow package~にチェックを入れて、build toolの33.2 , 33.3 , 34 , 35を選択して下さい

そのまま下の方に行って、command-line toolの最新(latest)を選択します

もっと下の方に行き、platform-tool , emulator×2をチェックします

最後に、OKを押してインストールしましょう。
ベータ版を選択した場合は「責任取らないよ」的な文が出てくるので、規約を読んで同意できる場合はagreeを押して次に進みましょう。

インストールLv3(環境変数の設定)※

こっからがややこしいです。自分は3時間格闘しました。
まず、windowsの検索欄で「システムの環境変数の編集」と検索して開きます。
そのあと、下の方にある「環境編集(N)」を押してください。

でてきたウィンドウは、上「ユーザー環境変数」と下「システム環境変数」の二つに分かれていると思います。今回は、下の「システム環境変数」を使用します。
システム環境変数のなかに、「JAVA_HOME」というものがある場合は、JAVA_HOMEの設定は飛ばしてください。ない場合は、「新規」をおします。変数名に「JAVA_HOME」と入力してください。
そしたらそのウィンドウはそのままで、Ctrl+rを押して、C:\Program Files\Java と入力してokを押してください。

エクスプローラーが開くはずです。何かフォルダーがあると思うので、そのフォルダーの名前を組み合わせて(C:\Program Files\Java\フォルダー名)環境変数の、変数値に入力してください。そしてokを押します。
自分の場合:

次に、android studioも設定します。
android studioを開き、sdk manager を開いて、上の方にあるsdk locationのパスをコピーします。

そして、環境変数の「新規」を押して変数名に「ANDROID_HOME」、変数値にパスを貼り付けてokを押します。

そしたら、変数一覧から「path」を探して編集を押します。

次の5つのパスを新規で作ってください。

%ANDROID_HOME%\cmdline-tools\latest\bin
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\build-tools
%ANDROID_HOME%\emulator
%ANDROID_HOME%\build-tools\34.0.0

そしたら、一回環境変数のウィンドウは置いといて
https://gradle.org/releases/  をバイナリのみでダウンロードしてください

ダウンロードされたファイルを解凍してcドライブ直下に「Gradle」フォルダーを作成してそこに移動してください。

そして、環境変数の編集に戻ってpathに
C:\Gradle\gradle-8.8\bin
を追加してください
追加したら、OKを3回くらいかな?押していって環境変数系のタブを閉じてください

プロジェクトの作成

そしてコマンドプロンプトを作成したいフォルダで起動して次のコードでプロジェクトを作成します。

cordova create my-app com.example.myapp MyAwesomeApp
cd my-app
cordova platform add android

my-app はプロジェクト名に置き換えます。
com.example.myapp はパッケージ名に置き換えます。
MyAwesomeApp はアプリ名に置き換えます。

ファイル操作&実行

そしたらファイルができているはずです。

そしたら、wwwフォルダの中に①で作成したフォルダの中身を貼り付けてください。ファイルは置き換えてコピーしてください

コピーしたら、cmdで

cordova build

と、実行します。
これで完了です!お疲れさまでした!

できるだけ自動でする

GitHub - rintaro-s/scratch2apk
Contribute to rintaro-s/scratch2apk development by creating an account on GitHub.

1,上の手動でやるときの※を実行する
2,↑のやつをダウンロードします
3,自動1.ps1とb.ps1を実行する
4,指示どおりにする

以上になります。

まとめ

どうでしたか?うまくいっているとうれしいです。
もし、できなかったらコメントしてくれると嬉しいです。
今回まとめたものは筆者が5時間格闘したものなので書くのを忘れていることもあるかもしれませんが、わかったらどんどんと更新していこうと思います。
ありがとうございました。




著者;

コメント

タイトルとURLをコピーしました