একটি বোতাম তৈরি করুন

বাটন ব্যবহারকারীকে একটি নির্দিষ্ট কাজ শুরু করার সুযোগ দেয়। বাটন পাঁচ প্রকারের হয়:

প্রকার

চেহারা

উদ্দেশ্য

ভরা

নিরেট পটভূমিতে বৈসাদৃশ্যপূর্ণ লেখা।

'সাবমিট' এবং 'সেভ'-এর মতো প্রধান কাজগুলোর জন্য। শ্যাডো ইফেক্টটি বাটনটির গুরুত্ব তুলে ধরে।

টোনাল

পৃষ্ঠতলের সাথে সামঞ্জস্য রেখে পটভূমির রঙ পরিবর্তিত হয়।

প্রাথমিক বা গুরুত্বপূর্ণ কাজগুলোর জন্য। ভরাট বাটনগুলো দৃষ্টি আকর্ষণ করে এবং 'কার্টে যোগ করুন' ও 'সাইন ইন'-এর মতো কাজের জন্য উপযুক্ত।

উন্নত

ছায়া এটিকে আরও স্পষ্ট করে তোলে।

প্রাথমিক বা গুরুত্বপূর্ণ কাজের জন্য। বাটনটিকে আরও সুস্পষ্ট করতে এর উচ্চতা বাড়ান।

রূপরেখা

এর একটি বর্ডার রয়েছে, কিন্তু তাতে কোনো ফিল নেই।

যে কাজগুলো গুরুত্বপূর্ণ কিন্তু প্রধান নয়, সেগুলোর জন্য। আউটলাইন করা বাটনগুলো অন্যান্য বাটনের সাথে ভালোভাবে কাজ করে 'বাতিল' বা 'ফিরে যান'-এর মতো বিকল্প, গৌণ কাজগুলো নির্দেশ করতে।

পাঠ্য

পটভূমি বা বর্ডারবিহীন লেখা।

কম গুরুত্বপূর্ণ কাজ যেমন নেভিগেশনাল লিঙ্ক, অথবা গৌণ কাজ যেমন 'আরও জানুন' বা 'বিস্তারিত দেখুন'-এর জন্য।

সংস্করণ সামঞ্জস্যতা

এই বাস্তবায়নের জন্য আপনার প্রোজেক্টের minSDK অবশ্যই API লেভেল ২১ বা তার বেশি হতে হবে।

নির্ভরশীলতা

একটি ভরাট বোতাম তৈরি করুন

ফিল্ড বাটন কম্পোনেন্টটি বেসিক Button কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি সলিড রঙ দিয়ে ফিল করা থাকে।

ফলাফল

বেগুনি পটভূমিতে একটি ভরাট বাটন, যাতে 'filled' লেখা রয়েছে।
চিত্র ১. একটি ভরাট বোতাম।

একটি ভরাট টোনাল বাটন তৈরি করুন

ফিল্ড টোনাল বাটন কম্পোনেন্টটি FilledTonalButton কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি টোনাল রঙ দিয়ে পূর্ণ থাকে।

ফলাফল

হালকা বেগুনি পটভূমির একটি টোনাল বাটন, যাতে 'filled' লেখা রয়েছে।
চিত্র ২. একটি টোনাল বাটন।

একটি আউটলাইন বোতাম তৈরি করুন

আউটলাইনড বাটন কম্পোনেন্টটি OutlinedButton কম্পোজেবল ব্যবহার করে। এটি ডিফল্টরূপে একটি আউটলাইনসহ প্রদর্শিত হয়।

ফলাফল

একটি স্বচ্ছ, রেখাঙ্কিত বোতাম যার চারপাশে গাঢ় বর্ডার এবং তাতে 'Outlined' লেখা রয়েছে।
চিত্র ৩. একটি রেখাচিত্রযুক্ত বোতাম।

একটি উন্নত বোতাম তৈরি করুন

এলিভেটেড বাটন কম্পোনেন্টটি ElevatedButton কম্পোজেবল ব্যবহার করে। ডিফল্টরূপে এতে একটি শ্যাডো থাকে যা এলিভেশন ইফেক্টটি উপস্থাপন করে এবং এটি শ্যাডোসহ একটি আউটলাইনযুক্ত বাটন হিসেবে প্রদর্শিত হয়।

ফলাফল

ধূসর পটভূমিতে একটি উঁচু বোতাম, যাতে 'Elevated' লেখা রয়েছে।
চিত্র ৪. একটি উঁচু বোতাম।

একটি টেক্সট বাটন তৈরি করুন

টেক্সট বাটন কম্পোনেন্টটি TextButton কম্পোজেবল ব্যবহার করে। ক্লিক না করা পর্যন্ত, এটি শুধুমাত্র টেক্সট হিসেবে প্রদর্শিত হয়। ডিফল্টরূপে এতে কোনো সলিড ফিল বা আউটলাইন থাকে না।

ফলাফল

একটি টেক্সট বাটন যাতে লেখা আছে 'টেক্সট বাটন'
চিত্র ৫. একটি টেক্সট বাটন।

মূল বিষয়গুলো

  • onClick : ব্যবহারকারী বাটনটি চাপলে এই ফাংশনটি কল করা হয়।
  • enabled : যখন false হয়, এই প্যারামিটারটি বাটনটিকে অনুপলব্ধ এবং নিষ্ক্রিয় হিসেবে দেখায়।
  • colors : ButtonColors এর একটি ইনস্ট্যান্স যা বাটনে ব্যবহৃত রংগুলো নির্ধারণ করে।
  • contentPadding : বাটনের ভেতরের প্যাডিং।

যে সংগ্রহগুলিতে এই নির্দেশিকাটি রয়েছে

এই নির্দেশিকাটি বিশেষভাবে নির্বাচিত কুইক গাইড সংকলনগুলোর একটি অংশ, যা অ্যান্ড্রয়েড ডেভেলপমেন্টের বৃহত্তর লক্ষ্যগুলো পূরণ করে:

জানুন কীভাবে কম্পোজেবল ফাংশন ব্যবহার করে ম্যাটেরিয়াল ডিজাইন সিস্টেমের উপর ভিত্তি করে সহজেই সুন্দর UI কম্পোনেন্ট তৈরি করা যায়।

কোনো প্রশ্ন বা মতামত থাকলে

আমাদের প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী পেজে গিয়ে সংক্ষিপ্ত নির্দেশিকাগুলো সম্পর্কে জানুন অথবা আমাদের সাথে যোগাযোগ করে আপনার মতামত জানান।