Menggunakan teks

Untuk jam digital, Anda harus menggunakan DigitalClock jika memungkinkan. Untuk semua teks atau jam lain yang tidak dapat direpresentasikan menggunakan DigitalClock, PartText adalah penampung untuk rendering berbasis teks.

Bergantung pada apakah Anda ingin menampilkan teks melingkar atau biasa, PartText harus berisi salah satu elemen Text atau TextCircular.

Menggunakan font dan font bitmap

Menggunakan font kustom memungkinkan tampilan jam Anda tampil beda dengan gayanya sendiri.

Ada dua cara untuk menggunakan font kustom, baik dalam penampung TimeText maupun PartText.

  1. Tentukan font kustom family di elemen Font. Rentang format umum didukung, yang harus ditempatkan di res/font

    Misalnya, menggunakan font Pacifico dari Google Fonts, dan menempatkan aset sebagai 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. Atau, tentukan BitmapFont yang menyediakan gambar bitmap di 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>
<!-- ... -->

Perhatikan bagaimana urutan karakter dapat diberi perlakuan khusus. Misalnya, jika "12" akan direpresentasikan dengan 1 dan 2 yang digabungkan, hal ini dapat dilakukan menggunakan elemen Word.

Untuk menggunakan font yang ditentukan:

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

Efek teks

Format Tampilan Jam menyediakan beberapa efek teks yang dapat diterapkan, seperti OutGlow dan Shadow. Untuk menggunakannya, terapkan sebagai subelemen elemen Font:

<Font family="pacifico" size="96" color="#e2a0ff">
  <OutGlow color="#e8ffb7" radius="30">Hello!</OutGlow>
</Font>

Menggunakan template

Daripada teks statis, Anda mungkin perlu membuat teks dari sumber data atau ekspresi.

Elemen Template memungkinkan Anda melakukan hal berikut:

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

Menggunakan resource

Jika teks statis Anda ditentukan dalam resource, seperti dalam res/values/strings.xml, teks tersebut dapat direferensikan sebagai berikut:

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

Hal ini juga memungkinkan Anda melokalkan tampilan jam menggunakan penentu resource yang berbeda.

Menangani spasi

Mungkin ada beberapa tantangan saat menggunakan spasi dan teks:

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

Hal ini karena spasi penting dalam XML. Untuk menghindari situasi ini, gabungkan konten Font dalam elemen CDATA:

<!-- Works correctly -->
<Font family="pacifico" size="60" weight="BOLD" color="#ffffff">
  <![CDATA[greeting]]>
</Font>

Contoh lain dapat dilihat saat mencoba meratakan teks di tengah:

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

Teks multibaris

Untuk membuat teks multibaris, gunakan atribut maxLines di 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>