Работа с текстом

Для цифровых часов следует стремиться использовать DigitalClock , где это возможно. Для всех других текстов или часов, которые не могут быть представлены с помощью DigitalClock , PartText является контейнером для текстовой визуализации.

В зависимости от того , хотите ли вы отобразить круговой или обычный текст, PartText должен содержать элемент Text или TextCircular .

Работа со шрифтами и растровыми шрифтами

Использование пользовательских шрифтов позволит придать циферблату ваших часов собственный стиль.

Существует два способа использования пользовательских шрифтов: в контейнерах TimeText и PartText .

  1. Укажите пользовательское family шрифтов в элементе Font . Поддерживается ряд распространенных форматов , которые должны быть помещены в res/font

    Например, используем шрифт Pacifico из Google Fonts и размещаем ресурс как 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>
    
  2. В качестве альтернативы можно определить BitmapFont , предоставляющий растровые изображения в res/drawable :

    <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>
    <!-- ... -->
    

Обратите внимание, как последовательности символов могут быть обработаны по-особому. Например, если "12" должно быть представлено объединенными 1 и 2, это можно сделать с помощью элемента Word .

Чтобы использовать определенный шрифт:

<TimeText ... format="hh:mm">
  <BitmapFont family="myhandwriting" size="48" color="#ff0000" />
</TimeText>

Текстовые эффекты

Формат циферблата часов предоставляет несколько текстовых эффектов, которые можно применить, например 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>

Многострочный текст

Чтобы создать многострочный текст, используйте атрибут maxLines для Text :

<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>