יצירת צ'יפ לייצוג ישויות מורכבות

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

אלה חמשת סוגי הצ'יפים והמקרים שבהם כדאי להשתמש בהם:

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

תאימות גרסאות

כדי להטמיע את הקוד הזה, צריך להגדיר את minSDK של הפרויקט לרמת API 21 ואילך.

יחסי תלות

יצירת צ'יפ עזרה

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

צ'יפ עזרה פשוט.
איור 1. צ'יפ Assist.

יצירת צ'יפ מסנן

כדי להשתמש ברכיב ה-Composable FilterChip, צריך לעקוב אחרי הבחירה של הצ'יפ. בדוגמה הבאה מוסבר איך להציג סמל מוסמן בתחילת השורה רק כשהמשתמש בחר את הצ'יפ:

תוצאות

צ'יפ מסנן לא נבחר, ללא סימון וברקע של תוכנית.
איור 2. צ'יפ מסנן שלא נבחר.
צ'יפ סינון שנבחר, עם סימן וי ורקע צבעוני.
איור 3. צ'יפ הסינון שנבחר.

יצירת צ'יפ קלט

אפשר להשתמש ברכיב ה-composable InputChip כדי ליצור צ'יפים שמתקבלים כתוצאה מאינטראקציה של משתמשים. לדוגמה, בתוכנת אימייל, כשהמשתמש כותב אימייל, צ'יפ קלט עשוי לייצג אדם שהמשתמש הזין את הכתובת שלו בשדה 'אל'.

ההטמעה הבאה מדגימה צ'יפ קלט שנמצא במצב שנבחר. המשתמש סוגר את הצ'יפ כשהוא לוחץ עליו.

תוצאות

צ'יפ קלט עם דמות וסמל בסוף.
איור 4. צ'יפ קלט.

יצירת צ'יפ הצעה

ה-composable SuggestionChip הוא הבסיסי ביותר מבין ה-composables שמפורטים בדף הזה, גם בהגדרת ה-API וגם בתרחישי השימוש הנפוצים שלו. צ'יפים של הצעות מציעים טיפים שנוצרו באופן דינמי. לדוגמה, באפליקציית צ'אט עם AI, אפשר להשתמש בצ'יפים של הצעות כדי להציג תשובות אפשריות להודעה האחרונה.

כדאי להשתמש בהטמעה הזו של SuggestionChip:

תוצאות

צ'יפ עזרה פשוט.
איור 5. צ'יפ Assist.

יצירת צ'יפ מודגש

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

נקודות עיקריות

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

  • label: המחרוזת שמופיעה בצ'יפ.
  • icon: הסמל שמוצג בתחילת הצ'יפ. לחלק מהרכיבים הקומפוזביליים יש פרמטר leadingIcon ופרמטר trailingIcon נפרדים.
  • onClick: פונקציית הלמבדה שהצ'יפ קורא לה כשהמשתמש לוחץ עליו.

אוספים שמכילים את המדריך הזה

המדריך הזה הוא חלק מהאוספים הבאים של מדריכים מהירים, שמכסים יעדים רחבים יותר לפיתוח Android:

איך פונקציות מורכבות מאפשרות ליצור בקלות רכיבי ממשק משתמש יפים על סמך מערכת העיצוב של Material Design.

יש לכם שאלות או משוב

אתם יכולים להיכנס לדף השאלות הנפוצות שלנו ולקרוא מדריכים מהירים, או ליצור איתנו קשר ולספר לנו מה דעתכם.