Memberikan data yang berguna melalui detail

Detail adalah fitur tampilan jam fisik dan smartwatch yang menampilkan informasi tambahan. Biasanya, pengguna memilih informasi yang ditampilkan dalam detail.

Biasanya detail memiliki sejumlah bentuk:

  1. Persegi panjang
  2. Melingkar
  3. Busur, di sepanjang tepi tampilan jam
  4. Latar belakang, yang menutupi seluruh tampilan jam

Di Wear OS, sistem Detail dapat dibagi menjadi dua bagian:

  1. Sumber data Detail
  2. Rendering Detail

Misalnya, aplikasi kesehatan dan kebugaran dapat menerapkan sumber data detail Langkah Harian. Ini dapat dirender oleh tampilan jam WFF.

Sumber data dalam detail

Sumber data detail hanya menentukan data yang akan dirender, dan jenis detail. Sumber data tidak berperan dalam menentukan cara data ditampilkan di tampilan jam.

Misalnya, sumber data detail Langkah Harian kesehatan dan kebugaran dapat menghasilkan data berikut untuk menunjukkan bahwa pengguna telah berjalan 2.400 dari target 10.000 langkah mereka hari ini:

Perhatikan bahwa tidak ada dalam data ini yang menunjukkan cara data ini dirender.

Tampilan jam menentukan jenis detail yang dapat dirender. Hal ini menentukan sumber data mana yang kemudian tersedia bagi pengguna untuk memilihnya.

Dalam contoh Langkah Harian, Anda memutuskan dalam definisi tampilan jam cara merender Value dan TargetValue: apakah sebagai teks, atau sebagai indikator progres? Anda sebagai desainer tampilan jam yang memutuskan.

Menentukan detail

Menawarkan kemampuan untuk menampilkan detail di tampilan jam dapat bermanfaat bagi pengguna, karena memungkinkan mereka memiliki rentang informasi yang lebih luas secara sekilas dan disesuaikan dengan kebutuhan mereka.

Tentukan apakah dan berapa banyak detail yang akan didukung di tampilan jam, bentuk dan posisinya, serta jenis data yang didukung.

Setiap ruang pada tampilan jam untuk detail ditentukan sebagai ComplicationSlot yang berisi area pembatas untuk rendering detail:

<ComplicationSlot slotId="1" supportedTypes="SHORT_TEXT SMALL_IMAGE EMPTY"
    x="0" y="0" width="225" height="225">
    <BoundingArc centerX="225" centerY="225" width="450" height="450"
        startAngle="270" endAngle="360" thickness="50" />
  <Complication type="SHORT_TEXT">
      <!-- Complication content for rendering SHORT_TEXT data goes here -->
  </Complication>
  <Complication type="SMALL_IMAGE">
      <!-- Complication content for rendering SMALL_IMAGE data goes here -->
  </Complication>
</ComplicationSlot>

Pendekatan serupa dapat diterapkan ke bentuk pembatas lainnya seperti persegi panjang dan elips.

Menetapkan jenis detail dan default

Sistem detail menyediakan sejumlah jenis yang berbeda, yang memungkinkan tampilan jam mengekspresikan jenis data yang dapat direpresentasikan di layar. Misalnya, detail Arc, seperti yang ditunjukkan sebelumnya, tidak cocok untuk jenis data detail berbasis gambar seperti SMALL_IMAGE, tetapi dapat berfungsi dengan sangat baik untuk data numerik seperti RANGED_VALUE.

Dalam deklarasi ComplicationSlot, tetapkan supportedTypes ke daftar jenis yang dipisahkan spasi yang dapat dirender di slot ini.

Anda juga harus menetapkan sumber default untuk ComplicationSlot, kecuali jika Anda mengizinkan jenis EMPTY, dalam hal ini menetapkan default bersifat opsional:

<ComplicationSlot slotId="1" ...>
    <BoundingArc .../>
    <DefaultProviderPolicy
        defaultSystemProvider="STEP_COUNT"
        defaultSystemProviderType="SHORT_TEXT" />
</ComplicationSlot>

Selain harus menentukan penyedia sistem, Anda dapat menentukan penyedia non-sistem secara opsional, seperti penyedia pihak ketiga yang akan digunakan secara default, jika sudah diinstal.

Merender data detail

Setelah menentukan ComplicationSlot, batas, dan elemen Complication yang berisi, gunakan komponen WFF standar, seperti PartDraw, PartImage dan PartText untuk menampilkan data Detail.

Elemen dalam data Complication memiliki akses ke sumber data khusus: COMPLICATION, yang menyediakan berbagai properti data yang ditetapkan oleh sumber data detail.

Misalnya, detail SMALL_IMAGE dapat menetapkan nilai COMPLICATION.SMALL_IMAGE dan COMPLICATION.SMALL_IMAGE_AMBIENT. Ini dapat digunakan sebagai pengganti resource dalam elemen Image:

<Complication type="SMALL_IMAGE">
  <PartImage ...>
    <Image resource="[COMPLICATION.SMALL_IMAGE]" />
  </PartImage>
</Complication>

Setiap jenis detail yang berbeda memiliki kumpulan properti yang tersedia yang dapat ditetapkan; untuk mengetahui daftar lengkap setiap properti, lihat referensi Complication. Contoh ini menampilkan teks dari detail SHORT_TEXT:

<Complication type="SHORT_TEXT">
  <PartText ...>
    <Text>
      <Font ...>
        <Template>
          <![CDATA[%s]]><Parameter expression="[COMPLICATION.TEXT]" />
        </Template>
      </Font>
  </PartImage>
</Complication>

Memaksimalkan kegunaan saat merender detail

Ada sejumlah tantangan saat menambahkan ComplicationSlots ke tampilan smartwatch:

  1. Ada banyak jenis data Detail. Aplikasi yang berbeda mungkin menyediakan satu atau beberapa hal ini.
  2. Setiap jenis data Detail, selain memiliki properti wajib, juga memiliki banyak properti opsional. Pastikan rendering yang paling berguna dibuat dari properti yang tersedia, dengan mempertimbangkan berbagai kombinasi.

Untuk mengatasi masalah ini, beberapa strateginya meliputi:

  1. Mendukung beberapa jenis detail untuk setiap slot. Misalnya, SHORT_TEXT cukup didukung secara luas oleh sumber data detail, sehingga mendukung sejumlah jenis yang berbeda, seperti SHORT_TEXT RANGED_VALUE untuk detail melingkar kecil, akan meningkatkan kompatibilitas.
  2. Menawarkan berbagai jenis detail di seluruh tampilan jam. Misalnya, Anda dapat mendukung RANGED_VALUE dan GOAL_PROGRESS pada detail Arc yang diposisikan di tepi, dan SHORT_TEXT dan SMALL_IMAGE pada detail melingkar di bagian isi tampilan jam.
  3. Periksa elemen opsional untuk setiap jenis data. Misalnya, SHORT_TEXT secara opsional mendukung properti judul dan gambar. Tata letak Anda untuk merender data yang tersedia mungkin berbeda, bergantung pada apakah gambar atau judul tersedia atau tidak.