একসাথে, স্ট্যাটাস বার, ক্যাপশন বার এবং নেভিগেশন বারকে সিস্টেম বার বলা হয়। এগুলি ব্যাটারি স্তর, সময় এবং বিজ্ঞপ্তি সতর্কতার মতো গুরুত্বপূর্ণ তথ্য প্রদর্শন করে এবং যেকোনো জায়গা থেকে সরাসরি ডিভাইসের সাথে ইন্টারঅ্যাকশন প্রদান করে।
আপনি অ্যান্ড্রয়েড ওএস, ইনপুট পদ্ধতি, বা অন্যান্য ডিভাইস ক্ষমতার সাথে ইন্টারঅ্যাকশনের জন্য UI ডিজাইন করছেন কিনা, সিস্টেম বারগুলির গুরুত্ব বিবেচনা করা অত্যন্ত গুরুত্বপূর্ণ।
টেকওয়েস
আপনার অ্যাপ ডিজাইন করার সময় সিস্টেম বার অন্তর্ভুক্ত করুন। UI নিরাপদ অঞ্চল, সিস্টেম ইন্টারঅ্যাকশন, ইনপুট পদ্ধতি, ডিসপ্লে কাটআউট, স্ট্যাটাস বার, ক্যাপশন বার, নেভিগেশন বার এবং অন্যান্য ডিভাইস ক্ষমতার জন্য অ্যাকাউন্ট করুন।
সিস্টেমের অবস্থা এবং নেভিগেশন বারগুলিকে স্বচ্ছ বা স্বচ্ছ রাখুন এবং এজ-টু-এজ করার জন্য এই বারগুলির পিছনে কন্টেন্ট আঁকুন।
স্ক্রিন স্পেস দক্ষতার সাথে ব্যবহার করে এমন ক্যানোনিকাল লেআউট ব্যবহার করুন।
স্ট্যাটাস বার
অ্যান্ড্রয়েডে, স্ট্যাটাস বারে নোটিফিকেশন আইকন এবং সিস্টেম আইকন থাকে। ব্যবহারকারী নোটিফিকেশন শেড অ্যাক্সেস করার জন্য স্ট্যাটাস বারটি নীচে টেনে তার সাথে ইন্টারঅ্যাক্ট করে। স্ট্যাটাস বারের স্টাইলগুলি স্বচ্ছ বা স্বচ্ছ হতে পারে।
স্ট্যাটাস বার আইকন
প্রেক্ষাপট, দিনের সময়, ব্যবহারকারীর পছন্দ বা থিম এবং অন্যান্য পরামিতির উপর নির্ভর করে স্ট্যাটাস বার আইকনগুলি ভিন্নভাবে প্রদর্শিত হতে পারে। আরও তথ্যের জন্য, সিস্টেম বার আইকন দেখুন।
যখন কোনও বিজ্ঞপ্তি আসে, তখন সাধারণত স্ট্যাটাস বারে একটি আইকন উপস্থিত হয়। এটি ব্যবহারকারীকে সংকেত দেয় যে বিজ্ঞপ্তি ড্রয়ারে দেখার মতো কিছু আছে। এটি আপনার অ্যাপ আইকন বা চ্যানেলটি উপস্থাপন করার প্রতীক হতে পারে। বিজ্ঞপ্তি নকশা দেখুন।
স্ট্যাটাস বার স্টাইল সেট করুন
আপনার অ্যাপের কন্টেন্ট পুরো স্ক্রিন জুড়ে যাতে থাকে তা নিশ্চিত করার জন্য স্ট্যাটাস বারটিকে স্বচ্ছ বা স্বচ্ছ করুন। তারপর, আপনার সিস্টেম বার আইকনগুলির স্টাইল সেট করুন যাতে আইকনগুলির সঠিক বৈসাদৃশ্য থাকে।
অ্যান্ড্রয়েড ১৫-তে এজ-টু-এজ প্রয়োগ করা হয়েছে যাতে স্ট্যাটাস বারটি ডিফল্টভাবে স্বচ্ছ থাকে। ব্যাকওয়ার্ড সামঞ্জস্যের জন্য enableEdgeToEdge() কল করুন।
নিচের বাম দিকের ছবিতে, স্ট্যাটাস বারটি স্বচ্ছ এবং TopAppBar এর সবুজ পটভূমি স্ট্যাটাস বারের পিছনে আঁকা।
যখন স্ট্যাটাস বারের নিচে UI দেখা না যায় অথবা স্ট্যাটাস বারের নিচে কোন ছবি আঁকা না যায়, তখন স্বচ্ছ স্ট্যাটাস বার আদর্শ। যখন UI স্ট্যাটাস বারের নিচে স্ক্রোল করে, তখন স্বচ্ছ স্ট্যাটাস বার আদর্শ। গ্রেডিয়েন্ট সুরক্ষা সম্পর্কে আরও জানতে এজ-টু-এজ ডিজাইন দেখুন।
ন্যাভিগেশন
অ্যান্ড্রয়েড ব্যবহারকারীদের ব্যাক, হোম এবং ওভারভিউ নিয়ন্ত্রণ ব্যবহার করে নেভিগেশন নিয়ন্ত্রণ করতে দেয়:
- পিছনে সরাসরি পূর্ববর্তী দৃশ্যে ফিরে আসে।
- অ্যাপ থেকে হোম স্ক্রিনে স্থানান্তরিত হয়।
- ওভারভিউতে সক্রিয় অ্যাপ এবং সাম্প্রতিক বাতিল করা অ্যাপগুলি দেখানো হয়।
ব্যবহারকারীরা বিভিন্ন নেভিগেশন কনফিগারেশন থেকে বেছে নিতে পারেন যার মধ্যে রয়েছে জেসচার নেভিগেশন এবং অ্যাডাপ্টিভ নেভিগেশন। সেরা অভিজ্ঞতা প্রদানের জন্য, একাধিক ধরণের নেভিগেশন বিবেচনা করুন।
অঙ্গভঙ্গি নেভিগেশন
জেসচার নেভিগেশনে ব্যাক, হোম এবং ওভারভিউয়ের জন্য বোতাম ব্যবহার করা হয় না, বরং এটি সামর্থ্যের জন্য একটি একক জেসচার হ্যান্ডেল দেখায়। ব্যবহারকারীরা স্ক্রিনের বাম বা ডান প্রান্ত থেকে সোয়াইপ করে পিছনে যেতে এবং নীচে থেকে উপরে যেতে ইন্টারঅ্যাক্ট করে। উপরে সোয়াইপ করে ধরে রাখলে ওভারভিউ খোলা হয়।
জেসচার নেভিগেশন হল মোবাইল এবং বৃহত্তর স্ক্রিন জুড়ে ডিজাইনের জন্য আরও স্কেলযোগ্য নেভিগেশন প্যাটার্ন। সর্বোত্তম ব্যবহারকারীর অভিজ্ঞতা প্রদানের জন্য, নিম্নলিখিতগুলি করে জেসচার নেভিগেশনের হিসাব করুন:
- প্রান্ত থেকে প্রান্তের কন্টেন্ট সমর্থন করে।
- অঙ্গভঙ্গি নেভিগেশন ইনসেটের অধীনে ইন্টারঅ্যাকশন বা স্পর্শ লক্ষ্য যোগ করা এড়িয়ে চলুন।
আরও তথ্যের জন্য, অঙ্গভঙ্গি নেভিগেশনের জন্য সমর্থন যোগ করুন দেখুন।
অভিযোজিত নেভিগেশন
অ্যান্ড্রয়েডে আরেকটি সাধারণ নেভিগেশন প্যাটার্ন হল স্ক্রিনের উইন্ডো সাইজ ক্লাসের উপর নির্ভর করে একটি নেভিগেশন রেল এবং একটি নেভিগেশন বারের মধ্যে স্যুইচ করা। জেটপ্যাক কম্পোজের অ্যাডাপ্টিভ নেভিগেশন উপাদানগুলি একাধিক ফর্ম ফ্যাক্টর পরিচালনা করে এবং সিস্টেম বারকে বিশৃঙ্খলা থেকে মুক্ত রাখে।
আরও তথ্যের জন্য, বিল্ড অ্যাডাপ্টিভ নেভিগেশন দেখুন।
নেভিগেশন আইকন
ব্যবহারকারীর পছন্দ বা থিমের উপর নির্ভর করে নেভিগেশন আইকনগুলি ভিন্নভাবে প্রদর্শিত হতে পারে। আরও তথ্যের জন্য, সিস্টেম বার আইকনগুলি দেখুন।
একটি নেভিগেশন স্টাইল সেট করুন
অ্যান্ড্রয়েড জেসচার নেভিগেশন মোড এবং বোতাম মোডে ইউজার ইন্টারফেসের ভিজ্যুয়াল সুরক্ষা পরিচালনা করে। সিস্টেমটি গতিশীল রঙ অভিযোজন প্রয়োগ করে, যেখানে সিস্টেম বারের বিষয়বস্তু তাদের পিছনের বিষয়বস্তুর উপর ভিত্তি করে রঙ পরিবর্তন করে।
অঙ্গভঙ্গি নেভিগেশন মোড
Android 15 টার্গেট করার পর অথবা Activity এ enableEdgeToEdge কল করার পর, সিস্টেমটি একটি স্বচ্ছ অঙ্গভঙ্গি নেভিগেশন বার আঁকে এবং গতিশীল রঙ অভিযোজন প্রয়োগ করে। নিম্নলিখিত উদাহরণে, নেভিগেশন বারের হ্যান্ডেলটি যদি আলোর উপরে রাখা হয় তবে এটি গাঢ় রঙে পরিবর্তিত হয় এবং বিপরীতভাবে।
স্বচ্ছ অঙ্গভঙ্গি নেভিগেশন বারগুলি সর্বদা সুপারিশ করা হয়।
কর
করো না
বোতাম মোড
Android 15 টার্গেট করার পর অথবা Activity এ enableEdgeToEdge কল করার পর, সিস্টেমটি বোতাম নেভিগেশন বারের পিছনে একটি ট্রান্সলুসেন্ট স্ক্রিম প্রয়োগ করে, যা আপনি Window.setNavigationBarContrastEnforced() false এ সেট করে মুছে ফেলতে পারেন।
যখন নিচের অ্যাপ বার বা নিচের অ্যাপ নেভিগেশন বার থাকে, অথবা যখন UI তিন বোতামের নেভিগেশন বারের নিচে স্ক্রোল না করে, তখন আমরা স্বচ্ছ তিন বোতামের নেভিগেশন বার ব্যবহার করার পরামর্শ দিই। স্বচ্ছ নেভিগেশন বার পেতে, Window.setNavigationBarContrastEnforced() কে false এ সেট করুন এবং নীচের অ্যাপ বারগুলিকে সিস্টেম নেভিগেশন বারের নিচে আঁকতে প্যাড করুন, যেমনটি চিত্র 7, 8 এবং 9 এ দেখানো হয়েছে। আরও তথ্যের জন্য সিস্টেম বার সুরক্ষা দেখুন।
কন্টেন্ট স্ক্রল করার জন্য একটি স্বচ্ছ তিন-বোতামের নেভিগেশন ব্যবহার করুন। স্বচ্ছ নেভিগেশন বারের বিবেচনা সম্পর্কে আরও জানতে, এজ-টু-এজ ডিজাইন দেখুন।
কীবোর্ড এবং নেভিগেশন
প্রতিটি নেভিগেশন টাইপ অন-স্ক্রিন কীবোর্ডের সাথে যথাযথভাবে প্রতিক্রিয়া দেখায় যাতে ব্যবহারকারী কীবোর্ডের ধরণ বাতিল করা বা এমনকি পরিবর্তন করার মতো কাজ করতে পারে। স্ক্রিনের নিচ থেকে উপরে এবং নীচে স্লাইড করার সাথে অ্যাপের ট্রানজিশনকে সিঙ্ক্রোনাইজ করে এমন একটি মসৃণ ট্রানজিশন নিশ্চিত করতে, WindowInsetsAnimationCompat ব্যবহার করুন।
লেআউট
অ্যাডাপ্টিভ লেআউটগুলি একটি অ্যাপের কন্টেন্ট প্রদর্শন করে যাতে এটি উপলব্ধ স্থানের সর্বোত্তম ব্যবহার করতে পারে। এই লেআউটগুলি কন্টেন্টকে সেকেন্ডারি বা টারশিয়ারি প্যানে স্থানান্তর করে UI ডিক্লাটার করে।
আরও তথ্যের জন্য, ক্যানোনিকাল লেআউট দেখুন।
কাটআউটগুলি প্রদর্শন করুন
ডিসপ্লে কাটআউট হল কিছু ডিভাইসের এমন একটি জায়গা যা ডিসপ্লে পৃষ্ঠের মধ্যে বিস্তৃত থাকে এবং সামনের দিকে মুখ করা সেন্সরগুলির জন্য জায়গা প্রদান করে। ডিসপ্লে কাটআউটগুলি নির্মাতার উপর নির্ভর করে পরিবর্তিত হতে পারে। ডিসপ্লে কাটআউটগুলি কীভাবে কন্টেন্ট, ওরিয়েন্টেশন এবং এজ-টু-এজ এর সাথে ইন্টারঅ্যাক্ট করবে তা বিবেচনা করুন।
ইমারসিভ মোড
যখন আপনার পূর্ণ-স্ক্রিন অভিজ্ঞতার প্রয়োজন হবে, উদাহরণস্বরূপ যখন ব্যবহারকারী কোনও সিনেমা দেখছেন, তখন আপনি সিস্টেম বার লুকাতে পারবেন। ব্যবহারকারীর এখনও সিস্টেম বারগুলি প্রকাশ করতে এবং নেভিগেট করতে বা সিস্টেম নিয়ন্ত্রণগুলির সাথে ইন্টারঅ্যাক্ট করতে সক্ষম হওয়া উচিত। পূর্ণ স্ক্রিন মোডগুলির জন্য ডিজাইন সম্পর্কে আরও জানুন, অথবা ইমারসিভ মোডের জন্য সিস্টেম বারগুলি কীভাবে লুকাবেন সে সম্পর্কে পড়ুন।