خود آموز ساخت Bottom Navigation در اندروید

خود آموز ساخت Bottom Navigation در اندرویدReviewed by مهرخ on Nov 24Rating: 5.0خود آموز ساخت Bottom Navigation در اندرویدBottom navigation به ما کمک می کند که به راحتی از بین بازدید های اخیر یک مورد را انتخاب کنیم.

خود آموز ساخت Bottom Navigation در اندروید

Bottom navigation یکی از آپشن های جدید material design است و شبیه همان tapbar است که در ios دیده اید و کاربردی تقریبا یکسان دارند.

zzz xxx

 

 

 

 

 

 

 

قبل از آموزش اجازه دهید navigation bottom  را توصیف کنیم.

Bottom navigation چیست؟

Bottom navigation به ما کمک می کند که به راحتی از بین بازدید های اخیر یک مورد را انتخاب کنیم.

این به شما کمک می کند تا بتوانید از navigation drawer ،به جای  bottom navigation استفاده کنید.اگر چهار آیتم level navigation  دارید از bottom navigation استفاده کنید در غیر این صورت از همان navigation drawer استفاده کنید. چون نمیخواهیم که محیط bottom navigation خیلی شلوغ شود.

در چه مواقعی از bottom navigation استفاده کنیم؟

در مواقعی که بین سه تا پنج top-level destinations با اولویت یکسان دارید ممکن است تب ها یکم گیچ کننده بشوند اما نگران نباشید.

با توجه به تعداد navigation item  هایی که نیاز دارم یک call ایجاد می کنم .بزارید این را با مثال نشان دهم:

به صفحه play store نگاه کنید الان باید از بین شش تا تب یکی را انتخاب کنم:

ccc

این هم صفحه ی اصلی play store است:

 

home screen

اگر به عکس نگاه کنید می بینید که گزینه هاای این صفحه هم مانند tab هستند اما نمی تونیم بین آنها swipe کنیم که این یه نمونه از موارد استفاده ی bottom navigation است.

توجه داشته باشید که navigation drawer را می توانید در تمام صفحات استفاده کنید کافی ست تا از گوشه ی چپ صفحه swipe کنید.

 

شروع کار:

با وجود همه ی این تعاریف باید بگم که ظاهر bottom navigation بسیار خوب است.

خب پس بزارید شروع کنیم.

به فایل build.gradle ،  library’s dependency را اضافه کنید:

توجه : این library تنها مدل minSDK 14 و ورژن های بالاتر از آن را پشتیبانی می کند.

در مرحله ی بعد Bottom Navigation layout را به xml اضافه کنید:

[/code]
FrameLayout  با fram ID یک ،placeholder UI که فرگمنت را بارگزاری می کند.

 

Action plan

  1. آیتم ها را بسازید:

به تعدادی که می خواهید آیتم بسازید.colors[]  یک String Array که حاوی کدهای رنگی ست.

  1. آیتم ها را به bottom navigation اضافه کنید:

 

  1. طراحی اش کنید:

[code]

 

[/code]

  1. Listener را تنظیم کنید:

در اخر باید به item click گوش دهید تا بتوانید تغییرات لازم را برای فرگمنت ایجاد کنید.

[code]

 

[/code]

در قسمت وسط fragment layout یک card layout دارم و با توجه به item click ها رنگش را تغیر می دهم.

بهتر است که فرگمنت را تغییر دهید. این کار بسیار شبیه ساخت navigation drawer است.

افزودن فرگمنت

می توانید یک فرگمنت ساده اضافه کنید و در FrameLayout بار گذاری اش کنید.

[code]

 

[/code]

با استفاده از کد زیر می توانید فرگمنت ها را جا به جا کنید:

نتیجه ی نهایی

الان تب های bottom navigation آماده شده است برنامه را اجرا کنید:

 

OUTPUT

 

پاسخ دهید