অ্যাপ বার এবং হেডার কম্পোনেন্ট হল অ্যাপ ক্যানভাসের শীর্ষে একটি ডেডিকেটেড বার যা গুরুত্বপূর্ণ অ্যাপ-সম্পর্কিত ফাংশন যেমন ব্র্যান্ডিং, টপ-লেভেল নেভিগেশন এবং অ্যাপ কন্ট্রোলে অ্যাক্সেস দেখানোর জন্য কাস্টমাইজ করা যেতে পারে।
UI জুড়ে একটি আদর্শ অবস্থানে ইন-অ্যাপ অনুসন্ধানের মতো কী নিয়ন্ত্রণগুলি রাখতে সামঞ্জস্যপূর্ণ অ্যাপ বার এবং হেডার লেআউট ব্যবহার করুন।
অ্যানাটমি
অ্যাপ বার এবং হেডারে বিভিন্ন উপাদান অন্তর্ভুক্ত থাকতে পারে। এটি এই যে কোনও উপায়ে কনফিগার করা যেতে পারে:
- অ্যাপ শিরোনাম: অ্যাপ শিরোনাম হিসাবে কনফিগার করা হলে, উপাদানটিতে আইকন এবং বোতামগুলির ন্যূনতম ব্যবহার সহ ঐচ্ছিক পাঠ্যের জন্য স্থান থাকে। সাধারণত, এটিতে একটি স্ক্রিন শিরোনাম এবং পিছনের তীর অন্তর্ভুক্ত থাকে।
- অ্যাপ বার: অ্যাপ বার হিসেবে কনফিগার করা হলে, এতে আইকন, ট্যাব এবং বোতাম অন্তর্ভুক্ত থাকতে পারে। সাধারণ উপাদানগুলির মধ্যে একটি অ্যাপ আইকন এবং নেভিগেশন বিকল্পগুলি অন্তর্ভুক্ত থাকে।
এই সংস্করণগুলির যেকোনো একটিতে অ্যাপ নিয়ন্ত্রণও অন্তর্ভুক্ত থাকতে পারে, যেমন অ্যাপ-মধ্যস্থ অনুসন্ধান এবং সেটিংস।
![অ্যাপ বার এবং হেডার অ্যানাটমি](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-anatomy-1.png?authuser=0&hl=bn)
1. পিছনের তীর
2. পর্দার শিরোনাম
3. বোতাম
4. অ্যাপ নিয়ন্ত্রণ
5. অ্যাপ আইকন
6. প্রাথমিক নেভিগেশন (ট্যাব)
স্পেসিক্স - অ্যাপ বার
প্রাথমিক নেভিগেশন সহ অ্যাপ বার - কেন্দ্র সারিবদ্ধ
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-8.png?authuser=0&hl=bn)
প্রাথমিক নেভিগেশন সহ অ্যাপ বার - বাম প্রান্তিককৃত
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-7.png?authuser=0&hl=bn)
প্রাইমারি নেভিগেশন সহ অ্যাপ বার - ভেঙে পড়েছে (ট্যাবের পরিবর্তে ড্রয়ার)
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-9.png?authuser=0&hl=bn)
স্পেসিক্স - অ্যাপ হেডার
কেন্দ্রীভূত শিরোনাম সহ অ্যাপ শিরোনাম
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-1.png?authuser=0&hl=bn)
একক অ্যাপ নিয়ন্ত্রণ সহ অ্যাপ শিরোনাম
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-2.png?authuser=0&hl=bn)
একাধিক অ্যাপ নিয়ন্ত্রণ সহ অ্যাপ শিরোনাম
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-3.png?authuser=0&hl=bn)
একক বোতাম সহ অ্যাপ হেডার
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-4.png?authuser=0&hl=bn)
একাধিক বোতাম সহ অ্যাপ হেডার
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-5.png?authuser=0&hl=bn)
টেক্সট ওভারফ্লো সহ অ্যাপ হেডার
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-6.png?authuser=0&hl=bn)
স্বতন্ত্র ট্যাব বার সহ অ্যাপ হেডার
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-spec-10.png?authuser=0&hl=bn)
কাস্টমাইজেশন
অ্যাপ বার এবং হেডারের ভিজ্যুয়াল চেহারা পরিবর্তন করে OEMগুলি তাদের ব্র্যান্ডকে প্রতিফলিত করতে পারে। পরিবর্তন অন্তর্ভুক্ত হতে পারে:
- কাস্টম আইকন
- কাস্টম ফন্ট
- সক্রিয়, নিষ্ক্রিয় এবং অক্ষম বোতামগুলির উপস্থিতি সেট করা
- বোতামের মাত্রা এবং স্থান নির্ধারণ করা
ডিজাইন সিস্টেম লেআউট, রঙ, টাইপোগ্রাফি এবং সাইজিং ব্যবহার করে উপাদানগুলি কাস্টমাইজ করার জন্য নির্দেশিকা প্রদান করে।
উদাহরণ
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-mock-1.png?authuser=0&hl=bn)
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-mock-2.png?authuser=0&hl=bn)
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-mock-3.png?authuser=0&hl=bn)
![](https://developers.google.cn/cars/design/automotive-os/components/images/app-bar-mock-4.png?authuser=0&hl=bn)