পিকার ব্যবহারকারীদের নির্দিষ্ট ডেটা নির্বাচন এবং সেট করতে সহায়তা করে।

পিকার
ব্যবহারকারীদের একটি সীমিত সংখ্যক আইটেমের মধ্যে বেছে নিতে দেওয়ার জন্য বাছাইকারীদের ব্যবহার করা উচিত।
ডিফল্ট আইটেমগুলি উভয় দিকে অসীমভাবে লুপ করা হবে। তালিকায় ক্রম গুরুত্বপূর্ণ হলে এই আচরণটি অক্ষম করার কথা বিবেচনা করুন, অথবা ব্যবহারকারীদের দ্রুত সোয়াইপ করে প্রথম এবং শেষ উপাদানে পৌঁছানোর অনুমতি দিন৷
অ্যানাটমি

অ্যানাটমি
A. নিষ্ক্রিয় কলাম
B. কোলন ব্রেকার
C. পিকার কলাম
D. শীর্ষ সামগ্রী
E. মধ্যম বিষয়বস্তু
F. নীচের বিষয়বস্তু

প্রস্থ এবং উচ্চতা
পিকার গ্রুপ উপলব্ধ উচ্চতা এবং প্রস্থ পূরণ করে। পিকার কলামের জন্য চারটি লেআউট বিকল্প রয়েছে। প্রতিটি লেআউট কেন্দ্রীভূত এবং উপলব্ধ উচ্চতা পূরণ করে। কলামের প্রস্থগুলি ফন্টে প্রয়োজনীয় সংখ্যার সংখ্যা মিটমাট করার জন্য প্রয়োজনীয় প্রস্থ দ্বারা সংজ্ঞায়িত করা হয়, তারিখ-পিকার হল ব্যতিক্রম, অনুভূমিকভাবে এটি স্ক্রীনটি পূরণ করে এবং প্রান্ত থেকে রক্তপাত করে।
উদাহরণস্বরূপ সংখ্যাগুলি '00' এর প্রস্থের কাজ করবে এবং তারপর প্রস্থ নির্ধারণ করবে। টেক্সট ফিল্ডের জন্য, মাস ফিল্ডের জন্য উদাহরণস্বরূপ, 'MMM' এর প্রস্থ হিসাবে কাজ করা হবে (যা ল্যাটিন বর্ণমালার সবচেয়ে প্রশস্ত অক্ষর)। প্রস্থ এবং উচ্চতা (যা ব্যবহৃত সেই ধরনের শৈলীর লাইনের উচ্চতা) তাই ব্যবহৃত ফন্ট দ্বারা প্রভাবিত হবে।
বাছাইকারী আইটেম ব্রেকপয়েন্ট জুড়ে আকারে পরিবর্তিত হয়।
ব্যবহার
তারিখ এবং সময় বাছাইকারীদের নিম্নলিখিত উদাহরণগুলি দেখুন
একটি পূর্বনির্মাণ তারিখ এবং সময় চয়নকারী বাস্তবায়নের জন্য, Github-এ হরোলজিস্ট লাইব্রেরি দেখুন।
আপনি যদি একটি অনুরূপ অভিজ্ঞতা তৈরি করতে চান, যেখানে ব্যবহারকারীরা একাধিক বাছাইকারীদের মধ্যে একটি মাল্টি-পার্ট মান বেছে নেয়, বিল্ট-ইন পিকারগ্রুপ কম্পোনেন্ট ব্যবহার করুন। এই বস্তুটি সঠিক বাছাইকারী উপাদানে ফোকাস বরাদ্দ করতে একটি ফোকাস সমন্বয়কারী বস্তু ব্যবহার করে।
অভিযোজিত বিন্যাস
টাইমপিকার 24H
টাইমপিকার 12H
তারিখ পিকার
প্রতিক্রিয়াশীল আচরণ
পাঠ্যের আকার বৃদ্ধি
225+ ব্রেকপয়েন্ট পেরিয়ে গেলে পিকার এলিমেন্টের ফন্ট সাইজ পরিবর্তন হয়। অলস স্ক্রোলিং কলামের মধ্যে টপ এবং বটম কপি অ্যাডজাস্ট করে (A), যেমন মিডল কপি করে। নীচে এর কিছু উদাহরণ দেওয়া হল:
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 2
225 ডিপি ব্রেকপয়েন্টের উপরে
ফন্ট: ডিসপ্লে 1
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 3
225 ডিপি ব্রেকপয়েন্টের উপরে
হরফ: প্রদর্শন 2
গ্রেডিয়েন্ট আকার বৃদ্ধি
পিকার কলামের গ্রেডিয়েন্ট উপলব্ধ স্থান দ্বারা উচ্চতায় সংজ্ঞায়িত করা হয়। উপরের এবং নীচের উভয় গ্রেডিয়েন্ট উপলব্ধ উচ্চতার এক তৃতীয়াংশ (33%) এ সেট করা হয়েছে। এর মানে প্রতিটি উপলব্ধ স্ক্রীন আকারে, গ্রেডিয়েন্ট স্কেল আনুপাতিকভাবে। কলাম লেআউট থেকে স্বাধীনভাবে বসা।


225 ডিপি ব্রেকপয়েন্টের নিচে
আকার: কলামের উচ্চতার 33%
225 ডিপি ব্রেকপয়েন্টের উপরে
আকার: কলামের উচ্চতার 33%
কলামের ব্যবধান বৃদ্ধি
কলামের ব্যবধান 225+ ব্রেকপয়েন্ট অতিক্রম করে, হয় 2 ডিপি বা 4 ডিপি থেকে শুরু হয় এবং 6 ডিপি পর্যন্ত বৃদ্ধি পায়। আপনি কোন লেআউটটি নির্বাচন করেছেন তার উপর এটি নির্ভর করে; হয় 2 বা 3 কলাম লেআউট
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
4 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
2 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক
পিকার ব্যবহারকারীদের নির্দিষ্ট ডেটা নির্বাচন এবং সেট করতে সহায়তা করে।

পিকার
ব্যবহারকারীদের একটি সীমিত সংখ্যক আইটেমের মধ্যে বেছে নিতে দেওয়ার জন্য বাছাইকারীদের ব্যবহার করা উচিত।
ডিফল্ট আইটেমগুলি উভয় দিকে অসীমভাবে লুপ করা হবে। তালিকায় ক্রম গুরুত্বপূর্ণ হলে এই আচরণটি অক্ষম করার কথা বিবেচনা করুন, অথবা ব্যবহারকারীদের দ্রুত সোয়াইপ করে প্রথম এবং শেষ উপাদানে পৌঁছানোর অনুমতি দিন৷
অ্যানাটমি

অ্যানাটমি
A. নিষ্ক্রিয় কলাম
B. কোলন ব্রেকার
C. পিকার কলাম
D. শীর্ষ সামগ্রী
E. মধ্যম বিষয়বস্তু
F. নীচের বিষয়বস্তু

প্রস্থ এবং উচ্চতা
পিকার গ্রুপ উপলব্ধ উচ্চতা এবং প্রস্থ পূরণ করে। পিকার কলামের জন্য চারটি লেআউট বিকল্প রয়েছে। প্রতিটি লেআউট কেন্দ্রীভূত এবং উপলব্ধ উচ্চতা পূরণ করে। কলামের প্রস্থগুলি ফন্টে প্রয়োজনীয় সংখ্যার সংখ্যা মিটমাট করার জন্য প্রয়োজনীয় প্রস্থ দ্বারা সংজ্ঞায়িত করা হয়, তারিখ-পিকার হল ব্যতিক্রম, অনুভূমিকভাবে এটি স্ক্রীনটি পূরণ করে এবং প্রান্ত থেকে রক্তপাত করে।
উদাহরণস্বরূপ সংখ্যাগুলি '00' এর প্রস্থের কাজ করবে এবং তারপর প্রস্থ নির্ধারণ করবে। টেক্সট ফিল্ডের জন্য, মাস ফিল্ডের জন্য উদাহরণস্বরূপ, 'MMM' এর প্রস্থ হিসাবে কাজ করা হবে (যা ল্যাটিন বর্ণমালার সবচেয়ে প্রশস্ত অক্ষর)। প্রস্থ এবং উচ্চতা (যা ব্যবহৃত সেই ধরনের শৈলীর লাইনের উচ্চতা) তাই ব্যবহৃত ফন্ট দ্বারা প্রভাবিত হবে।
বাছাইকারী আইটেম ব্রেকপয়েন্ট জুড়ে আকারে পরিবর্তিত হয়।
ব্যবহার
তারিখ এবং সময় বাছাইকারীদের নিম্নলিখিত উদাহরণগুলি দেখুন
একটি পূর্বনির্মাণ তারিখ এবং সময় চয়নকারী বাস্তবায়নের জন্য, Github-এ হরোলজিস্ট লাইব্রেরি দেখুন।
আপনি যদি একটি অনুরূপ অভিজ্ঞতা তৈরি করতে চান, যেখানে ব্যবহারকারীরা একাধিক বাছাইকারীদের মধ্যে একটি মাল্টি-পার্ট মান বেছে নেয়, বিল্ট-ইন পিকারগ্রুপ কম্পোনেন্ট ব্যবহার করুন। এই বস্তুটি সঠিক বাছাইকারী উপাদানে ফোকাস বরাদ্দ করতে একটি ফোকাস সমন্বয়কারী বস্তু ব্যবহার করে।
অভিযোজিত বিন্যাস
টাইমপিকার 24H
টাইমপিকার 12H
তারিখ পিকার
প্রতিক্রিয়াশীল আচরণ
পাঠ্যের আকার বৃদ্ধি
225+ ব্রেকপয়েন্ট পেরিয়ে গেলে পিকার এলিমেন্টের ফন্ট সাইজ পরিবর্তন হয়। অলস স্ক্রোলিং কলামের মধ্যে টপ এবং বটম কপি অ্যাডজাস্ট করে (A), যেমন মিডল কপি করে। নীচে এর কিছু উদাহরণ দেওয়া হল:
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 2
225 ডিপি ব্রেকপয়েন্টের উপরে
ফন্ট: ডিসপ্লে 1
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 3
225 ডিপি ব্রেকপয়েন্টের উপরে
হরফ: প্রদর্শন 2
গ্রেডিয়েন্ট আকার বৃদ্ধি
পিকার কলামের গ্রেডিয়েন্ট উপলব্ধ স্থান দ্বারা উচ্চতায় সংজ্ঞায়িত করা হয়। উপরের এবং নীচের উভয় গ্রেডিয়েন্ট উপলব্ধ উচ্চতার এক তৃতীয়াংশ (33%) এ সেট করা হয়েছে। এর মানে প্রতিটি উপলব্ধ স্ক্রীন আকারে, গ্রেডিয়েন্ট স্কেল আনুপাতিকভাবে। কলাম লেআউট থেকে স্বাধীনভাবে বসা।


225 ডিপি ব্রেকপয়েন্টের নিচে
আকার: কলামের উচ্চতার 33%
225 ডিপি ব্রেকপয়েন্টের উপরে
আকার: কলামের উচ্চতার 33%
কলামের ব্যবধান বৃদ্ধি
কলামের ব্যবধান 225+ ব্রেকপয়েন্ট অতিক্রম করে, হয় 2 ডিপি বা 4 ডিপি থেকে শুরু হয় এবং 6 ডিপি পর্যন্ত বৃদ্ধি পায়। আপনি কোন লেআউটটি নির্বাচন করেছেন তার উপর এটি নির্ভর করে; হয় 2 বা 3 কলাম লেআউট
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
4 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
2 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক
পিকার ব্যবহারকারীদের নির্দিষ্ট ডেটা নির্বাচন এবং সেট করতে সহায়তা করে।

পিকার
ব্যবহারকারীদের একটি সীমিত সংখ্যক আইটেমের মধ্যে বেছে নিতে দেওয়ার জন্য বাছাইকারীদের ব্যবহার করা উচিত।
ডিফল্ট আইটেমগুলি উভয় দিকে অসীমভাবে লুপ করা হবে। তালিকায় ক্রম গুরুত্বপূর্ণ হলে এই আচরণটি অক্ষম করার কথা বিবেচনা করুন, অথবা ব্যবহারকারীদের দ্রুত সোয়াইপ করে প্রথম এবং শেষ উপাদানে পৌঁছানোর অনুমতি দিন৷
অ্যানাটমি

অ্যানাটমি
A. নিষ্ক্রিয় কলাম
B. কোলন ব্রেকার
C. পিকার কলাম
D. শীর্ষ সামগ্রী
E. মধ্যম বিষয়বস্তু
F. নীচের বিষয়বস্তু

প্রস্থ এবং উচ্চতা
পিকার গ্রুপ উপলব্ধ উচ্চতা এবং প্রস্থ পূরণ করে। পিকার কলামের জন্য চারটি লেআউট বিকল্প রয়েছে। প্রতিটি লেআউট কেন্দ্রীভূত এবং উপলব্ধ উচ্চতা পূরণ করে। কলামের প্রস্থগুলি ফন্টে প্রয়োজনীয় সংখ্যার সংখ্যা মিটমাট করার জন্য প্রয়োজনীয় প্রস্থ দ্বারা সংজ্ঞায়িত করা হয়, তারিখ-পিকার হল ব্যতিক্রম, অনুভূমিকভাবে এটি স্ক্রীনটি পূরণ করে এবং প্রান্ত থেকে রক্তপাত করে।
উদাহরণস্বরূপ সংখ্যাগুলি '00' এর প্রস্থের কাজ করবে এবং তারপর প্রস্থ নির্ধারণ করবে। টেক্সট ফিল্ডের জন্য, মাস ফিল্ডের জন্য উদাহরণস্বরূপ, 'MMM' এর প্রস্থ হিসাবে কাজ করা হবে (যা ল্যাটিন বর্ণমালার সবচেয়ে প্রশস্ত অক্ষর)। প্রস্থ এবং উচ্চতা (যা ব্যবহৃত সেই ধরনের শৈলীর লাইনের উচ্চতা) তাই ব্যবহৃত ফন্ট দ্বারা প্রভাবিত হবে।
বাছাইকারী আইটেম ব্রেকপয়েন্ট জুড়ে আকারে পরিবর্তিত হয়।
ব্যবহার
তারিখ এবং সময় বাছাইকারীদের নিম্নলিখিত উদাহরণগুলি দেখুন
একটি পূর্বনির্মাণ তারিখ এবং সময় চয়নকারী বাস্তবায়নের জন্য, Github-এ হরোলজিস্ট লাইব্রেরি দেখুন।
আপনি যদি একটি অনুরূপ অভিজ্ঞতা তৈরি করতে চান, যেখানে ব্যবহারকারীরা একাধিক বাছাইকারীদের মধ্যে একটি মাল্টি-পার্ট মান বেছে নেয়, বিল্ট-ইন পিকারগ্রুপ কম্পোনেন্ট ব্যবহার করুন। এই বস্তুটি সঠিক বাছাইকারী উপাদানে ফোকাস বরাদ্দ করতে একটি ফোকাস সমন্বয়কারী বস্তু ব্যবহার করে।
অভিযোজিত বিন্যাস
টাইমপিকার 24H
টাইমপিকার 12H
তারিখ পিকার
প্রতিক্রিয়াশীল আচরণ
পাঠ্যের আকার বৃদ্ধি
225+ ব্রেকপয়েন্ট পেরিয়ে গেলে পিকার এলিমেন্টের ফন্ট সাইজ পরিবর্তন হয়। অলস স্ক্রোলিং কলামের মধ্যে টপ এবং বটম কপি অ্যাডজাস্ট করে (A), যেমন মিডল কপি করে। নীচে এর কিছু উদাহরণ দেওয়া হল:
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 2
225 ডিপি ব্রেকপয়েন্টের উপরে
ফন্ট: ডিসপ্লে 1
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
হরফ: প্রদর্শন 3
225 ডিপি ব্রেকপয়েন্টের উপরে
হরফ: প্রদর্শন 2
গ্রেডিয়েন্ট আকার বৃদ্ধি
পিকার কলামের গ্রেডিয়েন্ট উপলব্ধ স্থান দ্বারা উচ্চতায় সংজ্ঞায়িত করা হয়। উপরের এবং নীচের উভয় গ্রেডিয়েন্ট উপলব্ধ উচ্চতার এক তৃতীয়াংশ (33%) এ সেট করা হয়েছে। এর মানে প্রতিটি উপলব্ধ স্ক্রীন আকারে, গ্রেডিয়েন্ট স্কেল আনুপাতিকভাবে। কলাম লেআউট থেকে স্বাধীনভাবে বসা।


225 ডিপি ব্রেকপয়েন্টের নিচে
আকার: কলামের উচ্চতার 33%
225 ডিপি ব্রেকপয়েন্টের উপরে
আকার: কলামের উচ্চতার 33%
কলামের ব্যবধান বৃদ্ধি
কলামের ব্যবধান 225+ ব্রেকপয়েন্ট অতিক্রম করে, হয় 2 ডিপি বা 4 ডিপি থেকে শুরু হয় এবং 6 ডিপি পর্যন্ত বৃদ্ধি পায়। আপনি কোন লেআউটটি নির্বাচন করেছেন তার উপর এটি নির্ভর করে; হয় 2 বা 3 কলাম লেআউট
দুই কলাম লেআউট


225 ডিপি ব্রেকপয়েন্টের নিচে
4 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক
তিন কলাম বিন্যাস


225 ডিপি ব্রেকপয়েন্টের নিচে
2 dp কলাম ফাঁক
225 ডিপি ব্রেকপয়েন্টের উপরে
6 dp কলাম ফাঁক