10

#鸿蒙 在鸿蒙设备上开发Unity游戏的方法

 3 years ago
source link: https://xmanyou.com/run-unity-game-on-harmony-device-by-webview/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
5 July 2021 / 鸿蒙

#鸿蒙 在鸿蒙设备上开发Unity游戏的方法

上一次测试了Cocos直接打包鸿蒙应用,体验极度舒适。

《用DevEco 2.2远程真机调试+Cocos Creator 3.2开发一个鸿蒙游戏》
https://xmanyou.com/build-a-harmony-game-with-cocos-creator-and-run-on-remote-device/

但是,对于Cocos之外的其他游戏引擎使用者,例如Laya,例如Egret,特别是Unity,有什么办法可以在鸿蒙上开发游戏呢?

由于这些引擎的底层与Cocos不同,不能直接用Cocos的代码,所以在这些引擎为鸿蒙提供原生支持之前,我们需要一个曲线救国的方法。

于是乎,我想到了:Webview。

官方文档
https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ui-java-component-webview-0000001092715158

实际效果:
run-unity-game-on-harmony-device-by-webview-01

使用Webview在鸿蒙设备上运行Unity游戏需要几个步骤?

1. 创建鸿蒙全屏工程

在DevEco中创建一个新工程,模板选择Full Screen Ability。

run-unity-game-on-harmony-device-by-webview-02

2. 添加Webview

这个工程的布局很简单,就是一个全屏的image组件,把image组件替换成webview即可。

2.1. 将模板layout中的image组件替换成webview

    <ohos.agp.components.webengine.WebView
        ohos:id="$+id:webview"
        ohos:height="match_parent"
        ohos:width="match_parent">
    </ohos.agp.components.webengine.WebView>

注意
该模板提供了2个layout,land_main是横屏,port_main是竖屏,根据需要或者直接都替换掉。

run-unity-game-on-harmony-device-by-webview-03

2.2. 初始化webview,并加载url

在MainAbilitySlice中,添加方法initWebview

    // 初始化webview,并加载url
    private void initWebview(){
        WebView webView = (WebView) findComponentById(ResourceTable.Id_webview);
        webView.getWebConfig().setJavaScriptPermit(true);  // 如果网页需要使用JavaScript,增加此行;如何使用JavaScript下文有详细介绍
        final String url = EXAMPLE_URL; // EXAMPLE_URL由开发者自定义
        webView.load(url);
    }

run-unity-game-on-harmony-device-by-webview-04

并在onStart方法中调用。

run-unity-game-on-harmony-device-by-webview-05

3. 隐藏标题栏

添加完Webview组件,就可以用它来查看网页了。

下图中,展示了我的博客

https://xmanyou.com/

可以看到,标题栏还在。

run-unity-game-on-harmony-device-by-webview-06

为了提供更好的体验,我们想办法把它隐藏。以下方法来自钟发发老师。

run-unity-game-on-harmony-device-by-webview-07

两个步骤:

3.1. 在config.json中设置NoTitleBar

    "abilities": [
      {
...
        "metaData":{
          "customizeData":[
            {
              "name": "hwc-theme",
              "value": "androidhwext:style/Theme.Emui.NoTitleBar",
              "extra":""
            }
          ]
        }
...
    }

3.2. 在onStart中设置MARK_TRANSLUCENT_STATUS

注意,以下代码需要在setUIContent之前调用。

        // 沉浸式显示(by 钟发发老师)
        this.getWindow().addFlags(WindowManager.LayoutConfig.MARK_TRANSLUCENT_STATUS);
      // setUIContent 之前

再次测试Webview,这次标题栏就隐藏了。

run-unity-game-on-harmony-device-by-webview-08

4. 设置Webview加载Unity Webgl游戏

首先,用Unity打包Webgl游戏,并上传到服务器上。
然后,用Webview加载Unity游戏的链接。

5. 打开远程真机,进行调试

与cocos项目一样,模拟器无法正常演示游戏,需要使用远程真机来调试。
参考上一篇:

《用DevEco 2.2远程真机调试+Cocos Creator 3.2开发一个鸿蒙游戏》
https://xmanyou.com/build-a-harmony-game-with-cocos-creator-and-run-on-remote-device/

run-unity-game-on-harmony-device-by-webview-09

run-unity-game-on-harmony-device-by-webview-10

如何加载本地资源?

你可能已经注意到了,本文介绍的方法,游戏代码是放在服务器上的,如果你没有服务器,或者想把资源放在游戏包中,可以参考官方WebView文档,里边有详细介绍如何加载本地资源。
如果有空尝试的话,我会再出一篇相关文章。

《WebView》
https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ui-java-component-webview-0000001092715158

非常感谢钟发发老师在我遇到困难时,第一时间伸出援手,非常感谢。

run-unity-game-on-harmony-device-by-webview-11


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK