استخدم ثيم DayNight في تطبيقك

كما هي عادة تحديث مكتبات support تفاجئنا باضافات جميلة ولعل من اهم هذه الاضافات الجديدة في تحديث رقم 23.2 هو اضافة theme جديد وهو DayNight 

وتقوم فكرة هذا الثيم على جعل التطبيق لديك يدعم الوضع اليلي وايضا الوضع العادي بسرعه وبشكل جميل .

مع اصدار المكتبة تمت اضافة resources جديدة باسم Night ويمكن استخدامها بهذا الشكل :

  • drawable-night – وتكون هنا الصور و التصاميم الخاصة بالوضع الليلي.
  • values-night : هنا اذا اردت استخدام عناصر خاصة بالوضع الليل من الوان و themes ونصوص.

وقيس على بقية ملفات resources .

الان سنبدأ في تطبيق لاضافة الوضع الليلي :

  • اضافة مكتبة appcompat :

dependencies {
    compile 'com.android.support:appcompat-v7:23.2.0'
}

انشاء مجلد خاص بالوضع الليلي :

نعرف جميعاً ان من ملفات resources للاندرويد يوجد مجلد باسم values ويكون بداخلة المصفوفات والالوان والثيمات .

الان سنقوم باضافة هذا المجلد الجديد باسم values-night وسنقوم باضافة الثيم الخاص بالوضع اليلي والالون مع ملاحظة ان الالوان يفضل ان تكون بنفس الاسم 

lمثال :

/res/values

يكون داخلة ملف الالوان وعلى سبيل المثال سيكون اللون باسم

    <color name="colorPrimary">#673AB7</color>

سيكون هذا اللون بنفس الاسم داخل ملف الالوان في مجلد values-night  مثال

/res/values-night

يكون اللون بنفس الاسم ولكن القيمة متغيرة بما يناسب الوضع الليلي في تطبيقك

    <color name="colorPrimary">#911037</color>

 

  • تهيئة الثيم او styles :

داخل الوضع العادي سيكون الثيم بهذا الشكل :

<resources>

    <style name="AppTheme.DayNight" parent="Theme.AppCompat.DayNight">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="AppTheme.DayNight.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

    <!-- make the title in action bar always be white-->
    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
        <item name="android:textColorPrimary">@color/abc_primary_text_material_dark</item>
    </style>


</resources>

اما بالنسبة للوضع الليلي فسيكون بهذا الشكل :

<resources>>

    <style name="AppTheme.DayNight.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
    </style>

</resources>
  • تفعيل الكود في Java :

  • استخدام Applications:

بداية سنحتاج الـى انشاء كلاس Application جديد كما في الكود القادم :

public class App extends Application {

    static {
        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_AUTO);
    }
}

عند اضافة هذا السطر فسيتم تنفيذه على جميع الشاشات في التطبيق وتتكون AppCompatDelgate على عدة انواع :

  • MODE_NIGHT_NO. دائما يكون الوضع العادي “الابيض” في جميع الاوقات.
  • MODE_NIGHT_YES. دائما يكون على الوضع الليلي.
  • MODE_NIGHT_AUTO. هنا يتغير بناءاً على الوقت “ليل/نهار”.
  • MODE_NIGHT_FOLLOW_SYSTEM (default).هنا يعتمد على ثيم نفس الجهاز اذا ليلي او نهار .

 

  •  استخدام الـActivity :

نستطيع تغيير الثيم من داخل الاكتيفيتي مباشرة وذلك بكتابة الكود التالي :

 getDelegate().setLocalNightMode(AppCompatDelegate.MODE_NIGHT_YES);
            recreate();

السطر الاول يمثل وضع الثيم اما بالنسبة للسطر الاخر فهو يقوم باعادة انشاء الاكتيفيتي حتى يتم تفعيل الاكتيفيتي .

تعتبر هذه المميزة من اهم الاضافات المضافة اخيراً للاندرويد بحكم ان الوضع الليلي موجود في النظام ولكن بشكل مخفي ربما سيكشف عنه قريباً .

وصلنا الى نهاية الدرس اتمنى اكون وفقت في طرح المفيد باذن الله 

  • المشروع :

https://github.com/ahmedoid/DayNight

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

فكرتين عن“استخدم ثيم DayNight في تطبيقك”

  1. السلام عليكم،

    شرح ولا أروع أخوي أحمد، لكن نحتاج نحفظ الاختيار الجديد للثيم في SharedPreferences؛ حتى إذا طلعنا من التطبيق ورجعنا، ما يتغيّر الثيم للثيم الأساسي.