统软云揭秘！与iOS、Android和微信小程序兼容的UI引擎

官方披露！与iOS、Android和微信小程序兼容的UI引擎

在应用开发过程中，对于某些效果使用纯前端h5的体验相对较差。因此，开发人员将选择相应的原生UI模块来替换它们。本机模块的性能和体验都很好。然而，当前的问题之一是界面可定制性相对较差，无法100%满足要求。为此，结合原生模块的性能和体验以及前端开发的灵活性，统软云推出了纯翻译模式UI引擎，并在统软云和极客科技举办的“AI时代的移动技术创新”会议上发布了这款新产品。

注意：以纯翻译模式查看UI引擎文档的链接https://docs.统软云.com/UI-templet/UI-templet-api

纯翻译模式UI引擎使用与普通UI类模块相同的过程，将applet UI组件的路径传递给模块方法，并在解析和加载模块后显示applet UI页面。目前，统软云正式（网站：https://www.统软云.com/）模块存储中提供了几个常用的小程序UI组件模块。开发者可以直接下载它们供本地使用，以方便修改样式和效果。选择小程序的语法可以帮助熟悉小程序开发的开发人员更快地开始并快速开发所需的UI效果。

纯翻译模式UI引擎的具体使用过程如下

1、 添加UITemplate模块

与其他模块一样，您需要首先在控制台模块中添加UITemplate模块，如图所示：

2、 添加小程序UI组件

01.Applet包结构和目录简介

在使用applet UI模块之前，我们需要了解applet包的结构，如下图所示。一个小程序包包含app。json，app。wxss和app-J以及其他文件，您可以在这些文件中进行一些全局配置。一个小程序包可以包含多个小程序UI组件，这些UI组件需要在app中注册配置。json文件。有关详细信息，请访问官方微信小程序开发文档https://mp.weixin.qq.com/debug/wxadoc/dev/framework/structure.html

app的简单配置。json文件：

｛“pages”：[“pages/uitalertview/alertview”，“pages/uitconfirmview/confirmview”]｝

小程序UI页面由四个文件组成，文件名相同，但扩展名不同。

02.添加applet UI组件

开发者可以开发自己的小程序UI模块，也可以直接到模块商店找到官方提供的小程序UI模块，在本地下载，并将其放在代码包中的相应目录中使用。

03.运行小程序UI模块

这里我们以自定义加载器的使用为例，添加UITemplate模块，编译自定义加载器，下载并安装到手机上。

调用页面上UITemplate模块的初始化方法，并传入applet包所在的根目录：

函数apiready（）{var UITemplate=api.require（'UITemplate'）；var path='；widget://uitemplate' ;;& nbsp； ；U模板。init（｛路径：路径｝）；｝

使用openView方法显示applet UI组件：

var UITemplate=api。要求（“UITemplate”）；U模板。openView（｛name:“confirm”，url:“pages/uitconfirmview/confirmwiew”，rect:｛x:0，y:0，h:“auto”，w:“auto”｝，级别：“alert”，数据：｛pageParam:｛title:｛content:'；统软云提示'；}和nbsp； ； ； ； ；消息：｛content:'；帐户余额不足，无法使用红包功能！'；}和nbsp； ； ； ； ；按钮：[{content:'；Return'；，样式：'；color:#000；'；}，{content:'；充值'；}]nbsp； ； ；} ； ；}}，函数（ret，err）｛if（ret&&“buttonClick”==ret.type）｛UITemplate.closeView（｛name:“confirm”｝）； ； ； ； ；//回调代码逻辑可在此处填写nbsp； ；var索引=ret.buttonIndex； ； ；}}）；

特别提示：目前模块引擎不适合Android，预计1月15日前完成适配，欢迎体验！

有关更多APP信息，请访问www.统软云.com