Koleksiyonlar ile düzeninizi koruyun
İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.
Slider bileşeni, kullanıcıların bir dizi değer arasından seçim yapmasına olanak tanır. Kullanıcının aşağıdakileri yapmasına izin vermek için kaydırma çubuğunu kullanabilirsiniz:
Ses ve parlaklık gibi bir dizi değer kullanan ayarları ayarlayın.
Fiyat aralığı belirlerken olduğu gibi bir grafikteki verileri filtreleyin.
Kullanıcı girişi (ör. yorumda puan belirleme).
Kaydırma çubuğunda bir kanal, kaydırma çubuğu ucu, değer etiketi ve onay işaretleri bulunur:
Kanal: Kanal, kaydırıcıya atanan değer aralığını gösteren yatay çubuktur.
İşaretçi: İşaretçi, kaydırma çubuğundaki sürüklenebilir bir kontrol öğesidir. Kullanıcının, kanal tarafından tanımlanan aralıktaki belirli bir değeri seçmesine olanak tanır.
Onay işaretleri: Onay işaretleri, kaydırma çubuğunun yolunda görünen isteğe bağlı görsel işaretçiler veya göstergelerdir.
Bu konuda aşağıdaki kaydırma çubukları gösterilmektedir:
Bu uygulama için projenizin minSDK değerinin API düzeyi 21 veya üstü olarak ayarlanması gerekir.
Bağımlılıklar
Temel kaydırma çubuğu oluşturma
Aşağıdaki örnekte basit bir kaydırma çubuğu gösterilmektedir. Bu sayede kullanıcı 0.0 ile 1.0 arasında bir değer seçebilir. Kullanıcı bu aralıktaki herhangi bir değeri seçebileceğinden kaydırma çubuğu sürekli olur.
Sonuçlar
Şekil 1. Kaydırma çubuğunun temel uygulaması.
Gelişmiş kaydırma çubuğu oluşturma
Aşağıdaki snippet, 0.0 ile 50.0 arasında bir aralığa sahip üç adımlı bir kaydırma çubuğu uygular. Başparmak her adıma yapıştığı için bu kaydırma çubuğu ayrıdır.
Sonuçlar
Şekil 2. Adımları ve ayarlanmış bir değer aralığı olan bir kaydırma çubuğu.
Aralık kaydırma çubuğu
Özel RangeSlider bileşenini de kullanabilirsiniz. Bu sayede kullanıcı iki değer seçebilir. Bu, kullanıcının minimum ve maksimum fiyat seçmek istediği durumlarda yararlı olabilir.
Aşağıdaki örnek, sürekli aralık kaydırma çubuğunun nispeten basit bir örneğidir:
Sonuçlar
Şekil 3. Aralık kaydırma çubuğunun bir uygulaması.
Önemli noktalar
Tam API tanımı için Slider referansına bakın. Slider bileşeninin temel parametrelerinden bazıları şunlardır:
value: Kaydırma çubuğunun mevcut değeri.
onValueChange: Değer her değiştiğinde çağrılan bir lambda.
Bileşenin görünümünü daha ayrıntılı bir şekilde özelleştirmek için Slider bir thumb ve track bileşeni de iletebilirsiniz.
Bu kılavuzu içeren koleksiyonlar
Bu kılavuz, daha geniş Android geliştirme hedeflerini kapsayan, özel olarak seçilmiş Hızlı Kılavuz koleksiyonlarından biridir:
Etkileşimli bileşenleri görüntüleme
Birleştirilebilir işlevlerin, Materyal Tasarım tasarım sistemine dayalı güzel kullanıcı arayüzü bileşenleri oluşturmanızı nasıl kolaylaştırabileceğini öğrenin.
Bu sayfadaki içerik ve kod örnekleri, İçerik Lisansı sayfasında açıklanan lisanslara tabidir. Java ve OpenJDK, Oracle ve/veya satış ortaklarının tescilli ticari markasıdır.
Son güncelleme tarihi: 2025-02-06 UTC.
[[["Anlaması kolay","easyToUnderstand","thumb-up"],["Sorunumu çözdü","solvedMyProblem","thumb-up"],["Diğer","otherUp","thumb-up"]],[["İhtiyacım olan bilgiler yok","missingTheInformationINeed","thumb-down"],["Çok karmaşık / çok fazla adım var","tooComplicatedTooManySteps","thumb-down"],["Güncel değil","outOfDate","thumb-down"],["Çeviri sorunu","translationIssue","thumb-down"],["Örnek veya kod sorunu","samplesCodeIssue","thumb-down"],["Diğer","otherDown","thumb-down"]],["Son güncelleme tarihi: 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)"]]
