在SOUI中使用布局模板
概要
注意:布局模板是SOUI 2.8.0.4 新增加的功能。之前版本不支持。
SOUI的listview等一系统控件支持通过模板来创建列表项,这里要说的模板不是指listview中的使用的列表项模板。
对于比较大的项目,在页面布局中可能会出现重复的布局结构,只是部分属性不一样。对于完全相同的布局,soui一直支持使用include属性来重复引用布局XML脚本。但是对于属性可能发生变化但整体布局一致的情况,在实现布局模板支持之前,除了在布局脚本中重复XML没有更好的办法。
有了布局模板,这样重复的布局就可以更好的解决了。
使用示例
我们先看一下demo中提供的例子。
首先是增加了一个values\template.xml文件,当然在uidef.xml里也加上:
<!--定义全局template对象-->
<template src="values:template"/>
再打开template.xml:
<?xml version="1.0" encoding="utf-8"?>
<template>
<g.block>
<window name="{{name}}" layout="hbox" gravity="center">
<window size="-1,-1" layout="hbox">
<text text="name:" colorText="{{color}}" />
<link.web text="{{text}}" href="{{text}}"/>
</window>
<img skin="skin_avatar"/>
</window>
</g.block>
</template>
在demo中我们通过template.xml的template元素定义了一个模板:g.block ,这里用"g."开头,代表这是一个全局的模板。有全局模板就会有局部模板,局部模板和全局模板定义类似,只是它定义在布局文件的SOUI节点下,和root节点平级即可,也可参考局部style,局部skin的设置。一个局部的模板只能在当前宿主窗口中有效。另外这里的名字可以随便写,不一定要以“g.”开头。
观察上面的模板,我们发现有3个字符串是“{{xxx}}”形式,这是布局的变量,将会在使用布局的时候被传递的实际参数替换。
再看一下在布局XML里如何引用这个模板:
<t:g.block size="-1,-1">
<data name="tpl_soime" color="#ff0000" text="soime.cn!"/>
</t:g.block>
<t:g.block size="-2,-1">
<data name="tpl_soui" color="#0000ff" text="ui520.cn"/>
</t:g.block>
注意,SOUI使用“t:”这个名字空间来标识后面是一个模板调用。
模板调用后面的布局参数会覆盖模板的第一个子节点的布局参数。注意,一个模板应该只有一个布局根节点,多个布局根节点会被自动忽略。
在调用模板的XML节点必须有一个data子节点来存储参数值,这些参数会自动替换模板中对应的变量。
这就是整个模板使用过程。如果不使用模板,达到同样的效果,模板中的XML要重复写2次,使用模板后,xml结构会更简洁。
运行效果:
下面我们看看demo中的效果:
模板的使用方法完成。
启程软件 2019-03-14
在SOUI中使用布局模板的更多相关文章
- 借助 SIMD 数据布局模板和数据预处理提高 SIMD 在动画中的使用效率
原文链接 简介 为发挥 SIMD1 的最大作用,除了对其进行矢量化处理2外,我们还需作出其他努力.可以尝试为循环添加 #pragma omp simd3,查看编译器是否成功进行矢量化,如果性能有所提升 ...
- 第五篇:在SOUI中使用XML布局属性指引(pos, offset, pos2type)
窗口布局的概念 每一个UI都是由大量的界面元素构成的,在Windows编程,这些界面元素的最小单位通常称之为控件. 布局就是这些控件在主界面上的大小及相对位置. 传统的布局一般使用一个4个绝对坐标来定 ...
- 在SOUI中使用网格布局
在实现网格布局前,SOUI支持两种布局形式:相对布局,和线性布局,其中线性布局是2017年2月份才支持的布局. 这两年工作都在Android这里,Android里有号称5大布局(RelativeLay ...
- 在SOUI中使用线性布局
SOUI 2.5.1.1开始支持线性布局(LinearLayout). 要在SOUI布局中使用线性布局, 需要在布局容器窗口里指定布局类型为vbox | hbox, (vbox为垂直线性布局, hbo ...
- 第二十二篇:在SOUI中使用代码向窗口中插入子窗口
使用SOUI开发客户端UI程序,通常也推荐使用XML代码来创建窗口,这样创建的窗口使用方便,当窗口大小改变时,内部的子窗口也更容易协同变化. 但是最近不断有网友咨询如何使用代码来创建SOUI子窗口,特 ...
- 在RichFaces中使用Facelets模板
在RichFaces中使用Facelets模板 目录 Facelets简介 Facelets标签 创建相应文件 Facelets简介 Facelets是用来构建JSF应用程序的默认视图技术.它为表现层 ...
- 第二十三篇:在SOUI中使用LUA脚本开发界面
像写网页一样做客户端界面可能是很多客户端开发的理想. 做好一个可以实现和用户交互的动态网页应该包含两个部分:使用html做网页的布局,使用脚本如vbscript,javascript做用户交互的逻辑. ...
- 第二十一篇:SOUI中的控件注册机制
Win32编程中,用户需要一个新控件时,需要向系统注册一个新的控件类型.注册以后,调用::CreateWindow时才能根据标识控件类型的字符串创建出一个新的控件窗口对象. 为了能够从XML描述的字符 ...
- 第九篇:在SOUI中使用多语言翻译
为UI在不同地区显示不同的语言是产品国际化的一个重要要求. 在SOUI中实现了一套类似QT的多语言翻译机制:布局XML不需要调整,程序代码也不需要调整,只需要为不同地区的用户提供不同的语言翻译文件即可 ...
随机推荐
- CTF--web 攻防世界web题 get_post
攻防世界web题 get_post https://adworld.xctf.org.cn/task/answer?type=web&number=3&grade=0&id=5 ...
- python9--内存管理 引用计数 标记清除 分代回收
复习 文件处理 1.操作文件的三步骤 -- 打开文件:硬盘的空间被操作系统持有 | 文件对象被应用程序持续 -- 操作文件:读写操作 -- 释放文件:释放操作系统对硬盘空间的持有 2.基础的读写 ...
- 1.9 分布式协调服务-Zookeeper(二)
zoo.cfg配置文件分析 tickTime=2000 zookeeper中最小的时间单位长度 (ms) initLimit=10 follower节点启动后与leader节点完成数据同步的时间 ...
- 树莓派的系统安装,并且利用网线直连 Mac 进行配置
最近单位给了我一个新的树莓派3B+让我自己玩.下面是我记录的我如何安装 Raspbian Stretch Lite 系统,然后如何成功不用独立显示屏而利用 MacBook 对其进行配置. 安装 Ras ...
- 网站分析平台:是选择百度统计,还是 Google Analytics 呢?
当你拥有个人博客或个人网站时,你一定需要一个平台来分析你的网站状况.之前我在法国只是使用 Google Analytics,后来回国发现这个平台在国内受限制了,于是我找到了百度统计,目前我同时使用这两 ...
- PowerEdge R430 机架式服务器安装( Ubuntu server 14.04.1 、PHP5.5.9、PHP-redis2.8、Phalcon3.1)
未解决问题:换成静态路由的话,怎么就 apt-get udpate 出现错误信息! 解决办法:么有设置网关 一.Ubuntu 系统下载地址: https://certification.ubuntu. ...
- Ext.net按钮事件中使用Response.Redirect的一个问题
今天遇到一个Response.Redirect问题 通过Ext.net按钮写发送事件时,连接中会多出一个&,如果后台不进行UrlEncode操作的话,就会出问题,可是很不幸的是,有些跳转 ...
- Axis2 WebService客户端Axis2调用
第一RPC方式,不生成客户端代码 第二,document方式,不生成客户端代码 第三,用wsdl2java工具,生成客户端方式调用 package samples.quickstart.client; ...
- vue 移动端项目总结(mint-ui)
跨域解决方案 config/dev.env.js 'use strict' const merge = require('webpack-merge') const prodEnv = require ...
- MySQL保留字不能作为字段名使用
在设计MySQL字段的时候,无意中使用InOut这个名称作为字段名称,结果前端提交后就是没有写入数据库!但后端没有任何提示,跟踪mySQL日志,也没有留下痕迹,反复查,不得其解. 后来实在没有办法情况 ...