ایجاد RTL NavigationDrawer در API قبل از 17

[ADMIN]

خوب اول از همه باید بگم که با امکانات پیشفرض اندروید، نمیتونیم RTL رو توی اندروید قبل از نسخه 17 اجرا کنیم. توی نسخه‌های 17 و بعد از اون کافیه که برنامه رو RTL کنیم (توی مانیفست) و کار دیگری لازم نیست. این آموزش برای API قبل از 17 هست.

اول از همه یه پروژه میسازیم. مراحل اینکار توی تصاویر زیر مشخصه:

با اجرای این برنامه، خروجی شبیه تصویر زیر خواهد شد:

حالا میریم سراغ تغییرات. اول از همه یه آیکن واسه دکمه نمایش منو دانلود میکنیم. من از تصویر زیر استفاده کردم:

خوب حالا باید اول از همه، توی فایل activity_main.xml دو تا تغییر ایجاد کنیم. این تغییرات توی تگهای زیر هستن (بقیه فایل رو دست نمیزنیم) :

<android.support.v4.widget.DrawerLayout ...
   tools:openDrawer="right">

...

   <android.support.design.widget.NavigationView ...
       android:layout_gravity="right"
       ... />

...

درواقع ما فقط خصوصیات tools:openDrawer و android:layout_gravity رو از start به right تغییر میدیم. با این کار دیگه موقع اجرای برنامه، اگه با Swipe از راست به چپ صفحه انگشتتون رو بکشین، منو از سمت راست ظاهر میشه. ولی اگه روی دکمه منو بالای صفحه (Toolbar) کلیک کنید، برنامه با خطا بسته میشه:

برای رفع این مشکل باید تولبار رو کمی تغییر بدیم. من فرض کردم که تصویری که دانلود کردین واسه دکمه نمایش منو رو توی پوشه drawable کپی کردین. حالا باید توی فایل app_bar_main.xml کد تولبار رو به شکل زیر در بیارین:

<android.support.v7.widget.Toolbar
   android:id="@+id/toolbar"
   android:layout_width="match_parent"
   android:layout_height="?attr/actionBarSize"
   android:background="?attr/colorPrimary"
   app:popupTheme="@style/AppTheme.PopupOverlay">

   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:gravity="center_vertical"
       android:orientation="horizontal">

       <TextView
           android:id="@+id/txtTitle
           android:layout_width="0dp"
           android:layout_height="wrap_content"
           android:layout_weight="1"
           android:text="@string/app_name"
           android:textColor="@android:color/white"
           android:textSize="20sp" />

       <ImageView
           android:id="@+id/imgDrawer"
           android:layout_width="96dp"
           android:layout_height="match_parent"
           android:contentDescription="@string/app_name"
           android:src="@drawable/toggle" />
   </LinearLayout>
</android.support.v7.widget.Toolbar>

حالا میریم سراغ MainActivity.java و این تغییرات رو داخلش اعمال میکنیم:

اول از همه این خطوط رو حذف کنید:

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();

و حالا این کدها رو بجای اونها بنویسید:

final DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ImageView imgDrawer = (ImageView) toolbar.findViewById(R.id.imgDrawer);
imgDrawer.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View view) {
       if (drawer.isDrawerOpen(Gravity.RIGHT)) {
           drawer.closeDrawer(Gravity.RIGHT);
       } else {
           drawer.openDrawer(Gravity.RIGHT);
       }
   }
});

در نهایت باید هرچی توی برنامه GravityCompact.START دیدین، با Gravity.RIGHT جایگزین کنین. الان برنامه درست کار میکنه. فقط یه کار دیگه مونده که اجباری نیست و من خودم بیشتر اینطوری میپسندم. اونم اینه که بازشدن منو، نوار Toolbar رو مخفی نکنه. برای اینکار توی فایل activity_main.xml به تگ android.support.design.widget.NavigationView این خاصیت رو اضافه کنید:

android:layout_marginTop="?attr/actionBarSize"

الان وقتی منو باز میشه توی اندروید 4 این شکلی میشه:

اما توی اندروید 5 و 6 این مدلی اجرا میشه:

همونطور که میبینید، یه سایه روی منو (جایی که با فلش مشخص شده) افتاده. برای حل این مشکل باید برنامه رو FullScreen کنیم. این سایه بخاطر نوار Notification اندروید ایجاد میشه. برای فول‌اسکرین کردن برنامه توی فایل values/styles.xml این خاصیت رو به استایل AppTheme اضافه کنید:

<style name="AppTheme" ...>
   <item name="android:windowFullscreen">true</item>
   ...
</style>

الان برنامه درست اجرا میشه:

امیدوارم این آموزش براتون مفید باشه.