মানগুলির একটি পরিসরের জন্য একটি স্লাইডার তৈরি করুন
সেভ করা পৃষ্ঠা গুছিয়ে রাখতে 'সংগ্রহ' ব্যবহার করুন
আপনার পছন্দ অনুযায়ী কন্টেন্ট সেভ করুন ও সঠিক বিভাগে রাখুন।
Slider কম্পোজেবল ব্যবহারকারীদের বিভিন্ন মান থেকে নির্বাচন করতে দেয়। ব্যবহারকারীকে নিম্নলিখিতগুলি করতে দিতে আপনি একটি স্লাইডার ব্যবহার করতে পারেন:
ভলিউম এবং উজ্জ্বলতার মতো মানগুলির একটি পরিসর ব্যবহার করে এমন সেটিংস সামঞ্জস্য করুন৷
একটি গ্রাফে ডেটা ফিল্টার করুন, যেমন একটি মূল্য পরিসীমা সেট করার সময়।
ব্যবহারকারীর ইনপুট, যেমন একটি পর্যালোচনাতে একটি রেটিং সেট করা।
স্লাইডারে একটি ট্র্যাক, থাম্ব, মান লেবেল এবং টিক চিহ্ন রয়েছে:
ট্র্যাক : ট্র্যাক হল অনুভূমিক বার যা স্লাইডারটি গ্রহণ করতে পারে এমন মানগুলির পরিসরকে প্রতিনিধিত্ব করে।
থাম্ব : থাম্ব হল স্লাইডারে একটি টেনে নেওয়া যায় এমন নিয়ন্ত্রণ উপাদান যা ব্যবহারকারীকে ট্র্যাক দ্বারা সংজ্ঞায়িত পরিসরের মধ্যে একটি নির্দিষ্ট মান নির্বাচন করতে দেয়।
টিক চিহ্ন : টিক চিহ্ন হল ঐচ্ছিক ভিজ্যুয়াল মার্কার বা সূচক যা স্লাইডারের ট্র্যাক বরাবর প্রদর্শিত হয়।
এই বাস্তবায়নের জন্য আপনার প্রজেক্ট minSDK এপিআই লেভেল 21 বা তার উপরে সেট করা প্রয়োজন।
নির্ভরতা
একটি মৌলিক স্লাইডার তৈরি করুন
নিচের উদাহরণটি একটি সোজা স্লাইডার। এটি ব্যবহারকারীকে 0.0 থেকে 1.0 পর্যন্ত একটি মান নির্বাচন করতে দেয়। যেহেতু ব্যবহারকারী সেই পরিসরে যেকোনো মান নির্বাচন করতে পারে, স্লাইডারটি অবিচ্ছিন্ন ।
ফলাফল
চিত্র 1. একটি স্লাইডারের একটি মৌলিক বাস্তবায়ন।
একটি উন্নত স্লাইডার তৈরি করুন
নিচের স্নিপেটটি একটি স্লাইডার প্রয়োগ করে যার তিনটি ধাপ রয়েছে, যার পরিসর 0.0 থেকে 50.0 পর্যন্ত। যেহেতু থাম্বটি প্রতিটি ধাপে স্ন্যাপ করে, এই স্লাইডারটি বিচ্ছিন্ন ।
ফলাফল
চিত্র 2. ধাপ সহ একটি স্লাইডার এবং একটি সেট মান পরিসীমা।
রেঞ্জ স্লাইডার
আপনি ডেডিকেটেড RangeSlider কম্পোজেবল ব্যবহার করতে পারেন। এটি ব্যবহারকারীকে দুটি মান নির্বাচন করতে দেয়। এটি এমন ক্ষেত্রে কার্যকর হতে পারে যেমন ব্যবহারকারী যখন সর্বনিম্ন এবং সর্বোচ্চ মূল্য নির্বাচন করতে চান।
নিম্নলিখিত উদাহরণটি একটি অবিচ্ছিন্ন পরিসর স্লাইডারের তুলনামূলকভাবে সহজ উদাহরণ:
ফলাফল
চিত্র 3. একটি পরিসীমা স্লাইডারের বাস্তবায়ন।
মূল পয়েন্ট
একটি সম্পূর্ণ API সংজ্ঞার জন্য Slider রেফারেন্স দেখুন। Slider কম্পোজেবলের জন্য কিছু মূল পরামিতি নিম্নরূপ:
value : স্লাইডারের বর্তমান মান।
onValueChange : একটি ল্যাম্বডা যা প্রতিবার মান পরিবর্তন করার সময় কল করা হয়।
enabled : একটি বুলিয়ান মান যা নির্দেশ করে যে ব্যবহারকারী স্লাইডারের সাথে ইন্টারঅ্যাক্ট করতে পারে কিনা।
আরও জটিল স্লাইডার প্রয়োগ করার সময়, আপনি অতিরিক্তভাবে নিম্নলিখিত পরামিতিগুলি ব্যবহার করতে পারেন।
colors : SliderColors একটি উদাহরণ যা আপনাকে স্লাইডারের রং নিয়ন্ত্রণ করতে দেয়।
valueRange : স্লাইডার যে মানগুলি নিতে পারে তার পরিসর।
steps : স্লাইডারে যে নচের সংখ্যা থাম্ব স্ন্যাপ করে
আপনি আরও পুঙ্খানুপুঙ্খভাবে উপাদান চেহারা কাস্টমাইজ করতে Slider একটি thumb এবং track কম্পোজেবল পাস করতে পারেন.
এই নির্দেশিকা ধারণকারী সংগ্রহ
এই নির্দেশিকাটি এই কিউরেট করা কুইক গাইড সংগ্রহের অংশ যা বৃহত্তর অ্যান্ড্রয়েড উন্নয়ন লক্ষ্যগুলি কভার করে:
ইন্টারেক্টিভ উপাদান প্রদর্শন
মেটেরিয়াল ডিজাইন ডিজাইন সিস্টেমের উপর ভিত্তি করে কীভাবে কম্পোজেবল ফাংশনগুলি আপনাকে সহজেই সুন্দর UI উপাদান তৈরি করতে সক্ষম করে তা শিখুন।
এই পৃষ্ঠার কন্টেন্ট ও কোডের নমুনাগুলি Content License-এ বর্ণিত লাইসেন্সের অধীনস্থ। 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)"]]
