אפליקציות ב-Wear OS משתמשות באותן שיטות פריסה כמו במכשירי Android אחרים אבל צריך לתכנן אותו עם מגבלות ספציפיות לשעון.
הערה: אין לנייד את הפונקציונליות וממשק המשתמש המדויקים מאפליקציה לנייד ל-Wear OS, אלא מצפים חוויית משתמש טובה.
אם האפליקציה שלך מיועדת למכשיר מלבני להחזקה ביד, תוכן שקרוב לפינות המסך עשויים להיחתך בשעונים עגולים. אם משתמשים ברשימה אנכית שניתן לגלול, המספר הזה קטן יותר בעיה, כי המשתמש יכול לגלול כדי למרכז את התוכן. עם זאת, במכשירים של מסכים בודדים מספקות חוויית משתמש גרועה.
אם משתמשים בהגדרות הבאות של הפריסה, הטקסט לא מוצג כראוי במכשירים עם מסכים עגולים:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/text" android:layout_width="0dp" android:layout_height="0dp" android:text="@string/very_long_hello_world" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
כדי לפתור את הבעיה, צריך להשתמש בפריסות שנמצאות ב ספריית ממשק המשתמש של Wear OS שתומכת במכשירים עגולים.
- אפשר להשתמש ב-
BoxInsetLayout
כדי למנוע חיתוך של תצוגות בקרבת הקצוות של מסכים עגולים. - אפשר להשתמש ב-
WearableRecyclerView
כדי ליצור פריסה מעוקלת כשרוצים להציג ולשנות רשימה אנכית של פריטים שעברו אופטימיזציה למסכים עגולים.
למידע נוסף על עיצוב אפליקציות, אפשר לקרוא את הנחיות לעיצוב Wear OS.
שימוש ב-BoxInsetLayout
![](https://developer.android.com/static/wear/images/02_uilib.png?authuser=8&hl=he)
איור 2. תוספות לחלונות במסך עגול.
המחלקה BoxInsetLayout
בספריית ממשק המשתמש של Wear OS מאפשרת
מגדירים פריסה שמתאימה למסכים עגולים. הכיתה הזו מאפשרת לך
ליישר בקלות את התצוגות במרכז או סמוך לקצוות של המסך.
הריבוע האפור בתמונה 2 מראה את האזור שבו BoxInsetLayout
יכול למקם באופן אוטומטי את תצוגות הצאצא שלו במסכים עגולים לאחר ההחלה
את רכיבי inset הנדרשים של החלון. כדי שיוצג בתוך האזור הזה, צריך להגדיר את
תצוגות מפורטות מציינות את המאפיין layout_boxedEdges
עם הערכים הבאים:
- שילוב של
top
,bottom
,left
ו-right
. לדוגמה, הערך של"left|top"
ממקם את הילד או הילדה שמאלה ולמעלה הקצוות בתוך הריבוע האפור בפורמט 2. - הערך
"all"
ממקם את כל התוכן של הילד או הילדה בתוך הריבוע האפור בתמונה 2. זאת הגישה הנפוצה ביותרConstraintLayout
מבפנים.
הפריסה שמוצגת באיור 2 משתמשת ברכיב <BoxInsetLayout>
ופועל במסכים עגולים:
<androidx.wear.widget.BoxInsetLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_height="match_parent" android:layout_width="match_parent" android:padding="15dp"> <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:padding="5dp" app:layout_boxedEdges="all"> <TextView android:layout_height="wrap_content" android:layout_width="match_parent" android:text="@string/sometext" android:textAlignment="center" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <ImageButton android:background="@android:color/transparent" android:layout_height="50dp" android:layout_width="50dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" android:src="@drawable/cancel" /> <ImageButton android:background="@android:color/transparent" android:layout_height="50dp" android:layout_width="50dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" android:src="@drawable/ok" /> </androidx.constraintlayout.widget.ConstraintLayout> </androidx.wear.widget.BoxInsetLayout>
שימו לב לחלקים של הפריסה שמסומנים בגופן מודגש:
-
android:padding="15dp"
השורה הזו מקצה מרווח פנימי ל-
<BoxInsetLayout>
לרכיב מסוים. -
android:padding="5dp"
השורה הזו מקצה מרווח פנימי לרכיב
ConstraintLayout
הפנימי. -
app:layout_boxedEdges="all"
הקו הזה מבטיח שהרכיב
ConstraintLayout
והצאצאים שלו ארוזים בתוך האזור המוגדר על ידי החלון מסך עגול.
שימוש בפריסה מעוקלת
הכיתה
WearableRecyclerView
בספריית ממשק המשתמש של Wear OS
מאפשרת לבחור בפריסה קמורה שמותאמת למסכים עגולים.
כדי להפעיל פריסה מעוקלת ברשימות שניתן לגלול בדף
לאפליקציה, ראו
יוצרים רשימות ב-Wear OS.