Unity UIWidgets 之 UIWidgets 下载、安装 和 简单入门使用

 

 

Unity  UIWidgets 之 UIWidgets 下载、安装 和 简单入门使用

 

目录

Unity  UIWidgets 之 UIWidgets 下载、安装 和 简单入门使用

一、简单介绍

二、使用要求

二、下载

Unity UIWidgets 源码下载地址

Unity Asset Store 中下载

四、安装

五、简单的使用 UIWidgets

---

 

一、简单介绍

UIWidgets是Unity编辑器的一个插件包，可帮助开发人员通过Unity引擎来创建、调试和部署高效的跨平台应用。

UIWidgets主要来自Flutter。但UIWidgets通过使用强大的Unity引擎为开发人员提供了许多新功能，显著地改进他们开发的应用性能和工作流程。

 

• 效率

通过使用最新的Unity渲染SDK，UIWidgets应用可以非常快速地运行并且大多数时间保持大于60fps的速度。

• 跨平台

与任何其他Unity项目一样，UIWidgets应用可以直接部署在各种平台上，包括PC，移动设备和网页等。

• 多媒体支持

除了基本的2D UI之外，开发人员还能够将3D模型，音频，粒子系统添加到UIWidgets应用中。

• 开发者友好

开发者可以使用许多高级工具，如CPU/GPU Profiling和FPS Profiling，直接在Unity Editor中调试UIWidgets应用。

 

二、使用要求

1、安装 Unity 2018.4.10f1(LTS) 或 Unity 2019.1.14f1 及其更高版本。 你可以从https://unity3d.com/get-unity/download下载最新的Unity（好似Unity2018.3.5版本版本也行）

 

2、将下载的UIWidgets包文件夹移动到Unity项目的Package文件夹中

 

3、注意：建议 Scripting Runtime Version 要选择 Net 4.x Equivalent (unity 版本不一样可以说法不一样)

 

二、下载

Unity UIWidgets 源码下载地址

1、Unity UIWidgets 源码：https://github.com/UnityTech/UIWidgets   

 

2、可以 clone 或者 Download zip 下载最新的 UIWidgets

 

3、也可以点击下载 UIWidgets 的 Release 发布的稳定版本

 

Unity Asset Store 中下载

1、在 Asset Store 搜索 UIWidgets

 

2、选择 UNITY TECHNOLOGIES 的 UIWidgets ，这里也可以点击下载

 

四、安装

(以 Unity 2019.3.13f 为例)

1、新建一个 Unity 工程

 

2、找到新建工程的目录的 Packages 文件夹

 

3、把下载后的 UIWidgets 文件夹添加到该目录下

 

4、回到Unity界面，在 File - Build Settings 中，建议把 Player Settings --- Api Compatibility Level 设置为 Net 4.x

 

五、简单的使用 UIWidgets

(以 Unity 2019.3.13f 为例，同事UIWidgets 基于上面配置OK)

1、在场景中添加一个  Panel

 

2、在工程中新建一个脚本 HelloUIWidgets

 

3、移除 Panel 上的Image

 

4、添加 HelloUIWidgets 脚本

 

5、Game 窗口显示脚本构建的内容

 

6、当前代码

using Unity.UIWidgets.engine;
using Unity.UIWidgets.widgets;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.ui;

namespace MyTestUIWidgets
{
    public class HelloUIWidgets : UIWidgetsPanel
    {
        protected override Widget createWidget()
        {
            return new Text(
                data: "Hello UIWidgets",                // 文字内容
                style: new TextStyle(
                    color: Color.fromARGB(255,255,0,0), // 设置颜色（argb）（红色）
                    fontSize: 30,                       // 字体大小
                    fontStyle: FontStyle.italic)        // 类型斜体
                    );
        }
    }
}

 

7、添加点击功能，修改代码

using Unity.UIWidgets.engine;
using Unity.UIWidgets.widgets;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.ui;

namespace MyTestUIWidgets
{
    public class HelloUIWidgets : UIWidgetsPanel
    {
        protected override Widget createWidget()
        {
            return new GestureDetector(                 // 收受检测
                child : new Text(
                data: "Hello UIWidgets",                // 文字内容
                style: new TextStyle(
                    color: Color.fromARGB(255,255,0,0), // 设置颜色（argb）（红色）
                    fontSize: 30,                       // 字体大小
                    fontStyle: FontStyle.italic)        // 类型斜体
                    ),
                onTap: () => { UnityEngine.Debug.Log("OnClick : Hello UIWidgets"); }    // 点击事件

            );
        }
    }
}

 

8、运行场景，点击 Hello UIWidgets ，效果如下