Udostępnianie przydatnych danych za pomocą widżetów

Widżety to funkcja tarcz zegarków tradycyjnych i smartwatchów, która wyświetla dodatkowe informacje. Zwykle użytkownik wybiera, jakie informacje mają być wyświetlane w komplikacji.

Widżety mają zwykle kilka kształtów:

  1. Prostokątny
  2. Okrągły
  3. Łuki wzdłuż krawędzi tarczy zegarka
  4. Tło zajmujące całą tarczę zegarka

W Wear OS system komplikacji można podzielić na 2 części:

  1. Źródło danych widżetu
  2. Renderowanie widżetu

Na przykład aplikacja do dbania o zdrowie i kondycję może wdrożyć źródło danych komplikacji Dziennej liczby kroków. Może to być renderowane przez tarczę zegarka WFF.

Źródła danych w komplikacjach

Źródła danych widżetów określają tylko dane do renderowania i typ widżetu. Źródło danych nie ma wpływu na sposób wyświetlania danych na tarczy zegarka.

Na przykład źródło danych komplikacji Dzienny pomiar kroków dotyczących zdrowia i aktywności fizycznej może generować te dane, aby wskazać, że użytkownik wykonał dziś 2400 z 10 000 kroków:

Zwróć uwagę, że w tych danych nie ma nic, co wskazywałoby, jak należy je renderować.

Tarcza zegarka określa, jakie typy widżetów może renderować. Określa to, które źródła danych są dostępne dla użytkownika.

W przypadku przykładu z dzienną liczbą kroków w definicji tarczy zegarka określasz, jak renderować symbole ValueTargetValue: jako tekst czy jako wskaźnik postępu. To zależy od Ciebie jako projektanta tarczy zegarka.

Definiowanie widżetów

Możliwość wyświetlania widżetów na tarczy zegarka może być przydatna dla użytkowników, ponieważ pozwala im szybko uzyskać dostęp do większej ilości informacji dostosowanych do ich potrzeb.

Zdecyduj, czy i ile komplikacji ma być obsługiwanych na tarczy zegarka, jakie będą ich kształty i położenie oraz jakie typy danych będą obsługiwane.

Każde miejsce na tarczy zegarka, w którym może pojawić się widżet, jest zdefiniowane jako ComplicationSlot, w którym określony jest obszar ograniczający renderowanie widżetu:

<ComplicationSlot slotId="1" supportedTypes="SHORT_TEXT SMALL_IMAGE EMPTY"
    x="100" y="100" width="100" height="100">
    <BoundingOval x="0"  y="0" width="100" height="100" />
    <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>

Podobne podejście można zastosować do innych kształtów ograniczających, takich jak prostokąt i elipsa.

Ustaw typ widżetu i wartości domyślne

System widżetów udostępnia wiele różnych typów, które pozwalają tarczy zegarka określić, jakie dane może wyświetlać na ekranie. Na przykład komplikacja Arc, jak pokazano wcześniej, nie pasuje do typu danych komplikacji opartego na obrazach, takiego jak SMALL_IMAGE, ale może dobrze działać w przypadku danych liczbowych, takich jak RANGED_VALUE.

W deklaracji ComplicationSlot ustaw supportedTypes na listę typów rozdzielonych spacjami, które mogą być renderowane w tym boksie.

Musisz też ustawić domyślne źródło dla ComplicationSlot, chyba że zezwolisz na typ EMPTY. W takim przypadku ustawienie domyślnego źródła jest opcjonalne:

<ComplicationSlot slotId="2" supportedTypes="SHORT_TEXT SMALL_IMAGE EMPTY"
    x="250" y="100" width="100" height="100">
    <DefaultProviderPolicy
        defaultSystemProvider="STEP_COUNT"
        defaultSystemProviderType="SHORT_TEXT" />
    <!-- ... -->
</ComplicationSlot>

Oprócz określania dostawców systemowych możesz opcjonalnie określić dostawców spoza systemu, np. dostawców zewnętrznych, którzy mają być używani domyślnie, jeśli są już zainstalowani.

Renderowanie danych widżetu

Po zdefiniowaniu ComplicationSlot, granic i zawierającego elementu Complication użyj standardowych komponentów WFF, takich jak PartDraw, PartImagePartText, aby wyświetlić dane komplikacji.

Elementy w Complication mają dostęp do specjalnego źródła danych:COMPLICATION, które udostępnia różne właściwości danych ustawione przez źródło danych komplikacji.

Na przykład widżet SMALL_IMAGE może ustawić wartości COMPLICATION.SMALL_IMAGECOMPLICATION.SMALL_IMAGE_AMBIENT. Zamiast zasobu w elemencie Image możesz użyć tych elementów:

<Complication type="SMALL_IMAGE">
    <PartImage x="0" y="0" width="100" height="100">
        <Image resource="[COMPLICATION.SMALL_IMAGE]" />
    </PartImage>
</Complication>

Każdy typ komplikacji ma inny zestaw dostępnych właściwości, które można ustawić. Pełną listę znajdziesz w dokumentacji Complication. Ten przykład wyświetla tekst z SHORT_TEXT komplikacji:

<Complication type="SHORT_TEXT">
    <PartText x="0" y="0" width="100" height="100">
        <Text>
            <Font size="32">
                <Template>
                    <![CDATA[%s]]><Parameter expression="[COMPLICATION.TEXT]" />
                </Template>
            </Font>
        </Text>
    </PartText>
</Complication>

Maksymalizowanie przydatności podczas renderowania komplikacji

Dodawanie ComplicationSlots do tarczy zegarka wiąże się z kilkoma wyzwaniami:

  1. Istnieje wiele typów danych komplikacji. Różne aplikacje mogą udostępniać jedną lub wiele z tych funkcji.
  2. Każdy typ danych widżetu oprócz właściwości obowiązkowych ma też wiele właściwości opcjonalnych. Sprawdź, czy najbardziej przydatna wersja jest tworzona na podstawie dostępnych właściwości, z uwzględnieniem różnych kombinacji.

Aby rozwiązać te problemy, możesz zastosować te strategie:

  1. Obsługa wielu typów komplikacji w przypadku każdego slotu. Na przykład typ SHORT_TEXT jest dość powszechnie obsługiwany przez źródła danych widżetów, więc obsługa wielu różnych typów, takich jak SHORT_TEXT RANGED_VALUE w przypadku małego okrągłego widżetu, zwiększa kompatybilność.
  2. oferować różne typy komplikacji na tarczy zegarka; Możesz na przykład obsługiwać symbole RANGED_VALUEGOAL_PROGRESS w przypadku widżetów łukowych umieszczonych na krawędziach oraz symbole SHORT_TEXTSMALL_IMAGE w przypadku widżetów okrągłych umieszczonych w głównej części tarczy zegarka.
  3. Sprawdź, czy w przypadku każdego typu danych występują elementy opcjonalne. Na przykład SHORT_TEXT opcjonalnie obsługuje właściwość tytułu i obraz. Układ renderowania dostępnych danych może się różnić w zależności od tego, czy obraz lub tytuł są dostępne.