התאמת העיצוב של Google Material Design ל-Wear
קל לארגן דפים בעזרת אוספים
אפשר לשמור ולסווג תוכן על סמך ההעדפות שלך.
התכונה 'עיצוב לפי נושא ב-Material Design ל-Wear' מאפשרת להתאים אישית באופן שיטתי את העיצוב של Wear Material Design כך שישקף את המותג שלכם. כשמתחילים לשנות היבטים של ממשק המשתמש, כמו צבע וטיפוגרפיה, הכלים של עיצוב הנושאים של Wear Material מאפשרים לכם ליישם את חזון העיצוב שלכם בכל חלקי חוויית המשתמש. הכלים מאפשרים לעבור בקלות בין תהליכי העבודה של העיצוב והקוד על ידי מתן ערכים ספציפיים לכל המאפיינים שניתנים להתאמה אישית. התאמה אישית של ערכי המאפיינים יוצרת עיצוב Material למוצר שלכם ב-Wear.
שימוש בהתאמת העיצוב של Google Material Design ל-Wear
נושאי Wear Material מורכבים משלושה פעולות עיקריות: התאמה אישית של העיצוב, החלה שלו על מודעות העיצוב והשימוש בו בקוד.
ל-Material Design ב-Wear יש עיצוב מובנה שאפשר להשתמש בו כפי שהוא. אפשר גם להתאים אישית את העיצוב המובנה כדי להתאים את Material למוצר שלכם.
שימוש בנושאים בפועל
העיצוב לפי נושא משפיע על כל ממשק המשתמש, כולל רכיבים נפרדים כמו צ'יפים.
בדוגמה הבאה מוסבר איך להתאים אישית את ערכי ברירת המחדל של רכיב צ'יפ.
צ'יפ מוכלל מקבל ערכים של צבע, צורה ומשפחת סוגים ספציפיים. משנים את ערכי ברירת המחדל בהתאם לסגנון של האפליקציה.
| לפני
צ'יפ בסיס של Wear Material עם סגנונות ברירת מחדל.
|
אחרי
צ'יפ בהתאמה אישית של Wear Material.
|
צבע
מערכת הצבעים תומכת בהגדרת צבעים מותאמים אישית לרכיבים, לטקסט, לסמלים ולמשטחים. אפשר להגדיר את צבעי העיצוב ל-13 הקטגוריות הבאות:
ראשי
וריאנט ראשי
Secondary
וריאנט משני
רקע
Surface
שגיאה
בחשבון הראשי
בחשבון המשני
ברקע
ב-Surface
וריאנט של On Surface
On Error
טיפוגרפיה
מערכת הטיפוגרפיה תומכת ב-11 קטגוריות שיוצרות יחד את סולם הגופנים.
סולם הגופנים הזה קובע את הסגנונות והגדלים השונים של הגופנים שמופיעים במסך, החל מטקסט גוף ועד לטקסט של לחצנים.
מאפייני הטיפוגרפיה נשלטים על ידי ערכים שאפשר להתאים אישית עבור משפחת הגופן, הגופן, אותיות רישיות, גודל ועקיבה.
דוגמאות התוכן והקוד שבדף הזה כפופות לרישיונות המפורטים בקטע רישיון לתוכן. Java ו-OpenJDK הם סימנים מסחריים או סימנים מסחריים רשומים של חברת Oracle ו/או של השותפים העצמאיים שלה.
עדכון אחרון: 2025-07-27 (שעון UTC).
[[["התוכן קל להבנה","easyToUnderstand","thumb-up"],["התוכן עזר לי לפתור בעיה","solvedMyProblem","thumb-up"],["סיבה אחרת","otherUp","thumb-up"]],[["חסרים לי מידע או פרטים","missingTheInformationINeed","thumb-down"],["התוכן מורכב מדי או עם יותר מדי שלבים","tooComplicatedTooManySteps","thumb-down"],["התוכן לא עדכני","outOfDate","thumb-down"],["בעיה בתרגום","translationIssue","thumb-down"],["בעיה בדוגמאות/בקוד","samplesCodeIssue","thumb-down"],["סיבה אחרת","otherDown","thumb-down"]],["עדכון אחרון: 2025-07-27 (שעון UTC)."],[],[],null,["# Wear Material Theming is the ability to systematically customize Wear Material\nDesign to reflect your brand. When you begin changing aspects of your UI such\nas color and typography, Wear Material Theming tools apply your design vision\nthroughout your user experience. The tools allow easy switching between\ndesign and code workflows by providing specific values for all customizable\nattributes. Customizing the attribute values creates a Wear Material Theme for\nyour product.\n\nUse Wear Material Theming\n-------------------------\n\nWear Material Theming consists of three main actions: customizing your theme,\napplying it across your design mocks, and using it in code.\n\nWear Material Design comes with a built-in theme that can be used as is.\nCustomize the built-in theme to make Material work for your product.\n\n### Theming in practice\n\nTheming affects your entire UI, including individual components such as chips.\nThe following example shows how to customize a chip component's default values.\n\nA contained chip is assigned values for a specific color, shape, and type\nfamily. Adjust the default values to suit your app's style.\n\n|---------------------------------------------------------------|--------------------------------------------|\n| **Before** A baseline Wear Material chip with default styles. | **After** A customized Wear Material chip. |\n\nColor\n-----\n\nThe color system supports setting custom colors for components, text, icons, and\nsurfaces. Set your theme colors for the 13 following categories:\n\n1. Primary\n\n2. Primary Variant\n\n3. Secondary\n\n4. Secondary Variant\n\n5. Background\n\n6. Surface\n\n7. Error\n\n8. On Primary\n\n9. On Secondary\n\n10. On Background\n\n11. On Surface\n\n12. On Surface Variant\n\n13. On Error\n\nTypography\n----------\n\nThe typography system supports 11 categories that together form the type scale.\nThis type scale determines the various type styles and sizes that appear\non-screen, ranging from body copy to button text.\n\nTypography attributes are controlled by values that can be customized for the\ntype family, font, case, size, and tracking."]]
