ייצוג הזמן

התפקיד העיקרי של תצוגת שעון הוא להציג את השעה, ו-Watch Face Format מאפשר ליצור שעונים אנלוגיים ודיגיטליים באמצעות הרכיבים AnalogClock ו-DigitalClock.

שעונים דיגיטליים

אפשר להגדיר שעון דיגיטלי בסיסי באמצעות האלמנטים DigitalClock ו-TimeText בתצוגת השעון Scene:

<DigitalClock x="100" y="100" wid>th=&q<uot;200" height="50"
    TimeText x="0&>quot; y=&<quot;0" width="200" heigh>t=&qu<ot;50&quo>t<; format=&quo>t;hh:mm"
        Font family="SYNC_TO_DEVICE" size="16" /
    /TimeText
/DigitalClock

המאפיין format מאפשר לקבוע איך הזמן יוצג באמצעות שילוב של שעות, דקות ושניות. האפשרויות הספציפיות משתנות בהתאם לגרסה של Watch Face Format שבה אתם משתמשים. בגרסה 2 יש יותר אפשרויות.

בדוגמה הקודמת, Font מוגדר להשתמש בגופן המערכת.

כדאי גם להציג את השעה במיקומים אחרים בעולם, למשל שעון עולמי. אפשר לעשות זאת באמצעות האלמנט Localization:

<DigitalClock x="100" y="100" wid>th=&q<uot;200" height="50"
   > Localiza<tion timeZone>="Europe/London" /
    ...
/DigitalClock

שעונים אנלוגיים

כדי ליצור שעון אנלוגי, משתמשים ברכיב AnalogClock. כל אחד מהאלמנטים הצאצאים של HourHand, MinuteHand ו-SecondHand מציין את המשאב שבו צריך להשתמש ברינדור:

<AnalogClock x="0" y="0" widt>h=&qu<ot;200" height="200">
    <HourHand resource="hour_hand&q>uot; <... /
    MinuteHand resource=">;minu<te_hand" /
    SecondHand resource="second_hand" /
    !-- Optiona>l<ly add a Tic>k or Sweep child element to define SecondHand behavior --
/AnalogClock

ציון נקודת הציר

כל אחד מהמשאבים של השעה, הדקה והשנייה מסתובב עם הזמן, אבל חשוב לציין את הנקודה הנכונה שסביבה כל אחד מהם צריך להתרוצץ.

במצבים מסוימים, נקודת הציר לא נמצאת ממש בחלק התחתון של היד, אלא במרכז שלה בכיוון אופקי. צריך לציין את זה כ-<HourHand … pivotY="(pivot_ratio)" />, כאשר:

$$ pivot\_ratio = \frac{pivot\_height}{full\_height} $$

צביעת מחוגי השעון

כדי לאפשר למשתמש להתאים אישית את המראה של תצוגת השעון, מקובל להגדיר צבע שאפשר לשנות עבור המחוגים של השעון.

כדי לעשות זאת, אפשר להשתמש ב-tintColor בכל אחת מהידיים כדי לצבוע כל יד בנפרד, או ב-AnalogClock כדי לצבוע את כל הידיים באותו צבע.

בנוסף לאפשרות לאפשר למשתמשים לצבוע צבעים ספציפיים, אפשר לספק אפשרות תצורה ל-tintColor כדי לאפשר למשתמש לבחור:

<AnalogClock ... tintColor="[CONFIGURATION.handColors.>0]" /

הטלת צללית

כדי ליצור אפקט ריאליסטי של שעון, אפשר להשתמש בצללית מאחורי כל שעון כדי ליצור תחושה של עומק. כדי לעשות זאת, צריך להשתמש בשני פריטים מכל סוג של יד, להזיז אחד מהם מאחורי השני ולספק משאב נפרד לצל:

<!-- Offset the shadow by 5 units in both directions -->
<HourHand resource="hour_hand_shadow" ... x=&qu>o<t;105">;< y="105"
!-- ... --
HourHand resource=&>quot;hour_hand" ... x="100" y="100"

קישוטים לפנים

תצוגות שעון אנלוגיות כוללות לעיתים קרובות קישוטים סביב התצוגה שמוצגים בהם השעות או הדקות. יש שתי גישות להשגת המטרה הזו:

  1. צריך לכלול תמונת רקע במסך מלא שמכילה את תצוגת השעון שציירתם מראש. איך עובדים עם תמונות

    <PartImage x="0" y="0" width=&q>uot;4<50" height="450" ..>.<
    Image> resource="watch_face_dial" /
/PartImage

  2. מציירים קישוטים נפרדים וממקמים אותם סביב הפנים באמצעות רוטציות.

    <Group ... >
    <!-- Content for the "12"> <marker> <--
/Group
Group pivotX="..." piv>otY=&<quot;..." angle="30&quo>t<;
    >!-- Content for the "1" marker --
/Group