Thay đổi linh động giao diện của phần tử

Bạn có thể muốn thay đổi giao diện của các phần trên mặt đồng hồ, chẳng hạn như thay đổi vị trí, kích thước, khả năng hiển thị, thường là để phản hồi các nguồn dữ liệu đầu vào như thời gian trong ngày hoặc gia tốc kế.

Trong Định dạng mặt đồng hồ, điều này được thực hiện thông qua việc sử dụng phần tử Transform. Không phải tất cả các phần tử đều có thể được biến đổi, nhưng các phần tử có thể biến đổi chính bao gồm: các phần tử Group, Part* và các thành phần vẽ cơ bản như hình dạng và kiểu.

Các thuộc tính của từng phần tử có thể biến đổi sẽ được đánh dấu như vậy trong tài liệu tham khảo.

Chính phép biến đổi được chỉ định trong thuộc tính value, trong ngôn ngữ biểu thức Định dạng mặt đồng hồ, có thể bao gồm các nguồn dữ liệu. target chỉ định thuộc tính sẽ được thay đổi trong phần tử mẹ.

Ví dụ: để thay đổi góc của Arc nhằm phản ánh tiến trình của bước:

<Arc centerX="225" centerY="225" height="420" width="420" startAngle="0" endAngle="0">
    <Transform target="endAngle" value="[STEP_PERCENT] * 3.6" />
    <Stroke color="#FF00FF" thickness="20" />
</Arc>
watchface_dynamic_appearance.xml

Khi STEP_PERCENT thay đổi, endAngle sẽ được tính toán lại và Arc được vẽ lại.

Khi một phần tử Biến đổi thay đổi giá trị mục tiêu, bạn có thể muốn thay đổi này được tạo ảnh động trong một khoảng thời gian, thay vì thay đổi giá trị ngay lập tức, điều này có thể gây khó chịu. Sử dụng phần tử Animation để đạt được điều này:

<PartDraw x="100" y="150" width="250" height="120" >
    <Ellipse x="0" y="0" width="50" height="50">
        <Fill color="#ff0000" />
        <!-- Red ball with no animated transition -->
        <Transform target="x" value="[SECOND] % 2 == 0 ? 0 : 200"/>
    </Ellipse>
    <Ellipse x="0" y="100" width="50" height="50">
        <Fill color="#00ff00" />
        <!-- Green ball eases between each position -->
        <Transform target="x" value="[SECOND] % 2 == 0 ? 0 : 200">
            <Animation duration="1" interpolation="EASE_IN_OUT" />
        </Transform>
    </Ellipse>
</PartDraw>
watchface_dynamic_appearance.xml

Biến đổi bằng cách dùng gia tốc kế

Mặc dù bạn có thể dùng phần tử Transform với các nguồn dữ liệu con quay hồi chuyển như ACCELEROMETER_ANGLE_X để thay đổi vị trí hoặc tỷ lệ của một phần tử, nhưng Định dạng mặt đồng hồ cung cấp một phần tử riêng cho các nguồn dữ liệu này: Gyro.

Điều này giúp bạn đơn giản hoá bức tranh tổng thể, tách phép biến đổi dựa trên chuyển động khỏi phép biến đổi khác, chẳng hạn như phép biến đổi dựa trên thời gian, có thể được áp dụng cho cùng một phần tử.