יצירת כפתור

לחצנים מאפשרים למשתמש להפעיל פעולה מוגדרת. יש חמישה סוגים של לחצנים:

סוג

מראה

המטרה

Filled

רקע אחיד עם טקסט בניגודיות גבוהה.

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

Tonal

צבע הרקע משתנה בהתאם למשטח.

לפעולות ראשיות או משמעותיות. לחצנים מלאים נותנים תחושה של משקל חזותי, והם מתאימים לפעולות כמו 'הוספה לעגלת הקניות' ו'כניסה'.

גבוהה מהרצוי

הצללית עוזרת להבליט אותו.

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

Outlined

כולל גבול ללא מילוי.

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

טקסט

טקסט ללא רקע או שוליים.

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

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

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

יחסי תלות

יצירת כפתור מלא

רכיב הכפתור המלא משתמש ברכיב ה-composable הבסיסי Button. כברירת מחדל, הוא ממולא בצבע אחיד.

תוצאות

כפתור מלא עם רקע סגול עם הכיתוב 'מלא'.
איור 1. כפתור מלא.

יצירת כפתור מלא בגוון

רכיב הלחצן המלא עם גוון משתמש ב-composable‏ FilledTonalButton. הוא מתמלא בצבע טונלי כברירת מחדל.

תוצאות

לחצן כהה עם רקע סגול בהיר עם הכיתוב 'מלא'.
איור 2. לחצן טונאלי.

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

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

תוצאות

כפתור שקוף עם קו מתאר כהה ועם הכיתוב 'קו מתאר'.
איור 3. כפתור מודגש.

יצירת כפתור עם הרשאות גישה מורחבות

רכיב הלחצן המוגבה משתמש ברכיב ה-composable‏ ElevatedButton. כברירת מחדל, הוא כולל צל שמציג את אפקט ההגבהה, והוא מופיע כלחצן עם קו מתאר וצל.

תוצאות

לחצן בולט עם רקע אפור עם הכיתוב 'בולט'.
איור 4. לחצן בולט.

יצירת כפתור טקסט

רכיב לחצן הטקסט משתמש ב-composable‏ TextButton. עד שמקישים עליו, הוא מופיע רק כטקסט. כברירת מחדל, אין לה מילוי או קו מתאר מוצקים.

תוצאות

לחצן טקסט עם הכיתוב 'לחצן טקסט'
איור 5. כפתור טקסט.

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

  • onClick: הפונקציה שנקראת כשהמשתמש לוחץ על הלחצן.
  • enabled: כשהערך של הפרמטר הזה הוא false, הלחצן מופיע לא זמין ולא פעיל.
  • colors: מופע של ButtonColors שקובע את הצבעים שבהם נעשה שימוש בכפתור.
  • contentPadding: הריפוד בתוך הלחצן.

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

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

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

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

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