LoginSignup
2
0

More than 3 years have passed since last update.

Akashic Engine にて作成したニコ生向けゲームをAndroidアプリ用に移植する方法

Last updated at Posted at 2020-06-25

はじめに

本記事では、実質ニコ生ゲーム用のゲームエンジンであるAkashic Engineを使用した
ゲームをアンドロイドアプリに移植したときの備忘録です。
HTML5で作られた他のエンジン製のゲームでも応用できるかと思います。
なお、Akashic Engineのマルチプレイ機能を用いたゲームは対象外です。

AkashicEngine 2.7
AndroidStudio 4.1.3

・手順

1.Akashic Engineのゲームをスタンドアローン形式で出力。

https://akashic-games.github.io/tutorial/v2/7-export.html
akashic export html --magnify --output ../mygame

2.Andoroid Studio からプロジェクトを新規作成

・Enpty Activity を選択

3.レイアウトにWevViewを載せる
スリープ防止の
android:keepScreenOn="true" を追加する

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:keepScreenOn="true"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/webView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_editor_absoluteX="8dp"
        tools:layout_editor_absoluteY="8dp">
    </WebView>

</androidx.constraintlayout.widget.ConstraintLayout> 

4. Assetsフォルダを作り、1で作成したゲームを入れる

File→new→Folder→AssetsFolder

5. ローカルのページを表示する

MainActivity.java
package パッケージ名;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //レイアウトで指定したWebViewのIDを指定する。
        WebView myWebView = (WebView)findViewById(R.id.webView1);

        //リンクをタップしたときに標準ブラウザを起動させない
        myWebView.setWebViewClient(new WebViewClient());

        //ローカルのページを表示する。
        myWebView.loadUrl("file:///android_asset/mygame/index.html");

        //jacascriptを許可する
        myWebView.getSettings().setJavaScriptEnabled(true);

        // Storageの使用許可
        myWebView.getSettings().setDomStorageEnabled(true);

        // 起動直後に音を再生・効果音が途中で止まるのも防いでいるっぽい
        myWebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
    }
}

6.横画面固定にする

Manifests/AndroidManifest.xml
android:screenOrientation="landscape"を追加

ついでにハードウェアアクセラレーターをtrueとする。
android:hardwareAccelerated="true"

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="パッケージ名">

<application
    android:allowBackup="true"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:roundIcon="@mipmap/ic_launcher_round"
    android:supportsRtl="true"
    android:theme="@style/AppTheme"
    android:hardwareAccelerated="true">
    <activity android:name=".MainActivity" android:screenOrientation="landscape">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

</manifest>

7.タイトルバーを消す

res/values/themes/themes.xmlに下記のitemを追加
"windowNoTitle"
"windowActionBar"
"android:windowFullscreen"
"android:windowContentOverlay"

style.xml
<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
    </style>

</resources>

これで大体完成です。
あとはアイコン等を追加してapkにすればストアにアップロードできるかと思います。

作ったもの

つりクッマAndroid版
https://play.google.com/store/apps/details?id=jp.hanakuso.turikumma

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0