2023年12月11日发(作者：隋淑华)

华为运动表GT2表盘主题制作教程

运动表 GT2

元素介绍

背景

背景元素，用来作为表盘的背景，一般使用屏幕尺寸相同大小的图片作为表盘的背景，是表盘不可或缺的元素。

时间

时间元素，一般把表盘上的时、分、秒等信息放到时间元素中。时间元素也是表盘不可或缺的元素。

日期

日期元素，一般把月、日、星期等信息放到日期元素中，月、日、星期可以放到不同的layer中。

控件

控件，一般除了时间和日期，把其他的信息放到控件元素中，比如步数、天气等信息。

自定义

当时间、日期、背景元素的属性栏的“自定义属性”勾选上“支持自定义”，或者当控件元素右键添加，选择自定义时，元素均支持添加自定义。如果支持自定义时，一个元素可以包含若干个自定义可选，不支持自定义时，元素可以直接由若干个绘制单元组成。

容器

容器只存在于控件元素中，在图层管理区，控件元素右键添加，选择容器。容器属性栏支持自定义，则可以通过可选项组合来定义可选的自定义集合。

绘制单元

文本

绘制数字、文字，如数字时间、文字的月份、步数等。

属性区域操作说明：

1) 位置 X，Y，W，H：X，Y 为文本框左上角在表盘坐标系内的坐标；W为文本框的宽度，H为Y到文本 baseline 的距离（H 根据字体大小自动计算）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y，W 的值不得超出 0~DPI，如，选择 390 X 390 表盘，该属性框的值不得超出 0~390。

2) 文本：下拉框选择文本字体；颜色：颜色选择器选择文本颜色，输入框输入透明度值。

注：通过点击色块按钮弹出颜色选择器选择颜色；透明度范围为 0~255。

3) 对齐：文本对齐方式，分别为左对齐、居中对齐、右对齐。

4) 数据类型：指定文本绑定显示手表系统的哪种类型数据，注意它受限于上一层级的数据类型的限制，当上一层级的数据类型不同，对应的文本支持的数据类型也会不同的。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于文本，根据不同数据类型，可以输入不同的数据范围的数据，详见下表数据类型取值范围。

手表端文本控件支持的数据类型定义：

连接文本

连接文本控件用于根据绑定数据的实际值使用连接符连接显示两个变化的文字。

属性区域操作说明：

1) 位置 X，Y，W，H：X，Y 为文本框左上角在表盘坐标系内的坐标；W 为文本框的宽度，H 为Y 到文本 baseline 的距离（H 根据字体大小自动计算）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y，W 的值不得超出 0~DPI，如，选择 390 X 390 表盘，该属性框的值不得超出 0~390。

2) 文本：下拉框选择文本字体；颜色：颜色选择器选择文本颜色，输入框输入透明度值。

注：通过点击色块按钮弹出颜色选择器选择颜色；透明度范围为 0~255。

3) 对齐：文本对齐方式，分别为左对齐、居中对齐、右对齐。

4) 数据类型：分别指定连接文本的两个文本绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于连接文本控件，根据不同数据类型，可以输入不同的数据范围的数据，详见下表数据类型取值范围。

手表端连接文本控件支持的数据类型定义：

第二个文本还多支持无数据类型：

5) 连接符：两个文本的间隔符号。

包含如下连接符号：冒号 “:”、短线 “-”、斜线 “/”、反斜线 “”、点 “.”、百分号 “%”、空格 “ ”

单图

单图用于绘制一张静态图，如静态背景图、步数图标等。

属性区域操作说明：

1) 图片路径：点击 + 号图标选择图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

2) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

选图

用于根据绑定数据的实际值显示不同的图片，通常用作天气、星期、日期等的显示。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 数据类型：指定选图控件绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于选图控件，根据不同数据类型，可以选择不同的数据，对应显示不同的图。

手表端选图控件支持的数据类型定义：

3) 图片路径：点击图片资源管理图标选择图片。添加图片需要顺序添加。请严格根据数据类型定义中的描述和要求的图片个数和顺序来添加图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

注：当数据类型选择“上午下午”和“双时区上午，下午”时，前两张图依次为上午、下午，第三张图必须添加一张透明空白图，用于 24 小时制下不显示图片。

组合图

组合图绘制，使用 0~9 十个数字的图片组合来绘制一个数字，如步数。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 对齐方式：目前支持 3 种对齐方式，左对齐、居中对齐、右对齐。

3) 数据类型：指定选图控件绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于选图控件，根据不同数据类型，可以选择不同的数据，对应显示不同的图。

手表端组合图控件支持的数据类型定义：

4) 图片路径：点击图片资源管理图标选择图片。添加图片需要顺序添加。请严格根据数据类型定 义中的描述和要求的图片个数和顺序来添加图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

直线图

直线图，通过图片资源画直线进度条，如步数完成度。只支持从左到右的水平进度条绘制。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 数据类型：指定线形进度条绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于圆形进度条控件，0%~100%对应了起始角度~终止角度范围。

手表端线形进度条控件支持的数据类型定义：

3) 图片路径：点击 + 号图标选择直线形进度条图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

弧形图

弧形图，通过图片资源画弧形进度条，如电量百分比、步数完成度。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 中心点坐标 X，Y：圆形进度条的圆心在图片坐标系中的坐标。

注：图片坐标系原点(0, 0)为图片的左上角。建议圆心坐标取图片的中心点，比如，图片尺寸为100 X 100，建议圆心坐标取值(50, 50)。

3) 半径及宽度 R，W：R 为该圆形进度条的半径（圆心与进度线条中线的距离）；W 为进度线条的宽度。

注：建议 R 值不要超过(图片边长-W)/2 ，建议 W 值小于 R 值。

4) 起始与终止角度：圆形进度条以圆心为中心点满格显示的角度范围。起始角度为进度条的起始点，终止角度为进度条的终止点。

注：角度值不得超出 0~360 范围。

注：起止角度差对应了绑定数据的 100%。

5) 数据类型：指定圆形进度条绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于圆形进度条控件，0%~100%对应了起始角度~终止角度范围。

手表端弧形图支持的数据类型定义：

6) 图片路径：点击 + 号图标选择圆形进度条底色纹理图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。建议使用正方形图片。

指针

绘制指针，如时针、分针、秒针；再如电量百分比，也可以做指针效果。

属性区域操作说明：

1) 旋转中心绝对位置 X，Y：指针图片的旋转中心在表盘坐标系中的坐标，比如指针控件一般以表盘的中心旋转，以 390 X 390 表盘为例，该 X，Y 值为(195, 195）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

注：旋转中心点为指针图片围绕该点进行旋转。

2) 旋转中心相对位置 X，Y：指针图片的旋转中心在指针图片坐标系中的坐标，比如该示例指针图片以此图片坐标系位置(14, 280)为旋转中心进行旋转。

注：指针图片坐标系原点(0, 0)为指针图片的左上角。X ，Y 的值分别不得超出图片的宽和高，如，指针图片的尺寸为 50 X 300，则 X 的值不得超出 0~50，Y 的值不得超出

0~300。

3) 起始与终止角度：指针图片围绕旋转中心进行旋转的角度范围。当起始角度小于终止角度，以顺时针的方向进行旋转。当起始角度大于终止角度， 以逆时针的方式进行旋转。

注：角度值不得超出-360~360 范围。支持 4 位小数。

注：起止角度差对应了绑定数据的 100%。

4) 数据类型：指定该指针绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于指针控件，0%~100%对应了起始角度~终止角度范围。

手表端指针控件支持的数据类型定义：

2023年12月11日发(作者：隋淑华)

华为运动表GT2表盘主题制作教程

运动表 GT2

元素介绍

背景

背景元素，用来作为表盘的背景，一般使用屏幕尺寸相同大小的图片作为表盘的背景，是表盘不可或缺的元素。

时间

时间元素，一般把表盘上的时、分、秒等信息放到时间元素中。时间元素也是表盘不可或缺的元素。

日期

日期元素，一般把月、日、星期等信息放到日期元素中，月、日、星期可以放到不同的layer中。

控件

控件，一般除了时间和日期，把其他的信息放到控件元素中，比如步数、天气等信息。

自定义

当时间、日期、背景元素的属性栏的“自定义属性”勾选上“支持自定义”，或者当控件元素右键添加，选择自定义时，元素均支持添加自定义。如果支持自定义时，一个元素可以包含若干个自定义可选，不支持自定义时，元素可以直接由若干个绘制单元组成。

容器

容器只存在于控件元素中，在图层管理区，控件元素右键添加，选择容器。容器属性栏支持自定义，则可以通过可选项组合来定义可选的自定义集合。

绘制单元

文本

绘制数字、文字，如数字时间、文字的月份、步数等。

属性区域操作说明：

1) 位置 X，Y，W，H：X，Y 为文本框左上角在表盘坐标系内的坐标；W为文本框的宽度，H为Y到文本 baseline 的距离（H 根据字体大小自动计算）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y，W 的值不得超出 0~DPI，如，选择 390 X 390 表盘，该属性框的值不得超出 0~390。

2) 文本：下拉框选择文本字体；颜色：颜色选择器选择文本颜色，输入框输入透明度值。

注：通过点击色块按钮弹出颜色选择器选择颜色；透明度范围为 0~255。

3) 对齐：文本对齐方式，分别为左对齐、居中对齐、右对齐。

4) 数据类型：指定文本绑定显示手表系统的哪种类型数据，注意它受限于上一层级的数据类型的限制，当上一层级的数据类型不同，对应的文本支持的数据类型也会不同的。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于文本，根据不同数据类型，可以输入不同的数据范围的数据，详见下表数据类型取值范围。

手表端文本控件支持的数据类型定义：

连接文本

连接文本控件用于根据绑定数据的实际值使用连接符连接显示两个变化的文字。

属性区域操作说明：

1) 位置 X，Y，W，H：X，Y 为文本框左上角在表盘坐标系内的坐标；W 为文本框的宽度，H 为Y 到文本 baseline 的距离（H 根据字体大小自动计算）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y，W 的值不得超出 0~DPI，如，选择 390 X 390 表盘，该属性框的值不得超出 0~390。

2) 文本：下拉框选择文本字体；颜色：颜色选择器选择文本颜色，输入框输入透明度值。

注：通过点击色块按钮弹出颜色选择器选择颜色；透明度范围为 0~255。

3) 对齐：文本对齐方式，分别为左对齐、居中对齐、右对齐。

4) 数据类型：分别指定连接文本的两个文本绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于连接文本控件，根据不同数据类型，可以输入不同的数据范围的数据，详见下表数据类型取值范围。

手表端连接文本控件支持的数据类型定义：

第二个文本还多支持无数据类型：

5) 连接符：两个文本的间隔符号。

包含如下连接符号：冒号 “:”、短线 “-”、斜线 “/”、反斜线 “”、点 “.”、百分号 “%”、空格 “ ”

单图

单图用于绘制一张静态图，如静态背景图、步数图标等。

属性区域操作说明：

1) 图片路径：点击 + 号图标选择图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

2) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

选图

用于根据绑定数据的实际值显示不同的图片，通常用作天气、星期、日期等的显示。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 数据类型：指定选图控件绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于选图控件，根据不同数据类型，可以选择不同的数据，对应显示不同的图。

手表端选图控件支持的数据类型定义：

3) 图片路径：点击图片资源管理图标选择图片。添加图片需要顺序添加。请严格根据数据类型定义中的描述和要求的图片个数和顺序来添加图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

注：当数据类型选择“上午下午”和“双时区上午，下午”时，前两张图依次为上午、下午，第三张图必须添加一张透明空白图，用于 24 小时制下不显示图片。

组合图

组合图绘制，使用 0~9 十个数字的图片组合来绘制一个数字，如步数。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 对齐方式：目前支持 3 种对齐方式，左对齐、居中对齐、右对齐。

3) 数据类型：指定选图控件绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于选图控件，根据不同数据类型，可以选择不同的数据，对应显示不同的图。

手表端组合图控件支持的数据类型定义：

4) 图片路径：点击图片资源管理图标选择图片。添加图片需要顺序添加。请严格根据数据类型定 义中的描述和要求的图片个数和顺序来添加图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

直线图

直线图，通过图片资源画直线进度条，如步数完成度。只支持从左到右的水平进度条绘制。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 数据类型：指定线形进度条绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于圆形进度条控件，0%~100%对应了起始角度~终止角度范围。

手表端线形进度条控件支持的数据类型定义：

3) 图片路径：点击 + 号图标选择直线形进度条图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。

弧形图

弧形图，通过图片资源画弧形进度条，如电量百分比、步数完成度。

属性区域操作说明：

1) 位置 X，Y：图片左上角在表盘坐标系内的坐标。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

2) 中心点坐标 X，Y：圆形进度条的圆心在图片坐标系中的坐标。

注：图片坐标系原点(0, 0)为图片的左上角。建议圆心坐标取图片的中心点，比如，图片尺寸为100 X 100，建议圆心坐标取值(50, 50)。

3) 半径及宽度 R，W：R 为该圆形进度条的半径（圆心与进度线条中线的距离）；W 为进度线条的宽度。

注：建议 R 值不要超过(图片边长-W)/2 ，建议 W 值小于 R 值。

4) 起始与终止角度：圆形进度条以圆心为中心点满格显示的角度范围。起始角度为进度条的起始点，终止角度为进度条的终止点。

注：角度值不得超出 0~360 范围。

注：起止角度差对应了绑定数据的 100%。

5) 数据类型：指定圆形进度条绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于圆形进度条控件，0%~100%对应了起始角度~终止角度范围。

手表端弧形图支持的数据类型定义：

6) 图片路径：点击 + 号图标选择圆形进度条底色纹理图片。

注：图片尺寸不得超过所选表盘 DPI 大小，如，选择 390 X 390 表盘，则图片的宽高不得大于390px。建议使用正方形图片。

指针

绘制指针，如时针、分针、秒针；再如电量百分比，也可以做指针效果。

属性区域操作说明：

1) 旋转中心绝对位置 X，Y：指针图片的旋转中心在表盘坐标系中的坐标，比如指针控件一般以表盘的中心旋转，以 390 X 390 表盘为例，该 X，Y 值为(195, 195）。

注：表盘坐标系原点(0, 0)为表盘外切正方形的左上角。X ，Y 的值不得超出 0~DPI，如，选择390 X 390 表盘，该属性框的值不得超出 0~390。

注：旋转中心点为指针图片围绕该点进行旋转。

2) 旋转中心相对位置 X，Y：指针图片的旋转中心在指针图片坐标系中的坐标，比如该示例指针图片以此图片坐标系位置(14, 280)为旋转中心进行旋转。

注：指针图片坐标系原点(0, 0)为指针图片的左上角。X ，Y 的值分别不得超出图片的宽和高，如，指针图片的尺寸为 50 X 300，则 X 的值不得超出 0~50，Y 的值不得超出

0~300。

3) 起始与终止角度：指针图片围绕旋转中心进行旋转的角度范围。当起始角度小于终止角度，以顺时针的方向进行旋转。当起始角度大于终止角度， 以逆时针的方式进行旋转。

注：角度值不得超出-360~360 范围。支持 4 位小数。

注：起止角度差对应了绑定数据的 100%。

4) 数据类型：指定该指针绑定显示手表系统的哪种类型数据。

预览数据：模拟手表数据，设计师通过调节预览数据，可以预览不同数据情况下的预览效果，对于指针控件，0%~100%对应了起始角度~终止角度范围。

手表端指针控件支持的数据类型定义：