כדי להטמיע את האפשרות הזו, צריך להגדיר את minSDK של הפרויקט לרמת API 21 ואילך.
יחסי תלות
יצירת פס שקופיים בסיסי
הדוגמה הבאה היא פס הזזה פשוט. כך המשתמש יכול לבחור ערך מ-0.0 עד 1.0. מכיוון שהמשתמש יכול לבחור כל ערך בטווח הזה, המחוון הוא רציף.
תוצאות
איור 1. הטמעה בסיסית של פס הזזה.
יצירת פס מחליק מתקדם
קטע הקוד הבא מיישם פס מחליק עם שלושה שלבים, בטווח מ-0.0 ל-50.0. מכיוון שהאגודל נצמד לכל שלב, פס ההזזה הזה הוא מנותק.
תוצאות
איור 2. פס הזזה עם שלבים וטווח ערכים מוגדר.
פס ההזזה של הטווח
אפשר גם להשתמש ב-composable הייעודי RangeSlider. כך המשתמש יכול לבחור שני ערכים. האפשרות הזו יכולה להיות שימושית במקרים שבהם המשתמש רוצה לבחור מחיר מינימום ומקסימום.
הדוגמה הבאה היא דוגמה פשוטה יחסית לפס ההזזה של טווח רציף:
תוצאות
איור 3. הטמעה של פס גלילה של טווח.
נקודות עיקריות
להגדרה המלאה של ה-API, אפשר לעיין במסמך העזרה של Slider. אלה כמה מהפרמטרים העיקריים של ה-composable Slider:
value: הערך הנוכחי של פס ההזזה.
onValueChange: פונקציית lambda שמופעל בכל פעם שהערך משתנה.
enabled: ערך בוליאני שמציין אם המשתמש יכול לבצע פעולות על פס ההזזה.
כשמטמיעים פס מחליק מורכב יותר, אפשר להשתמש גם בפרמטרים הבאים.
colors: מופע של SliderColors שמאפשר לשלוט בצבעים של פס ההזזה.
valueRange: טווח הערכים שאפשר לבחור בסרגל ההזזה.
steps: מספר החריצים בסרגל ההזזה שאליהם נצמדת האגודל.
אפשר גם להעביר ל-Slider רכיב thumb ו-track כדי להתאים אישית את המראה של הרכיב בצורה מעמיקה יותר.
אוספים שמכילים את המדריך הזה
המדריך הזה הוא חלק מהאוספים הבאים של מדריכים מהירים, שמכסים יעדים רחבים יותר לפיתוח Android:
הצגת רכיבים אינטראקטיביים
איך פונקציות מורכבות מאפשרות ליצור בקלות רכיבי ממשק משתמש יפים על סמך מערכת העיצוב של Material Design.
דוגמאות התוכן והקוד שבדף הזה כפופות לרישיונות המפורטים בקטע רישיון לתוכן. Java ו-OpenJDK הם סימנים מסחריים או סימנים מסחריים רשומים של חברת Oracle ו/או של השותפים העצמאיים שלה.
עדכון אחרון: 2025-02-06 (שעון 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-02-06 (שעון UTC)."],[],[],null,["\u003cbr /\u003e\n\nThe [`Slider`](/reference/kotlin/androidx/compose/material3/package-summary#Slider(androidx.compose.material3.SliderState,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.compose.material3.SliderColors,androidx.compose.foundation.interaction.MutableInteractionSource,kotlin.Function1,kotlin.Function1)) composable lets users make selections from a range of\nvalues. You might use a slider to let the user do the following:\n\n- Adjust settings that use a range of values, such as volume, and brightness.\n- Filter data in a graph, as when setting a price range.\n- User input, like setting a rating in a review.\n\nThe slider contains a track, thumb, value label, and tick marks:\n\n- **Track**: The track is the horizontal bar that represents the range of values the slider can take.\n- **Thumb**: The thumb is a draggable control element on the slider that allows the user to select a specific value within the range defined by the track.\n- **Tick marks**: Tick marks are optional visual markers or indicators that appear along the track of the slider.\n\nThis topic shows the following slider implementations:\n\n- [Basic](#basic-implementation)\n- [Advanced](#advanced-implementation)\n- [Range](#range-slider)\n\nVersion compatibility\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\nDependencies\n\nCreate a basic slider\n\nThe following example is a straightforward slider. That allows the user to\nselect a value from `0.0` to `1.0`. Because the user can select any value in\nthat range, the slider is *continuous*.\n\nResults **Figure 1.** A basic implementation of a slider.\n\nCreate an advanced slider\n\nThe following snippet implements a slider that has three steps, with a range\nfrom `0.0` to `50.0`. Because the thumb snaps to each step, this slider is\n*discrete*.\n\nResults **Figure 2.** A slider with steps and a set value range. **Note:** The very beginning and end of a slider count as \"steps\". In the preceding example where the range is `0f..50f` and the number of `steps` is `3`, each interval along the range is `12.5` because the beginning and end of the slider are also intervals the user can select.\n\nRange slider\n\nYou can also use the dedicated [`RangeSlider`](/reference/kotlin/androidx/compose/material3/package-summary#RangeSlider(kotlin.ranges.ClosedFloatingPointRange,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Boolean,kotlin.ranges.ClosedFloatingPointRange,kotlin.Int,kotlin.Function0,androidx.compose.material3.SliderColors)) composable. This allows the user to\nselect two values. This can be useful in cases such as when the user wishes to\nselect a minimum and maximum price.\n\nThe following example is a relatively straightforward example of a continuous\nrange slider:\n\nResults **Figure 3.** An implementation of a range slider.\n\nKey points\n\nSee the [`Slider`](/reference/kotlin/androidx/compose/material3/package-summary#Slider(androidx.compose.material3.SliderState,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.compose.material3.SliderColors,androidx.compose.foundation.interaction.MutableInteractionSource,kotlin.Function1,kotlin.Function1)) reference for a full API definition. Some of the key\nparameters for the `Slider` composable are the following:\n\n- **`value`**: The current value of the slider.\n- **`onValueChange`**: A lambda that gets called every time the value is changed.\n- **`enabled`**: A boolean value that indicates if the user can interact with the slider.\n\nWhen implementing a more complex slider, you can additionally make use of the\nfollowing parameters.\n\n- **`colors`** : An instance of `SliderColors` that lets you control the colors of the slider.\n- **`valueRange`**: The range of values that the slider can take.\n- **`steps`**: The number of notches on the slider to which the thumb snaps.\n\nYou can also pass `Slider` a `thumb` and `track` composable to more\nthoroughly customize the appearance of the component.\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)"]]