קל לארגן דפים בעזרת אוספים
אפשר לשמור ולסווג תוכן על סמך ההעדפות שלך.
הרכיב Switch מאפשר למשתמשים לעבור בין שני מצבים: מסומן ולא מסומן. אפשר להשתמש במתג כדי לאפשר למשתמש לבצע אחת מהפעולות הבאות:
מפעילים או משביתים את ההגדרה.
הפעלה או השבתה של תכונה.
בוחרים באחת מהאפשרויות.
הרכיב מורכב משני חלקים: התמונה הממוזערת והטראק. האגודל הוא החלק שניתן לגרירה במתג, והטראק הוא הרקע. המשתמש יכול לגרור את האגודל שמאלה או ימינה כדי לשנות את מצב המתג. הם יכולים גם להקיש על המתג כדי לבדוק ולנקות אותו.
תאימות גרסאות
כדי להטמיע את הקוד הזה, צריך להגדיר את minSDK של הפרויקט לרמת API 21 ואילך.
יחסי תלות
הטמעת מתג
הדוגמה הבאה היא הטמעה מינימלית של ה-composable Switch:
תוצאות
איור 1. מתג שלא מסומן.איור 2. מתג מסומן.
יצירת תמונה ממוזערת בהתאמה אישית
אפשר להעביר פרמטר thumbContent של כל רכיב מורכב כדי ליצור תמונה ממוזערת בהתאמה אישית. הדוגמה הבאה היא של מתג שמשתמש בסמל מותאם אישית ללחצן:
תוצאות
המראה של התיבה שלא מסומנת זהה לדוגמה שבקטע הקודם. עם זאת, כשבודקים את ההטמעה הזו, היא נראית כך:
איור 3. מתג עם סמל סימון מותאם אישית.
שימוש בצבעים מותאמים אישית
משתמשים בפרמטר colors כדי לשנות את הצבע של הלחצן והמסלול של המתג, בהתאם לסטטוס הסימון שלו.
תוצאות
איור 4. מתג עם צבעים מותאמים אישית.
נקודות עיקריות
פרמטרים בסיסיים:
checked: המצב הראשוני של המתג.
onCheckedChange: פונקציית קריאה חוזרת (callback) שנקראת כשהסטטוס של המתג משתנה.
enabled: מצב המתג (מופעל או מושבת).
colors: הצבעים שבהם נעשה שימוש למתג.
פרמטרים מתקדמים
thumbContent: אפשר להשתמש באפשרות הזו כדי להתאים אישית את המראה של הסמל כשהיא מסומנת.
colors: אפשר להשתמש באפשרות הזו כדי להתאים אישית את הצבע של הטראק והתמונה הממוזערת.
אוספים שמכילים את המדריך הזה
המדריך הזה הוא חלק מהאוספים הבאים של מדריכים מהירים, שמכסים יעדים רחבים יותר לפיתוח Android:
הצגת רכיבים אינטראקטיביים
איך פונקציות מורכבות מאפשרות ליצור בקלות רכיבי ממשק משתמש יפים על סמך מערכת העיצוב של Material Design.
דוגמאות התוכן והקוד שבדף הזה כפופות לרישיונות המפורטים בקטע רישיון לתוכן. Java ו-OpenJDK הם סימנים מסחריים או סימנים מסחריים רשומים של חברת Oracle ו/או של השותפים העצמאיים שלה.
עדכון אחרון: 2025-05-08 (שעון 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-05-08 (שעון UTC)."],[],[],null,["\u003cbr /\u003e\n\nThe [`Switch`](/reference/kotlin/androidx/compose/material3/package-summary#Switch(kotlin.Boolean,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Boolean,androidx.compose.material3.SwitchColors,androidx.compose.foundation.interaction.MutableInteractionSource)) component lets users toggle between two states: checked\nand unchecked. Use a switch to let the user to do one of the\nfollowing:\n\n- Toggle a setting on or off.\n- Enable or disable a feature.\n- Select an option.\n\nThe component has two parts: the thumb and the track. The thumb is the draggable\npart of the switch, and the track is the background. The user can drag the thumb\nto the left or right to change the state of the switch. They can also tap the\nswitch to check and clear it.\n\nVersion compatibility\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\nDependencies\n\nImplement a switch\n\nThe following example is a minimal implementation of the `Switch` composable:\n\nResults **Figure 1.** An unchecked switch. **Figure 2.** A checked switch.\n\nCreate a custom thumb\n\nYou can pass any composable for the `thumbContent` parameter to create a custom\nthumb. The following is an example of a switch that uses a custom icon for its\nthumb:\n\nResults\n\nThe unchecked appearance is the same as the example in\nthe preceding section. However, when checked, this implementation appears as\nfollows:\n**Figure 3.** A switch with a custom checked icon.\n\nUse custom colors\n\nUse the `colors` parameter to\nchange the color of a switch's thumb and track, taking into account whether the\nswitch is checked.\n\nResults **Figure 4.** A switch with custom colors.\n\nKey points\n\n- Basic parameters:\n\n - **`checked`**: The initial state of the switch.\n - **`onCheckedChange`**: A callback that is called when the state of the switch changes.\n - **`enabled`**: Whether the switch is enabled or disabled.\n - **`colors`**: The colors used for the switch.\n- Advanced parameters\n\n - **`thumbContent`**: Use this to customize the appearance of the thumb when it is checked.\n - **`colors`**: Use this to customize the color of the track and thumb.\n\nCollections that contain this guide\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\nDisplay interactive components \nLearn how composable functions can enable you to easily create beautiful UI components based on the Material Design design system. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-interactive-components) \n\nHave questions or feedback \nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]
