定義使用者設定

UserConfigurations 可讓您建立選項,供使用者選擇。你可以根據所選值調整錶面元素的顯示方式。

使用者設定選項包括:

  • BooleanConfiguration:通常用於使用者可選擇是否顯示元素,或在兩種樣式之間選擇的情況
  • ListConfiguration:為使用者提供一系列選項。舉例來說,如果錶面有四種不同的背景圖片可供選擇
  • ColorConfiguration:定義顏色主題,使用者可從中選取偏好的主題。

布林值選項

布林值選項可能是最簡單的使用者設定。定義如下:

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

布林選項有兩種使用方式:

  1. 在錶面 Scene 中使用 BooleanConfiguration 結構:

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

    請注意,設定選項無法巢狀使用。

  2. 或者,您也可以在運算式中使用設定選項:

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

清單選項

清單選項的運作方式與布林選項非常相似。舉例來說,如要提供背景圖片清單供使用者選擇:

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

與布林值選項類似,您同樣可以透過兩種方式使用這項功能:

  1. Scene 中使用 ListConfiguration 元素:

    <!-- 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. 或者,您也可以在更複雜的運算式中使用設定選項:

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

顏色主題

你可以透過錶面格式的 ColorConfiguration 定義色彩主題。 使用者可以從錶面編輯器中選取所需主題,而這個主題的顏色會顯示在整個錶面定義中。

舉例來說,如要定義包含兩個項目和三種顏色的主題,請定義 ColorConfiguration,如下所示:

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

這些值隨後可用做資料來源,取代十六進位顏色值。請注意,索引值的指定方式會選取主題的第一個、第二個或第三個元素:

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

在每個 ColorOption 只定義一個顏色的情況下,也可以將其參照為 CONFIGURATION.myThemeColor,不含索引。使用者接著可以在錶面編輯器中選取所需的主題項目。

口味

注意:錶面格式 2 以上版本支援變體。

UserConfigurations 可為使用者提供許多彈性,但隨著您定義的設定元素數量增加,組合數量可能會大幅成長。

Flavors 可讓您為 UserConfigurations 定義預設值,以醒目顯示您認為值得強調的內容。

使用者可以在隨附應用程式中選取這些預設變種版本, 或繼續個別選擇每個設定值。

舉例來說,假設您定義了三個設定的錶面:

  1. 色彩主題設定,可讓使用者選取要套用的色彩主題。您已定義兩個主題,一個是彩色,另一個是單色。
  2. 背景清單。您已定義使用者可選取的兩個選項。
  3. 選擇是否要在錶面上顯示使用者心率。

此外,錶面上還會顯示 ComplicationSlot

您決定要向使用者強調兩個 Flavors。 這些設定還有許多可能的組合,但您認為以下組合最適合:

  1. 運動風格:包括:
    1. 亮色主題,讓你充滿活力,積極行動 (ID:0)
    2. 第一個背景圖片 (ID:0)
    3. 錶面顯示心率,方便你參考
    4. 顯示步數的小工具版位
  2. 精緻風味:包括:
    1. 單色色彩主題,可搭配任何服裝 (ID:1)
    2. 第二張背景圖片 (ID:1)
    3. 錶面未顯示心率
    4. 未啟用小工具位置

風味需要在 watch_face_info.xml 中啟用,因此 watch_face_info.xml 檔案中的 FlavorsSupported 元素應設為 value="true"

每個風味都會在 UserConfigurations 中定義,如下所示:

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