Xác định cấu hình người dùng

UserConfigurations cho phép bạn tạo các lựa chọn mà người dùng có thể chọn. Bạn có thể điều chỉnh giao diện của các phần tử trên mặt đồng hồ dựa trên các giá trị đã chọn.

Các lựa chọn cấu hình người dùng có thể là:

  • BooleanConfiguration: thường được dùng cho trường hợp người dùng có thể có lựa chọn hiện hoặc không hiện một phần tử, hoặc chọn giữa hai kiểu
  • ListConfiguration: cung cấp cho người dùng nhiều lựa chọn. Ví dụ: nếu mặt đồng hồ có 4 hình nền khác nhau để chọn
  • ColorConfiguration: xác định các giao diện màu, trong đó người dùng có thể chọn giao diện mà họ muốn.

Các lựa chọn boolean

Các lựa chọn Boolean có lẽ là đơn giản nhất trong số các cấu hình người dùng. Bạn có thể xác định các loại này như sau:

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

Sau đó, bạn có thể sử dụng các lựa chọn Boolean theo hai cách:

  1. Sử dụng cấu trúc BooleanConfiguration trong Scene mặt đồng hồ:

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

    Xin lưu ý rằng bạn không thể lồng các lựa chọn cấu hình khi sử dụng.

  2. Ngoài ra, bạn có thể dùng lựa chọn cấu hình trong biểu thức:

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

Tùy chọn danh sách

Các lựa chọn trong danh sách hoạt động theo cách rất giống với các lựa chọn boolean. Ví dụ: để cung cấp danh sách hình nền cho người dùng lựa chọn:

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

Tương tự như các lựa chọn boolean, bạn có thể sử dụng theo hai cách:

  1. Sử dụng phần tử ListConfiguration trong Scene:

    <!-- 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. Ngoài ra, bạn có thể dùng lựa chọn cấu hình này trong các biểu thức phức tạp hơn:

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

Cách phối Màu

Định dạng mặt đồng hồ cho phép bạn xác định các chủ đề màu sắc thông qua ColorConfiguration. Người dùng có thể chọn chủ đề họ muốn trong trình chỉnh sửa mặt đồng hồ và màu sắc của chủ đề này có thể xuất hiện trong toàn bộ định nghĩa mặt đồng hồ.

Ví dụ: để xác định một giao diện có 2 mục và 3 màu trong giao diện, hãy xác định một ColorConfiguration như sau:

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

Sau đó, bạn có thể sử dụng các giá trị này làm nguồn dữ liệu thay vì giá trị màu thập lục phân. Lưu ý cách chỉ định giá trị chỉ mục để chọn phần tử thứ nhất, thứ hai hoặc thứ ba của chủ đề:

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

Trong trường hợp cụ thể mà mỗi ColorOption chỉ có một màu được xác định, bạn cũng có thể tham chiếu màu đó dưới dạng CONFIGURATION.myThemeColor mà không cần chỉ mục. Sau đó, người dùng có thể chọn mục chủ đề mà họ muốn trong trình chỉnh sửa mặt đồng hồ.

Hương vị

Lưu ý: Các biến thể được hỗ trợ trên phiên bản 2 trở lên của Định dạng mặt đồng hồ.

UserConfigurations mang đến cho người dùng nhiều sự linh hoạt, nhưng khi bạn tăng số lượng phần tử cấu hình mà bạn xác định, số lượng tổ hợp có thể tăng lên đáng kể.

Flavors cho phép bạn xác định các chế độ đặt sẵn cho UserConfigurations mà bạn cho là đáng chú ý.

Sau đó, người dùng có thể chọn trong số các phiên bản đặt sẵn này trong ứng dụng đồng hành hoặc tiếp tục chọn từng giá trị cấu hình riêng lẻ.

Ví dụ: hãy xem xét một mặt đồng hồ mà bạn xác định 3 chế độ cài đặt:

  1. Cấu hình giao diện màu, cho phép người dùng chọn giao diện màu để áp dụng. Bạn đã xác định hai giao diện, một giao diện nhiều màu và một giao diện đơn sắc.
  2. Danh sách các phông nền. Bạn đã xác định 2 lựa chọn mà người dùng có thể chọn.
  3. Lựa chọn có hiển thị nhịp tim của người dùng trên mặt đồng hồ hay không.

Ngoài ra, bạn có một ComplicationSlot trên mặt đồng hồ.

Bạn quyết định rằng có 2 Flavors mà bạn muốn làm nổi bật cho người dùng. Có nhiều tổ hợp khác có thể có của tất cả các chế độ cài đặt này, nhưng đây là những tổ hợp mà bạn cho là phù hợp nhất:

  1. Hương vị thể thao: Gói này sẽ bao gồm:
    1. Chủ đề màu sáng, giúp bạn tràn đầy năng lượng và hoạt động tích cực (Mã nhận dạng: 0)
    2. Hình nền đầu tiên (mã nhận dạng: 0)
    3. Nhịp tim hiển thị trên mặt đồng hồ để tham khảo
    4. Khu vực hiển thị chức năng cho biết số bước
  2. Hương vị tinh tế: Hương vị này sẽ bao gồm:
    1. Chủ đề màu đơn sắc, phù hợp với mọi trang phục (Mã nhận dạng: 1)
    2. Hình nền thứ hai (mã nhận dạng: 1)
    3. Không có nhịp tim nào xuất hiện trên mặt đồng hồ
    4. Chưa bật vị trí cho chức năng

Các phiên bản cần được bật trong watch_face_info.xml, vì vậy, phần tử FlavorsSupported trong tệp watch_face_info.xml phải được đặt thành value="true".

Mỗi Phiên bản được xác định trong UserConfigurations như sau:

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