เปลี่ยนลักษณะที่ปรากฏขององค์ประกอบแบบไดนามิก

คุณอาจต้องการเปลี่ยนลักษณะที่ปรากฏของส่วนต่างๆ ในหน้าปัด เช่น เปลี่ยนตำแหน่ง ขนาด ระดับการเข้าถึง ซึ่งมักจะตอบสนองต่อแหล่งข้อมูล อินพุต เช่น เวลาของวันหรือเครื่องวัดความเร่ง

ใน Watch Face Format คุณจะทำได้โดยใช้เอลิเมนต์ Transform องค์ประกอบบางอย่างไม่สามารถเปลี่ยนรูปได้ แต่องค์ประกอบหลักที่เปลี่ยนรูปได้ ได้แก่ องค์ประกอบ Group , Part* และองค์ประกอบการวาดภาพพื้นฐาน เช่น รูปร่างและ สไตล์

แอตทริบิวต์ของแต่ละองค์ประกอบที่แปลงได้จะมีการทำเครื่องหมายไว้ในเอกสารอ้างอิง

การเปลี่ยนรูปแบบเองจะระบุไว้ในแอตทริบิวต์ value ในภาษาการแสดงออกของรูปแบบหน้าปัดนาฬิกา ซึ่งอาจรวมถึงแหล่งข้อมูล target ระบุแอตทริบิวต์ที่จะเปลี่ยนแปลงในองค์ประกอบหลัก

เช่น หากต้องการเปลี่ยนมุมของ Arc เพื่อแสดงความคืบหน้าของขั้นตอน ให้ทำดังนี้

<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

เมื่อ STEP_PERCENT เปลี่ยนแปลง ระบบจะคำนวณ endAngle ใหม่และวาด Arc ใหม่

เมื่อองค์ประกอบการเปลี่ยนค่าเปลี่ยนค่าเป้าหมาย คุณอาจต้องการให้ การเปลี่ยนแปลงนี้เป็นภาพเคลื่อนไหวในช่วงระยะเวลาหนึ่ง แทนที่จะเป็นการเปลี่ยนแปลงค่าในทันที ซึ่งอาจทำให้เกิดความไม่ราบรื่น ใช้องค์ประกอบ Animation เพื่อให้ได้ผลลัพธ์ต่อไปนี้

<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

การแปลงโดยใช้ตัวตรวจวัดความเร่ง

แม้ว่าคุณจะใช้องค์ประกอบ Transform กับแหล่งข้อมูลไจโรสโคป เช่น ACCELEROMETER_ANGLE_X เพื่อเปลี่ยนตำแหน่งหรือขนาดขององค์ประกอบได้ แต่รูปแบบหน้าปัดนาฬิกามีองค์ประกอบแยกต่างหากสำหรับสิ่งเหล่านี้ นั่นคือ Gyro

ซึ่งจะช่วยให้คุณเห็นภาพรวมได้ง่ายขึ้น โดยแยกการเปลี่ยนรูปแบบตามการเคลื่อนไหว จากการเปลี่ยนรูปแบบอื่นๆ เช่น การเปลี่ยนรูปแบบตามเวลา ซึ่งอาจ ใช้กับองค์ประกอบเดียวกัน