组件简单认识和上下滑动式切换组件教程

图片镇楼下面才是重点咦，我的图片呢？？

如果你有宽高和数据库差不多的两个或者多个组件，可以整合后以上下滑动的变量来回切换显示

写前先认识一下组件代码构架：
<Lockscreen version=”1” frameRate=”60” screenWidth=”900” screenHeight=”900”  displayDesktop=”true”>
这是一个描述，由版本1，60祯，宽高900像素值，显示桌面组成，可根据自己的背景图和动画代码来调节。


开头可以放入刷新数据代码，以天气为例加入最简单的开屏刷新，这里有两个触发器暂停和恢复来刷新：
<!-- ExternalCommands 元素定义了一组外部命令，这些命令可以在特定条件下触发 -->
<ExternalCommands>
    <!-- Trigger 元素定义了一个触发器，它有一个 action 属性，表示触发的动作 -->
    <!-- 当 action 为 ”resume” 时，触发器会执行其内部的 RefreshWeatherCommand 命令 -->
    <Trigger action=”resume”>
      <!-- RefreshWeatherCommand 是一个命令，用于刷新天气信息 -->
      <RefreshWeatherCommand/>
    </Trigger>
    <!-- 另一个 Trigger 元素，当 action 为 ”pause” 时，不执行任何命令 -->
    <Trigger action=”pause”/>
</ExternalCommands>



下面是数据存储组，可以包含天气，黄历，运动指数，年月日变化等等，以天气为例：
<!-- 定义天气信息 -->
<Weather>
    <!-- 今天的天气图标，0表示未知 -->

<Var name=”Weather.today.weatherIcon” expression=”0” type=”int”/>
    <!-- 今天的天气描述，´未知´表示未知 -->

<Var name=”Weather.today.weatherIconDes” expression=”´未知´” type=”string”/>
    <!-- 今天的空气质量指数文本，´未知´表示未知 -->

<Var name=”Weather.today.aqivaluetext” expression=”´未知´” type=”string”/>
    <!-- 今天的空气质量指数，2表示中等 -->

<Var name=”Weather.today.aqivalue” expression=”2” type=”int”/>
    <!-- 今天的当前温度，25表示摄氏度25度 -->

<Var name=”Weather.today.currentTem” expression=”25” type=”int”/>
    <!-- 今天的最高温度，25表示摄氏度25度 -->

<Var name=”Weather.today.maxtemp” expression=”25” type=”int”/>
    <!-- 今天的最低温度，20表示摄氏度20度 -->

<Var name=”Weather.today.mintemp” expression=”20” type=”int”/>
    <!-- 今天的湿度，50表示湿度百分比为50% -->

<Var name=”Weather.today.humidity” expression=”50” type=”int”/>
    <!-- 今天的运动建议等级，1表示适宜 -->

<Var name=”Weather.today.sportsLevel” expression=”1” type=”int”/>
    <!-- 今天的穿衣建议等级，1表示适宜 -->

<Var name=”Weather.today.dressingLevel” expression=”1” type=”int”/>
    <!-- 今天的洗车建议等级，0表示不宜洗车 -->

<Var name=”Weather.today.carWashLevel” expression=”0” type=”int”/>
    <!-- 今天的空气质量指数，2表示中等 -->

<Var name=”Weather.today.aqivalue” expression=”2” type=”int”/>
    <!-- 今天的风向描述，´东南风´表示东南方向的风 -->

<Var name=”Weather.today.winddirDes” expression=”´东南风´” type=”string”/>
</Weather>


简单的数据组编辑后，就是考虑怎么把它显示到屏幕上来，如果需要图片显示，还要编写天气数据组图片，代码太长了直接去其他组件复制吧，这里由时间图片组显示，就是加入了图片.png来显示一个时间元素，例为：

<Image x=”#sw/2” y=”#sw/2” align=”center” src=”图片.png” srcid=”int((#hour24)/10)”/>
它描述了一个坐标xy轴的图像，被设置成为居中显示，属性值表达了当前小时数除以10并取整显示


也可以用纯代码文本组来实现，省去了图片编辑的麻烦，缺点是更改了字体，有可能让你的显示失衡，所以对齐方式尽量写成一样的，例为：

<DateTime x=”466” align=”left” alignV=”center” y=”90” color=”#ffffff” size=”120” format=”HH:mm:”/>
它描述了一个坐标x轴的文本元素被设置了左对齐，垂直居中对齐后以白色120像素的属性值显示时分秒


其实代码还有很多的变量变化，但简单认识完代码构架，是不是就可以明白哪个组件需要什么代码来整合显示资源（带坐标值的代码），整合2个或者多个小组件来提高可玩性，让一个小组件可包含你所需要的各种功能，那么代码来了：

<!-- 创建一个按钮，位置为 (0, 0)，宽度为 1080，高度为 864 -->数值可变
<Button y=”0” x=”0” w=”1080” h=”864”>
    <!-- 当按钮的 up 动作被触发时执行以下操作 -->
    <Trigger action=”up”>
        <!-- 如果 group 变量等于 1，则将其设置为 2；如果 group 变量等于 2，则将其设置为 3；否则设置为 1 -->
        <VariableCommand name=”group” expression=”ifelse(eq(#group,1),2,eq(#group,2),3,1)” condition=”ge(abs(#move),200)”/>
        <!-- 如果 move 的绝对值大于等于 200，播放 g2_y 动画 -->
        <Command target=”g2_y.animation” value=”play” condition=”ge(abs(#move),200)”/>
        <!-- 如果 move 的绝对值大于等于 200，播放 gp_al 动画 -->
        <Command target=”gp_al.animation” value=”play” condition=”ge(abs(#move),200)”/>
    </Trigger>
</Button>

<!-- 创建一个可见性受 group 变量控制的组，位置为 (0, 0) -->
<Group visibility=”eq(#group,1)” x=”0” y=”0”>
<!-- 这里放置第一组的内容 -->
</Group>
<!-- 创建一个可见性受 group 变量控制的组，位置为 (0, 0) -->
<Group visibility=”eq(#group,1)” x=”0” y=”0”>
<!-- 这里放置第二组的内容 -->
</Group>
<!-- 创建一个可见性受 group 变量控制的组，位置为 (0, 0) -->
<Group visibility=”eq(#group,1)” x=”0” y=”0”>
<!-- 这里放置第三组的内容 -->
</Group>


完毕，第一次写那么多最后：授人以鱼不如授人以渔，我也是新手，全靠各种求助和百度，论坛里各种搜索学会那么一点点，没有师傅没有pp群，如果你也喜欢装饰自己的主题，那么多拆包多学习多求助论坛大佬吧，只有自己做的一些元素才会符合自己的审美观，期待未来在看的各位大佬做出各种好看的主题和组件！

沙发备用

同志们 白不白？

虽然看不懂，但是还是给你一个大大的赞

伟大，纯粹

很白很大，需要很长的代码去控制

感谢分享！收藏了

流弊啊！字太多看不懂，尽量简洁明了表达你的意思

技术贴，

求大佬解惑，小组件添加到主题了，选择添加小组件，能看到小组件为啥添加不到桌面上啊？