Nutzerkonfigurationen definieren

Mit UserConfigurations können Sie Optionen erstellen, zwischen denen der Nutzer wählen kann. Sie können die Darstellung von Zifferblattelementen basierend auf den ausgewählten Werten anpassen.

Die Optionen für die Nutzerkonfiguration können sein:

  • BooleanConfiguration: Wird in der Regel verwendet, wenn der Nutzer die Möglichkeit hat, ein Element ein- oder auszublenden oder zwischen zwei Stilen zu wählen.
  • ListConfiguration: bietet dem Nutzer eine Reihe von Optionen. Wenn das Zifferblatt beispielsweise vier verschiedene Hintergrundbilder zur Auswahl hat,
  • ColorConfiguration: Definiert Farbdesigns, aus denen der Nutzer sein bevorzugtes Design auswählen kann.

Boolesche Optionen

Boolesche Optionen sind vielleicht die einfachsten Nutzerkonfigurationen. Sie können so definiert werden:

<!-- Under WatchFace element -->
<UserConfigurations>
    <!-- show_date and show_date_label defined in res/values/strings.xml -->
    <BooleanConfiguration id="show_date"
        displayName="show_date_label"
        screenReaderText="show_date_label"
        defaultValue="TRUE"
        />
</UserConfigurations>

Boolesche Optionen können auf zwei Arten verwendet werden:

  1. Verwenden Sie die BooleanConfiguration-Struktur im Zifferblatt Scene:

    <!-- Within the main Scene of the watch face -->
    <BooleanConfiguration id="show_date">
        <BooleanOption id="TRUE">
            <!-- ...Content when date required -->
        </BooleanOption>
        <BooleanOption id="FALSE">
            <!-- ...Content when date not required -->
        </BooleanOption>
    </BooleanConfiguration>

    Konfigurationsoptionen können nicht geschachtelt werden.

  2. Alternativ kann die Konfigurationsoption in Ausdrücken verwendet werden:

        <Expressions>
            <Expression name="my_expression">
                <!-- Use show_date as part of a more complex evaluation -->
                <![CDATA[[CONFIGURATION.show_date] == "TRUE" && [HOUR_0_23] < 15]]
            </Expression>
        </Expressions>
        <Compare expression="my_expression">
            <!-- Content goes here -->
        </Compare>
    </Condition>

Listenformate

Listenoptionen funktionieren sehr ähnlich wie boolesche Optionen. So können Sie dem Nutzer beispielsweise eine Liste mit Hintergrundbildern zur Auswahl präsentieren:

<!-- Under WatchFace element -->
<UserConfigurations>
    <ListConfiguration id="background_image" displayName="background_image_label"
        icon="background_option_icon"
        screenReaderText="background_image_label" defaultValue="0">
        <ListOption id="0" displayName="background0_image_label"
            screenReaderText="background0_image_label" icon="background0_icon" />
        <ListOption id="1" displayName="background1_image_label"
            screenReaderText="background1_image_label" icon="background1_icon" />
        ...
    </ListConfiguration>
</UserConfigurations>

Ähnlich wie bei booleschen Optionen gibt es auch hier zwei Möglichkeiten:

  1. ListConfiguration-Element in Scene verwenden:

    <!-- Within the main Scene of the watch face -->
    <ListConfiguration id="background_image">
        <ListOption id="0">
            <!-- ...Content for option 0 -->
        </ListOption>
        <ListOption id="1">
            <!-- ...Content for option 1 -->
        </ListOption>
    </ListConfiguration>

  2. Alternativ kann die Konfigurationsoption in komplexeren Ausdrücken verwendet werden:

        <Expressions>
            <Expression name="background_zero_and_something_else">
                <!-- Use as part of a more complex evaluation -->
                <![CDATA[[CONFIGURATION.background_image] == "0" && [HOUR_0_23] < 15]]
            </Expression>
        </Expressions>
        <Compare expression="background_zero_and_something_else">
            <!-- Content goes here -->
        </Compare>
    </Condition>

Farbformate

Mit dem Watch Face-Format können Sie Farbdesigns über ColorConfiguration definieren. Nutzer können im Zifferblatt-Editor ein Design ihrer Wahl auswählen. Die Farben dieses Designs können in der gesamten Zifferblattdefinition verwendet werden.

Wenn Sie beispielsweise ein Design mit zwei Einträgen und drei Farben definieren möchten, definieren Sie ColorConfiguration so:

<!-- Under WatchFace element -->
<UserConfigurations>
    <ColorConfiguration id="myThemeColor" displayName="theme_label" defaultValue="0">
        <ColorOption id="0" displayName="relaxed_label" colors="#3083dc #f8ffe5 #7dde92" />
        <ColorOption id="1" displayName="urban_label" colors="#f4b393 #fc60a8 #7a28cb" />
    </ColorConfiguration>
</UserConfigurations>

Diese können dann anstelle von hexadezimalen Farbwerten als Datenquellen verwendet werden. Beachten Sie, wie der Indexwert angegeben wird, um das erste, zweite oder dritte Element des Designs auszuwählen:

<AnalogClock x="0" y="0" width="450" height="450">
    <HourHand resource="hour" x="220" y="55" width="20" height="190"
        pivotX="0.5" pivotY="0.9210"
        tintColor="[CONFIGURATION.myThemeColor.0]"/>
    <MinuteHand resource="minute" x="222" y="30" width="16" height="220"
        pivotX="0.5" pivotY="0.9"
        tintColor="[CONFIGURATION.myThemeColor.1]"/>
    <SecondHand resource="second" x="226" y="20" width="8" height="245"
        pivotX="0.5" pivotY="0.8571"
        tintColor="[CONFIGURATION.myThemeColor.2]"/>
</AnalogClock>

Im Sonderfall, in dem für jedes ColorOption nur eine Farbe definiert ist, kann es auch als CONFIGURATION.myThemeColor ohne Index referenziert werden. Der Nutzer kann dann im Zifferblatt-Editor den gewünschten Theme-Eintrag auswählen.

Geschmacksrichtungen

Hinweis: Varianten werden ab Version 2 des Zifferblattformats unterstützt.

UserConfigurations bieten dem Nutzer viel Flexibilität. Wenn Sie jedoch die Anzahl der Konfigurationselemente erhöhen, die Sie definieren, kann die Anzahl der Kombinationen enorm ansteigen.

Mit Flavors können Sie Voreinstellungen für die UserConfigurations definieren, die Sie hervorheben möchten.

Der Nutzer kann dann in der Companion-App aus diesen voreingestellten Varianten auswählen oder weiterhin jeden Konfigurationswert einzeln festlegen.

Angenommen, Sie definieren für ein Zifferblatt drei Einstellungen:

  1. Eine Konfiguration für das Farbschema, mit der der Nutzer auswählen kann, welches Farbschema angewendet werden soll. Sie haben zwei Designs definiert, eines mit vielen Farben und eines in Schwarzweiß.
  2. Eine Liste mit Hintergründen. Sie haben zwei Optionen definiert, aus denen der Nutzer auswählen kann.
  3. Der Nutzer kann auswählen, ob seine Herzfrequenz auf dem Zifferblatt angezeigt werden soll.

Außerdem wird auf dem Zifferblatt ein ComplicationSlot angezeigt.

Sie entscheiden sich, zwei Flavors hervorzuheben. Es gibt viele weitere mögliche Kombinationen dieser Einstellungen, aber diese sind die, die Sie für am besten halten:

  1. Sportliche Variante: Diese besteht aus:
    1. Das helle Farbdesign, um dich zu motivieren und aktiv zu werden (ID: 0)
    2. Das erste Hintergrundbild (ID: 0)
    3. Die Herzfrequenz wird auf dem Zifferblatt zur Referenz angezeigt.
    4. Der Bereich für eine Zusatzfunktion, in dem die Schrittzahl angezeigt wird
  2. Ein anspruchsvoller Geschmack: Das umfasst Folgendes:
    1. Das monochrome Farbdesign, passend zu jedem Outfit (ID: 1)
    2. Das zweite Hintergrundbild (ID: 1)
    3. Auf dem Zifferblatt wird keine Herzfrequenz angezeigt
    4. Der Zusatzfunktions-Slot ist nicht aktiviert

Flavors müssen in watch_face_info.xml aktiviert werden. Das Element FlavorsSupported in der Datei watch_face_info.xml sollte also auf value="true" gesetzt werden.

Jede Variante wird in UserConfigurations so definiert:

<!-- Under UserConfigurations -->
<Flavors defaultValue="sporty_flavor">
    <Flavor id="sporty_flavor"
        displayName="flavor_sporty_label" screenReaderText="flavor_sporty_label">
        <Configuration id="theme_color" optionId="0"/>
        <Configuration id="background_image" optionId="0"/>
        <Configuration id="show_hr" optionId="TRUE"/>
        <ComplicationSlot slotId="0">
            <DefaultProviderPolicy
                defaultSystemProvider="STEP_COUNT"
                defaultSystemProviderType="SHORT_TEXT"/>
        </ComplicationSlot>
    </Flavor>
    <Flavor id="sophisticated_flavor"
        displayName="flavor_sophisticated_label" screenReaderText="flavor_sophisticated_label">
        <Configuration id="theme_color" optionId="1"/>
        <Configuration id="background_image" optionId="1"/>
        <Configuration id="show_hr" optionId="FALSE"/>
        <ComplicationSlot slotId="0">
            <!--
              Type here is set to empty to demonstrate how to hide a complication
              slot in Flavors.
            -->
            <DefaultProviderPolicy
                defaultSystemProvider="SUNRISE_SUNSET"
                defaultSystemProviderType="EMPTY"/>
        </ComplicationSlot>
    </Flavor>
</Flavors>