要素の外観を動的に変更する

ウォッチフェイスの一部（位置、サイズ、表示設定など）の外観を変更することがあります。多くの場合、時刻や加速度計などの入力データソースに応じて変更します。

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 が再描画されます。

Transform 要素がターゲット値を変更する場合、値がすぐに変更されるとぎこちなくなる可能性があるため、この変更を一定期間にわたってアニメーション化することが望ましい場合があります。この目的を達成するには、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 などのジャイロスコープ データソースを使用して要素の位置やスケールを変更することもできますが、Watch Face Format では、これらのための別の要素 Gyro が用意されています。

これにより、全体像を簡素化し、移動ベースの変換を、同じ要素に適用される可能性のある時間ベースなどの他の変換から分離できます。