对于数字时钟,应尽可能使用 DigitalClock
。对于所有其他无法使用 DigitalClock
表示的文本或时钟,PartText
是基于文本的渲染容器。
根据您是要显示圆形文本还是常规文本,PartText
应包含 Text 或
TextCircular
元素。
处理字体和位图字体
使用自定义字体可让您的表盘以自己的风格脱颖而出。
有两种方法可以使用自定义字体,这两种方法都可在 TimeText
和 PartText
容器中使用。
在
Font
元素中指定自定义字体family
。支持多种常用格式,必须将其放置在res/font
中例如,使用 Google Fonts 中的 Pacifico 字体,并将资源文件放置为 res/font/pacifico.ttf
<PartText x="0" y="100" width="450" height="250"> <Text align="CENTER"> <Font family="pacifico" size="96">Hello!</Font> </Text> </PartText>
此外,还可以在
res/drawable
中通过提供位图图像来定义BitmapFont
<WatchFace width="450" height="450" clipShape="CIRCLE"> <BitmapFonts> <BitmapFont name="myhandwriting"> <Character name="1" resource="digit1" width="50" height="100" /> <Character name="2" resource="digit2" width="50" height="100" /> <Character name="3" resource="digit3" width="50" height="100" /> <Character name="4" resource="digit4" width="50" height="100" /> <!-- ... --> <!-- Treat "12" specially, instead of a 1 followed by a 2--> <Word name="12" resource="digit12" width="80" height="100" /> </BitmapFont> </BitmapFonts> <!-- ... -->
请注意,字符序列可以进行特殊处理。例如,如果要使用连接的 1 和 2 来表示“12”,则可以使用 Word
元素来实现。
使用定义的字体
<TimeText ... format="hh:mm">
<BitmapFont family="myhandwriting" size="48" color="#ff0000" />
</TimeText>
文本效果
Watch Face Format 提供了多种可应用的文本效果,例如 OutGlow
和 Shadow
。要使用这些效果,请将其作为 Font
元素的子元素应用。
<Font family="pacifico" size="96" color="#e2a0ff">
<OutGlow color="#e8ffb7" radius="30">Hello!</OutGlow>
</Font>
处理模板
您可能需要从数据源或表达式构建文本,而不是使用静态文本。
Template
元素可让您实现此目的
<PartText x="100" y="150" width="300" height="120" >
<Text align="CENTER">
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
<Template>Day: %s<Parameter expression="[DAY_OF_WEEK_S]" /></Template>
</Font>
</Text>
</PartText>
处理资源
如果您的静态文本是在资源中定义的(例如在 res/values/strings.xml
中),则可以按如下方式引用
<PartText x="100" y="150" width="300" height="120" >
<Text align="CENTER">
<!-- greeting defined in res/values/strings.xml -->
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">greeting</Font>
</Text>
</PartText>
这还可让您使用不同的资源限定符将表盘本地化。
处理间距
处理间距和文本时可能会遇到一些挑战
<!-- greeting defined in res/values/strings.xml -->
<!-- Works correctly: -->
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">greeting</Font>
<!-- Does not render in the right place because of whitespace -->
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
greeting
</Font>
这是因为 XML 中的间距很重要。为避免这种情况,请将 Font
内容封装在 CDATA
元素中
<!-- Works correctly -->
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
<![CDATA[greeting]]>
</Font>
尝试居中对齐文本时,还会出现另一个示例
<!-- Does not render as expected - leading spaces are a problem -->
<PartText x="100" y="150" width="250" height="120" >
<Text align="CENTER">
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
Hello
</Font>
</Text>
</PartText>
<!-- Works correctly -->
<PartText x="100" y="150" width="250" height="120" >
<Text align="CENTER">
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
<![CDATA[Hello]]>
</Font>
</Text>
</PartText>
多行文本
要创建多行文本,请在 Text
上使用 maxLines
属性
<PartText x="75" y="100" width="300" height="350" >
<Text align="CENTER" maxLines="2">
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
<![CDATA[Hello Wear OS world]]>
</Font>
</Text>
</PartText>