USART HMI 资料中心

官方技术交流QQ群:916560014

站点工具


5.控件详解:3.触摸热区控件

差别

这里会显示出您选择的修订版和当前版本之间的差别。

到此差别页面的链接

两侧同时换到之前的修订记录 前一修订版
5.控件详解:3.触摸热区控件 [2020/07/30 09:32]
tjcqiu
5.控件详解:3.触摸热区控件 [2020/07/30 09:35] (当前版本)
tjcqiu
行 1: 行 1:
 <h1 style="​white-space:​ normal; text-align: center;">​触摸热区使用说明</​h1><​hr/><​p style="​white-space:​ normal;"><​br/></​p><​table><​tbody><​tr class="​firstRow"><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​名称</​td><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​操作</​td><​td width="​90"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​版本</​td><​td width="​133"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​日期<​br/></​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ width="​275"​ align="​center"​ style="​word-break:​ break-all;">​说明</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ align="​center"​ width="​166"​ style="​word-break:​ break-all;">​编辑</​td></​tr><​tr><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​《触摸热区使用说明》</​td><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​创建中</​td><​td width="​90"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​V1.0</​td><​td width="​133"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​2019-02-28</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ width="​275"​ align="​center"​ style="​word-break:​ break-all;">​第一次编辑完成,正式发布。</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ align="​center"​ width="​166"​ style="​word-break:​ break-all;">​zcd</​td></​tr></​tbody></​table><​p><​br/></​p><​hr/><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​【目录】<​br/></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​一、<​a href="#​yi"​ target="​_self">​触摸热区控件-概述</​a></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​二、<​a href="#​er"​ target="​_self">​触摸热区控件-简单使用</​a></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​三、<​a href="#​san"​ target="​_self">​触摸热区控件-属性详解</​a></​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.1、<​a href="#​sanyi"​ target="​_self">​控件属性描述</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.2、<​a href="#​saner"​ target="​_self">​控件属性编辑</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.1、<​a href="#​saneryi"​ target="​_self">​编辑属性</​a>&​nbsp;​ &​nbsp;</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.2、<​a href="#​sanerer"​ target="​_self">​读属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.3、<​a href="#​sanersan"​ target="​_self">​写属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.3 、<a href="#​sansan"​ target="​_self">​属性详解</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &nbsp; 3.3.1、<​a href="#​sansanyi"​ target="​_self">​x,y属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.2、<​a href="#​sansaner"​ target="​_self">​w,h属性</​a><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.3、<​a href="#​sansanershiyi"​ target="​_self">​vscope属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.4、<​a href="#​sansanershier"​ target="​_self">​objname属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.5、<​a href="#​sansanershisan"​ target="​_self">​id属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.6、<​a href="#​sansanershisi"​ target="​_self">​type属性</​a></​p><​p style="​text-indent:​ 0em; white-space:​ normal;"><​strong>​四、<​a href="#​si"​ target="​_self">​触摸热区控件-使用详解</​a></​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​4.1、<​a href="#​siyi"​ target="​_self">​在页面上新建触摸热区控件</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​4.2、<​a href="#​sier"​ target="​_self">​触摸热区控件外观调整</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​text-indent:​ 32px;">​4.3、</​span><​a href="#​sisan"​ target="​_self">​触摸热区控件实战使用</​a></​p><​hr/><​h3 style="​white-space:​ normal;"><​a name="​yi"></​a>​一、触摸热区控件-概述<​br/></​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.1、触摸热区控件是串口屏诸多功能控件里面的其中一个。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.2、用于在串口屏上做一个不需要任何显示内容(全透明)用户又可以可以触摸触发一定功能的“按钮”。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.3、在《USART HMI》软件左侧工具箱里面(如下图所示)。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190225/​1551108336125347.png"​ title="​1551108336125347.png"​ alt="​image.png"/></​p><​hr/><​h3 style="​white-space:​ normal;"><​a name="​er"></​a>​二、触摸热区控件-简单使用<​br/></​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​用触摸热区控件,做一个简单的<​span style="​text-indent:​ 2em;">​“全透明”按钮工程(如下图所示)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551279266679256.png"​ title="​1551279266679256.png"​ alt="​image.png"/></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127);">​▲&​lt;​触摸热区空间&​gt;​实现按钮功能</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127);"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 32px;">​用触摸热区控件,做一个隐藏菜单,在1秒时间内连续5次按下特定屏幕区域激活隐藏菜单功能</​span><​span style="​text-indent:​ 2em;">​。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280192102910.png"​ title="​1551280192102910.png"​ alt="​image.png"/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 32px;">​用触摸热区控件,做一个函数调用功能,让单片机发命令出发该功能</​span><​span style="​text-indent:​ 2em;">​。</​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551281164293046.png"​ title="​1551281164293046.png"​ alt="​image.png"/></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​▲&​lt;​触摸热区空间&​gt;​实现函数功能</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​1,在屏幕上新建一个触摸热区。</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​2,将热区尺寸修改到最小,且放在用户不容易触摸到的地方。(有必要的话使用&​lt;<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​tsw"​ target="​_self">​tsw</​a>&​nbsp;​m2,​0&​gt;​指令禁止触摸功能,防止用户操作误触发)</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​3,当需要执行按下事件代码(相当于一个函数功能)的时候,使用&​lt;<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​click"​ target="​_self">​click</​a>&​nbsp;​m2,​1&​gt;​指令出发该事件。</​span></​span></​span></​p><​hr/><​h3 style="​white-space:​ normal;"><​strong><​a name="​san"></​a>​三、触摸热区控件-属性详解</​strong></​h3><​p style="​white-space:​ normal; text-indent:​ 2em;">​串口屏所有控件操作的实质都是对属性的修改。触摸热区控件具有的属性如下表所示。<​strong><​br/></​strong></​p><​p style="​white-space:​ normal; text-align: center;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190225/​1551107944135326.png"​ title="​1551107944135326.png"​ alt="​image.png"/></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​sanyi"></​a>​3.1、控件属性描述</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​如上图所示,当鼠标选中对应属性时,会在属性窗口的最下方出现该属性的详细描述信息。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​saner"></​a>​3.2、控件属性编辑</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​saneryi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.1、编辑属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 用户可以随时调整、编辑列表中的属性参数。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:type和id属性由开发环境指定,用户不可修改。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sanerer"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.2、读属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 如上图所示的控件属性列表,可以在设备运行中随时读取。</​p><​pre class="​brush:​cpp;​toolbar:​false">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​sys0=m0.id&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;//​将触摸热区控件m0的id号赋值给sys0变量 <h1 style="​white-space:​ normal; text-align: center;">​触摸热区使用说明</​h1><​hr/><​p style="​white-space:​ normal;"><​br/></​p><​table><​tbody><​tr class="​firstRow"><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​名称</​td><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​操作</​td><​td width="​90"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​版本</​td><​td width="​133"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​日期<​br/></​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ width="​275"​ align="​center"​ style="​word-break:​ break-all;">​说明</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ align="​center"​ width="​166"​ style="​word-break:​ break-all;">​编辑</​td></​tr><​tr><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​《触摸热区使用说明》</​td><​td width="​166"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​创建中</​td><​td width="​90"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​V1.0</​td><​td width="​133"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all;">​2019-02-28</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ width="​275"​ align="​center"​ style="​word-break:​ break-all;">​第一次编辑完成,正式发布。</​td><​td valign="​middle"​ colspan="​1"​ rowspan="​1"​ align="​center"​ width="​166"​ style="​word-break:​ break-all;">​zcd</​td></​tr></​tbody></​table><​p><​br/></​p><​hr/><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​【目录】<​br/></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​一、<​a href="#​yi"​ target="​_self">​触摸热区控件-概述</​a></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​二、<​a href="#​er"​ target="​_self">​触摸热区控件-简单使用</​a></​strong></​p><​p style="​white-space:​ normal; line-height:​ 1.75em;"><​strong>​三、<​a href="#​san"​ target="​_self">​触摸热区控件-属性详解</​a></​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.1、<​a href="#​sanyi"​ target="​_self">​控件属性描述</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.2、<​a href="#​saner"​ target="​_self">​控件属性编辑</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.1、<​a href="#​saneryi"​ target="​_self">​编辑属性</​a>&​nbsp;​ &​nbsp;</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.2、<​a href="#​sanerer"​ target="​_self">​读属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 3.2.3、<​a href="#​sanersan"​ target="​_self">​写属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​3.3 、<a href="#​sansan"​ target="​_self">​属性详解</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &nbsp; 3.3.1、<​a href="#​sansanyi"​ target="​_self">​x,y属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.2、<​a href="#​sansaner"​ target="​_self">​w,h属性</​a><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.3、<​a href="#​sansanershiyi"​ target="​_self">​vscope属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.4、<​a href="#​sansanershier"​ target="​_self">​objname属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.5、<​a href="#​sansanershisan"​ target="​_self">​id属性</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.5em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​3.3.6、<​a href="#​sansanershisi"​ target="​_self">​type属性</​a></​p><​p style="​text-indent:​ 0em; white-space:​ normal;"><​strong>​四、<​a href="#​si"​ target="​_self">​触摸热区控件-使用详解</​a></​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​4.1、<​a href="#​siyi"​ target="​_self">​在页面上新建触摸热区控件</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​4.2、<​a href="#​sier"​ target="​_self">​触摸热区控件外观调整</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​text-indent:​ 32px;">​4.3、</​span><​a href="#​sisan"​ target="​_self">​触摸热区控件实战使用</​a></​p><​hr/><​h3 style="​white-space:​ normal;"><​a name="​yi"></​a>​一、触摸热区控件-概述<​br/></​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.1、触摸热区控件是串口屏诸多功能控件里面的其中一个。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.2、用于在串口屏上做一个不需要任何显示内容(全透明)用户又可以可以触摸触发一定功能的“按钮”。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​1.3、在《USART HMI》软件左侧工具箱里面(如下图所示)。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190225/​1551108336125347.png"​ title="​1551108336125347.png"​ alt="​image.png"/></​p><​hr/><​h3 style="​white-space:​ normal;"><​a name="​er"></​a>​二、触摸热区控件-简单使用<​br/></​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​用触摸热区控件,做一个简单的<​span style="​text-indent:​ 2em;">​“全透明”按钮工程(如下图所示)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551279266679256.png"​ title="​1551279266679256.png"​ alt="​image.png"/></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127);">​▲&​lt;​触摸热区空间&​gt;​实现按钮功能</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127);"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 32px;">​用触摸热区控件,做一个隐藏菜单,在1秒时间内连续5次按下特定屏幕区域激活隐藏菜单功能</​span><​span style="​text-indent:​ 2em;">​。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280192102910.png"​ title="​1551280192102910.png"​ alt="​image.png"/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​br/></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 32px;">​用触摸热区控件,做一个函数调用功能,让单片机发命令出发该功能</​span><​span style="​text-indent:​ 2em;">​。</​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551281164293046.png"​ title="​1551281164293046.png"​ alt="​image.png"/></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​▲&​lt;​触摸热区空间&​gt;​实现函数功能</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​1,在屏幕上新建一个触摸热区。</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​2,将热区尺寸修改到最小,且放在用户不容易触摸到的地方。(有必要的话使用&​lt;<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​tsw"​ target="​_self">​tsw</​a>&​nbsp;​m2,​0&​gt;​指令禁止触摸功能,防止用户操作误触发)</​span></​span></​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​text-indent:​ 2em;"><​span style="​color:​ rgb(127, 127, 127); text-indent:​ 32px;">​3,当需要执行按下事件代码(相当于一个函数功能)的时候,使用&​lt;<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​click"​ target="​_self">​click</​a>&​nbsp;​m2,​1&​gt;​指令出发该事件。</​span></​span></​span></​p><​hr/><​h3 style="​white-space:​ normal;"><​strong><​a name="​san"></​a>​三、触摸热区控件-属性详解</​strong></​h3><​p style="​white-space:​ normal; text-indent:​ 2em;">​串口屏所有控件操作的实质都是对属性的修改。触摸热区控件具有的属性如下表所示。<​strong><​br/></​strong></​p><​p style="​white-space:​ normal; text-align: center;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190225/​1551107944135326.png"​ title="​1551107944135326.png"​ alt="​image.png"/></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​sanyi"></​a>​3.1、控件属性描述</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​如上图所示,当鼠标选中对应属性时,会在属性窗口的最下方出现该属性的详细描述信息。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​saner"></​a>​3.2、控件属性编辑</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​saneryi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.1、编辑属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 用户可以随时调整、编辑列表中的属性参数。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:type和id属性由开发环境指定,用户不可修改。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sanerer"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.2、读属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 如上图所示的控件属性列表,可以在设备运行中随时读取。</​p><​pre class="​brush:​cpp;​toolbar:​false">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​sys0=m0.id&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;//​将触摸热区控件m0的id号赋值给sys0变量
-&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​prints&​nbsp;​t0.x,​0&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;//​将m0的x坐标从串口发送出去。</​pre><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:objname属性不可以读取。比如在事件代码中写&​quot;​t0.txt=t0.objname&​quot;​编译将报错。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sanersan"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.3、写属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 所有绿色控件可以在运行中实时修改。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:因产品系列不同,属性的写权限也不完全相同。比如X系列可以在运行该过程中修改x,y属性。但是T0,​K0系列不能在运行过程中修改x,y属性!</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​sansan"></​a>​3.3 、属性详解</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanyi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.1、x,y属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​x,y属性描述控件在屏幕上的像素坐标位置。以屏幕左上角为像素坐标原点(x=0,​y=0)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​T0,​K0系列产品,x,y属性只能从:0--最大分辨率。不能超出屏幕显示区域。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​X系列产品,x,y属性可以超出屏幕坐标范围(-6000~+6000),但是超出屏幕将被裁减,不会显示出来。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​技巧:如果想做一个控件,但是不想让用户看到,触摸到。可以把该控件放在屏幕显示区域以外。开发人员使用的时候,使用<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​click"​ target="​_self">​click</​a>​指令,</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​或者绑定<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​cfgpio"​ target="​_self">​用户IO</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; <a name="​sansaner"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">&​nbsp;​3.3.2、w,h属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​w,h属性描述控件在屏幕上宽度和高度(像素大小为单位)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​T0,​K0系列产品,w,h属性只能从:0--最大分辨率。不能超出屏幕显示区域。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​X系列产品,x+w,y+h的值可以超出屏幕坐标范围,但是超出屏幕将被裁减,不会显示出来。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershiyi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.3、vscope属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &​nbsp;&​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​ vscope属性。控件内存占用属性。控件支持私有和全局属性。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &​nbsp;&​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​ 当设置为全局时,控件分配的内存在所有页面都可以访问。离开当前页面后,控件属性数据也不会丢失。缺点是,占用系统总内存。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershier"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.4、objname属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​objname属性。控件名称属性。该属性在运行中不能获取。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershisan"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.5、id属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​id属性。控件id是每个控件在当前页面的唯一标识号。由系统分配,不可修改。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershisi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.6、type属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​type属性。控件类型属性。由系统分别固定数据,比如文本控件属性为116。</​p><​p style="​white-space:​ normal;"><​br/></​p><​h3 style="​white-space:​ normal;"><​a name="​si"></​a>​四、触摸热区控件-使用详解</​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​a name="​siyi"></​a><​strong><​span style="​color:​ rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);">​4.1</​span></​strong>​、<​strong>​在页面上新建触摸热区控件</​strong></​p><​table align="​center"><​tbody><​tr class="​firstRow"><​td valign="​top"​ style="​border-color:​ rgb(255, 255, 255);"><​p style="​text-indent:​ 0em;"><​img src="​http://​wiki.tjc1688.com/​dokuwiki/​ueditor/​php/​upload/​image/​20190108/​1546959609793764.png"​ title="​1546959609793764.png"​ alt="​image.png"​ width="​451"​ height="​194"/><​br/></​p></​td><​td valign="​top"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280374293003.png"​ title="​1551280374293003.png"​ alt="​image.png"​ width="​521"​ height="​184"/></​td></​tr><​tr><​td valign="​middle"​ align="​center"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​p style="​text-indent:​ 0em;"><​span style="​color:​ rgb(127, 127, 127);">​1、打开一个新的空白界面▲</​span></​p></​td><​td valign="​middle"​ align="​center"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​span style="​color:​ rgb(127, 127, 127);">​2、点击左侧&​lt;​工具箱&​gt;​里面的&​lt;​触摸热区&​gt;​按钮,当前页面出现一个触摸热区控件▲</​span></​td></​tr></​tbody></​table><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​a name="​sier"></​a><​span style="​color:​ rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);"><​strong>​4.2</​strong></​span><​strong>​、触摸热区控件外观调整</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​上一步我们创建了一个触摸热区控件,现在我们触摸热区控件的外观(显示效果)。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​border:​ 1px solid rgb(0, 0, 0);"><​a name="​sieryi"></​a>​4.2.1调整位置和尺寸</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​将触摸热区控件移显示区中心位置,并调大到能放下。</​p><​table><​tbody><​tr class="​firstRow"><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ background-color:​ rgb(127, 127, 127); color: rgb(255, 255, 255);">​I.</​span>​新添加上“触摸热区控件”预览</​td><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ color: rgb(255, 255, 255); background-color:​ rgb(127, 127, 127);">​II.</​span>​摆放到指定位置并调整到需要尺寸预览</​td><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ background-color:​ rgb(127, 127, 127); color: rgb(255, 255, 255);">​III.</​span>​操作说明</​td></​tr><​tr><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280432664841.png"​ title="​1551280432664841.png"​ alt="​image.png"​ width="​355"​ height="​210"/></​td><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280460604940.png"​ title="​1551280460604940.png"​ alt="​image.png"​ width="​358"​ height="​211"/></​td><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​p style="​line-height:​ 1.75em;">​▷移动位置:鼠标选中控件,拖到需要摆放的位置。</​p><​p style="​line-height:​ 1.75em;">​▷调整大小:鼠标指针选中控件的任意一条边,或任意一个角,拖动即可调整大小。</​p><​p style="​line-height:​ 1.75em;"><​span style="​border:​ 1px solid rgb(0, 0, 0);">​其他方法:如果不想使用鼠标,也可以通过修改属性列表中的“x、y坐标”来调整位置,修改属性列表中的“宽度和高度”来调整大小。</​span></​p></​td></​tr></​tbody></​table><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​text-indent:​ 2em;"></​span></​p><​hr/><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em; text-align: center;"><​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;<​a name="​sisan"></​a><​span style="​text-indent:​ 32px; color: rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);"><​strong>​4.3</​strong></​span><​strong style="​text-indent:​ 32px; white-space:​ normal;">​、触摸热区控件实战使用</​strong></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ ①做当前页面函数调用。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 在当前页面一个功能需要多次调用,​那么可以设置一个触摸热区通过<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​click"​ target="​_self">​click</​a>​指令来触发,可以把它设置在屏幕外以防被人误碰触发到。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 注:click指令只能触发当前页面控件,不可跨页面触发。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ ②做区域隐藏触摸按钮。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 一个区域都需要触发相同的事件,但该区域是多个控件组成的。那么我们就可以设置一个触摸热区在上面。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 注:如果不想触发该触摸热区,可以通过<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​tsw"​ target="​_self">​tsw</​a>​指令,<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​vis"​ target="​_self">​vis</​a>​指令。x系列可以</​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em; text-align: center;">​END</​p><​p><​br/></​p><​p><​br/></​p><​p><​br/></​p>​+&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​prints&​nbsp;​t0.x,​0&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;//​将m0的x坐标从串口发送出去。</​pre><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:objname属性不可以读取。比如在事件代码中写&​quot;​t0.txt=t0.objname&​quot;​编译将报错。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sanersan"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.2.3、写属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;​ &nbsp; &nbsp; 所有绿色控件可以在运行中实时修改。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​注意:因产品系列不同,属性的写权限也不完全相同。比如X系列可以在运行该过程中修改x,y属性。但是T0,​K0系列不能在运行过程中修改x,y属性!</​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​strong><​a name="​sansan"></​a>​3.3 、属性详解</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanyi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.1、x,y属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​x,y属性描述控件在屏幕上的像素坐标位置。以屏幕左上角为像素坐标原点(x=0,​y=0)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​T0,​K0系列产品,x,y属性只能从:0--最大分辨率。不能超出屏幕显示区域。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​X系列产品,x,y属性可以超出屏幕坐标范围(-6000~+6000),但是超出屏幕将被裁减,不会显示出来。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​技巧:如果想做一个控件,但是不想让用户看到,触摸到。可以把该控件放在屏幕显示区域以外。开发人员使用的时候,使用<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​click"​ target="​_self">​click</​a>​指令,</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">​或者绑定<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86#​cfgpio"​ target="​_self">​用户IO</​a></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; <a name="​sansaner"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">&​nbsp;​3.3.2、w,h属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;"><​span style="​text-indent:​ 2em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​w,h属性描述控件在屏幕上宽度和高度(像素大小为单位)。</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​T0,​K0系列产品,w,h属性只能从:0--最大分辨率。不能超出屏幕显示区域。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​X系列产品,x+w,y+h的值可以超出屏幕坐标范围,但是超出屏幕将被裁减,不会显示出来。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershiyi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.3、vscope属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &​nbsp;&​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​ vscope属性。控件内存占用属性。控件支持私有和全局属性。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &​nbsp;&​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​ 当设置为全局时,控件分配的内存在所有页面都可以访问。离开当前页面后,控件属性数据也不会丢失。缺点是,占用系统总内存。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershier"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.4、objname属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​objname属性。控件名称属性。该属性在运行中不能获取。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershisan"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.5、id属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​id属性。控件id是每个控件在当前页面的唯一标识号。由系统分配,不可修改。</​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;<​a name="​sansanershisi"></​a>&​nbsp;<​span style="​border:​ 1px solid rgb(0, 0, 0);">​3.3.6、type属性</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em;">&​nbsp;​ &nbsp; &​nbsp;&​nbsp;​ &nbsp; &​nbsp;&​nbsp;&​nbsp;​type属性。控件类型属性。由系统分别固定数据,比如文本控件属性为116。</​p><​p style="​white-space:​ normal;"><​br/></​p><​h3 style="​white-space:​ normal;"><​a name="​si"></​a>​四、触摸热区控件-使用详解</​h3><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​a name="​siyi"></​a><​strong><​span style="​color:​ rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);">​4.1</​span></​strong>​、<​strong>​在页面上新建触摸热区控件</​strong></​p><​table align="​center"><​tbody><​tr class="​firstRow"><​td valign="​top"​ style="​border-color:​ rgb(255, 255, 255);"><​p style="​text-indent:​ 0em;"><​img src="​http://​wiki.tjc1688.com/​dokuwiki/​ueditor/​php/​upload/​image/​20190108/​1546959609793764.png"​ title="​1546959609793764.png"​ alt="​image.png"​ width="​451"​ height="​194"/><​br/></​p></​td><​td valign="​top"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280374293003.png"​ title="​1551280374293003.png"​ alt="​image.png"​ width="​521"​ height="​184"/></​td></​tr><​tr><​td valign="​middle"​ align="​center"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​p style="​text-indent:​ 0em;"><​span style="​color:​ rgb(127, 127, 127);">​1、打开一个新的空白界面▲</​span></​p></​td><​td valign="​middle"​ align="​center"​ style="​border-color:​ rgb(255, 255, 255); word-break: break-all;"><​span style="​color:​ rgb(127, 127, 127);">​2、点击左侧&​lt;​工具箱&​gt;​里面的&​lt;​触摸热区&​gt;​按钮,当前页面出现一个触摸热区控件▲</​span></​td></​tr></​tbody></​table><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​a name="​sier"></​a><​span style="​color:​ rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);"><​strong>​4.2</​strong></​span><​strong>​、触摸热区控件外观调整</​strong></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​上一步我们创建了一个触摸热区控件,现在我们触摸热区控件的外观(显示效果)。</​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​border:​ 1px solid rgb(0, 0, 0);"><​a name="​sieryi"></​a>​4.2.1调整位置和尺寸</​span></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;">​将触摸热区控件移显示区中心位置,并调大到能放下。</​p><​table><​tbody><​tr class="​firstRow"><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ background-color:​ rgb(127, 127, 127); color: rgb(255, 255, 255);">​I.</​span>​新添加上“触摸热区控件”预览</​td><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ color: rgb(255, 255, 255); background-color:​ rgb(127, 127, 127);">​II.</​span>​摆放到指定位置并调整到需要尺寸预览</​td><​td width="​354"​ valign="​middle"​ align="​center"​ style="​word-break:​ break-all; background-color:​ rgb(219, 229, 241);"><​span style="​font-family:​ &​quot;​comic sans ms&​quot;;​ background-color:​ rgb(127, 127, 127); color: rgb(255, 255, 255);">​III.</​span>​操作说明</​td></​tr><​tr><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280432664841.png"​ title="​1551280432664841.png"​ alt="​image.png"​ width="​355"​ height="​210"/></​td><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​img src="/​dokuwiki/​ueditor/​php/​upload/​image/​20190227/​1551280460604940.png"​ title="​1551280460604940.png"​ alt="​image.png"​ width="​358"​ height="​211"/></​td><​td width="​354"​ valign="​top"​ style="​word-break:​ break-all;"><​p style="​line-height:​ 1.75em;">​▷移动位置:鼠标选中控件,拖到需要摆放的位置。</​p><​p style="​line-height:​ 1.75em;">​▷调整大小:鼠标指针选中控件的任意一条边,或任意一个角,拖动即可调整大小。</​p><​p style="​line-height:​ 1.75em;"><​span style="​border:​ 1px solid rgb(0, 0, 0);">​其他方法:如果不想使用鼠标,也可以通过修改属性列表中的“x、y坐标”来调整位置,修改属性列表中的“宽度和高度”来调整大小。</​span></​p></​td></​tr></​tbody></​table><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​br/></​p><​p style="​white-space:​ normal; text-indent:​ 2em; line-height:​ 1.75em;"><​span style="​text-indent:​ 2em;"></​span></​p><​hr/><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em; text-align: center;"><​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;<​a name="​sisan"></​a><​span style="​text-indent:​ 32px; color: rgb(255, 255, 255); background-color:​ rgb(0, 0, 0);"><​strong>​4.3</​strong></​span><​strong style="​text-indent:​ 32px; white-space:​ normal;">​、触摸热区控件实战使用</​strong></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ ①做当前页面函数调用。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 在当前页面一个功能需要多次调用,​那么可以设置一个触摸热区通过<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​click"​ target="​_self">​click</​a>​指令来触发,可以把它设置在屏幕外以防被人误碰触发到。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 注:click指令只能触发当前页面控件,不可跨页面触发。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ ②做区域隐藏触摸按钮。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 一个区域都需要触发相同的事件,但该区域是多个控件组成的。那么我们就可以设置一个触摸热区在上面。<​br/></​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em;">&​nbsp;&​nbsp;&​nbsp;&​nbsp;&​nbsp;​ 注:如果不想触发该触摸热区,可以通过<​a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​tsw"​ target="​_self">​tsw</​a>​指令禁止触摸,<a href="​http://​wiki.tjc1688.com/​doku.php?​id=6.%E6%8C%87%E4%BB%A4%E9%9B%86:​1.%E5%9F%BA%E6%9C%AC%E6%8C%87%E4%BB%A4%E9%9B%86,​vis"​ target="​_self">​vis</​a>​指令隐藏。x系列可以修改x,y坐标移出外面。</​p><​p style="​text-indent:​ 0em; white-space:​ normal; line-height:​ 1.75em; text-align: center;">​END</​p><​p><​br/></​p><​p><​br/></​p><​p><​br/></​p>​
5.控件详解/3.触摸热区控件.txt · 最后更改: 2020/07/30 09:35 由 tjcqiu        浏览次数:20432/2437879(本页/全站)