Navigation Drawer یا منوی کشویی چیست؟

Navigation Drawer , Sliding Menu یا منوی کشویی به لایه‌هایی گفته می‌شود که منوی اصلی اپلیکیشن را نمایش می‌دهد. این منو در حالت عادی از دید کاربر مخفی است که با کشیدن صفحه به سمت راست یا در برنامه‌هایی که به زبان فارسی هستند به سمت چپ و یا لمس آیکن موجود در تولبار یا اکشن بار، ظاهر می‌شود. منو کشویی از یک Header و Menu تشکیل می‌شود. Navigation Drawer توسط اندروید معرفی شده و به راحتی قابل پیاده سازی می‌باشد.

آموزش ساخت منو کشویی کاستوم در سمت راست اندروید

در اندروید منوکشویی همیشه در سمت چپ وجود داره و راست چین یا rtl کردن این لایه کمی سخت است. از طرفی بخاطر نوع ساختار مادر Navigation Drawer این لایه دارای محدودیت‌های ظاهری می‌باشد و خیلی قابل تغییر نمی‌باشد. برای تمام این مشکلات یک راه خیلی ساده هستش. شما باید منو کشویی را به صورت دستی بسازید تا در سمت راست و هرشکلی که شما دوست دارید باشد.

مرحله اول:

ابتدا یک لایه جدید برای طراحی منو کشویی یا همبرگرمنو می‌سازیم.

مرحله دوم:

فرقی نمی کنه که لایه روت چی باشه در اینجا من از LinearLayout استفاده کردم؛ شما می‌تونید از هرچیز دیگه‌ای استفاده کنید، اما توجه داشته باشید که باید مقدار width لایه ایجاد شده را برابر با 300dp یا هر مقداری به غیر از match parent قرار میدهیم. (توجه کنید که این مقدار در واقع سایز Navigation Drawer یا همان منوی کشویی ما هستش که بر روی صفحه‌های دیگر می‌آید)

مرحله سوم:

خاصیت gravity این لایه را می‌توانید با توجه به اینکه در کدام سمت صفحه بخواهید باشد برابر با end یا start قرار دهید البته توجه داشته باشید که در برنامه‌های دو زبانه جای آن تغییر می‌کند. (اگر می‌خواهید لایه در هردو زبان در یک جهت قرار بگیرد بهتر است که از مقادیر right یا left استفاده کنید)

مرحله چهارم:

حالا می‌توانید ویوهای لازم و مورد نیاز خود را در این صفحه طراحی و جای گذاری کنید.

در اینجا من اول در داخل ConstrainLayout یک RelativeLayout گذاشتم که در مرکز اون لایه TextView هستش و بعد از اون از لایه‌های LinearLayout استفاده کردم برای آیتم‌های منوکشویی.

مرحله پنجم:

در این مرحله بعد از اتمام طراحی به صفحه‌ی اصلی برنامه که در اینجا activity_main می‌باشد برمی‌گردیم و لایه مادر یا اصلی صفحه را به DrawerLayout تغییر می‌دیم تا بتواند صفحه‌ای که به عنوان منو کشویی کاستوم طراحی کردیم را در خود نمایش دهد.

مرحله ششم:

حالا صفحه‌ی طراحی شده را از طریق دستور include در صفحه‌ی اصلی فراخوانی می‌کنیم.

<include layout=&quot@layout/nav_drawer&quot />

مرحله هفتم:

الان شما به تمام ویو‌های صفحه طراحی شده در صفحه اصلی و کلاس جاوا دسترسی دارید و می‌توانید برای آن‌ها رویداد تعریف کنید. (توجه داشته باشید که برای دسترسی به ویو‌ها باید برای آن‌ها آیدی تعریف کرده باشید)

در ادامه ما قصد داریم دکمه یا ویویی را تعریف کنیم که می‌خوایم با زدن بر روی اون منوی کشویی ما نمایش داده بشه. روش اصولی این هست که ما بیایم این دکمه در قسمت اکشن بار یا تولبار تعریف کنیم تا با زدن روی اون دکمه همبرگر منوی ما ظاهر بشه.

مرحله هشتم:

حالا در کلاس جاوا برای عمل دکمه‌ای که تعریف کردیم آن کلیک تعریف می‌کنیم و دستورات زیر رو می‌نویسیم.

ImageView menu = findViewById(R.id.img_menu);
menu.setListener(new View.Listener() {
public void (View v) {
DrawerLayout drawerLayout = findViewById(R.id.drawerlayout);
if (drawerLayout.isDrawerOpen(Gravity.RIGHT))
drawerLayout.closeDrawer(Gravity.LEFT);
else
drawerLayout.openDrawer(Gravity.RIGHT);
}
});

توجه داشته باشید که این منو کشویی کاستوم را می‌توانید در همه‌ی صفحات خود داشته باشید و برای اینکار باید مرحله‌ی هفتم و هشتم را مجدداً در اکتیویتی‌های دیگر انجام دهید. با این روش خیلی ساده می‌تونید یک منو کشویی در سمت راست داده باشید.

در ادامه نحوه عملکرد آیتم‌های همبرگر منو را برای شما توضیح میدم که به چه صورت هستش.

همانطور که گفته شد شما بعد از include کردن ویو در صفحه اصلی به تمام آیتم‌ها دسترسی دارید و با فراخوانی آیدی آیتم‌ها می‌توانید برای آن‌ها عملکردهای متفاوتی تعریف کنید. به عنوان مثال در عکس زیر من میخوام برای آیتم اول منوی کشویی تعریف کنم، زمانی که روش کلیک شد به اکتیویتی دیگه بره (در اینجا برای مثال به Main2Activity میره)

LinearLayout item1 = findViewById(R.id.nav_item1);
item1.setListener(new View.Listener() {
@Override
public void (View v) {
startActivity(new Intent(MainActivity.this, Main2Activity.class));
}
});

شما می‌تونید به همین صورت برای بقیه آیتم‌های منو خودتون این عمل رو تکرار کنید.

پیشنهاد میکنم مقاله اندازه قلم در طراحی را نیز بخوانید. نکات جالب و مهمی در مورد اندازه قلم خواهید آموخت.