AndroidSDK Support自帶夜間、日間模式切換詳解

版權聲明:轉載必須註明本文轉自嚴振杰的博客: http://blog.yanzhenjie.com

轉載前寫在前面的話,現在APP已經不是過去的模式了,要儘可能的做到人性化才能吸引用戶,日夜間皮膚切換感覺被應用的十分廣泛,但是這篇博客卻寫出來基本的實現思路,那就是利用系統自帶的style樣式實現日夜皮膚切換。雖然只有日和夜兩個模式切換,畢竟實現思路在這裏,你可以修改style來實現。感覺嚴大大的博客被我轉了好幾篇了,下次再找點剛好點乾貨給大家準備過冬。

人總是在接近幸福時倍感幸福,在幸福進行時卻患得患失。


——— 張愛玲

人總是患得患失,無聊發表下感慨,不廢話了,下面是乾貨。








寫這篇博客的目的就是教大家利用AndroidSDK自帶的support lib來實現APP日間/夜間模式的切換,最近看到好多帖子在做關於這個日夜間模式切換的開源項目,其實AndroidSDK Support中已經有了非常好的支持了。

本文demo下載地址在文章的末尾,看完文檔如果還不能實現可以下載玩玩。


效果演示

左是Android 4.1的效果,右是Android 6.0的效果。 
Android 4.1的效果 Android 6.0的效果

實現步驟

我就以我的demo爲例,需要修改Style,需要針對Day/Night設置不同的Style或者Color,切換模式在Java代碼中實現。

首先需要新建一個項目,選擇初始的Activity時選擇BaseActivity。

一、依賴appcompat庫

在app module的gradle中依賴appcompat庫,版本最低爲23.2.0:

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

今天博客切換日間夜間模式的原理是切換style,因爲我們的頁面中引用了各種style,所以我們只要爲定義不同style就可以了,粗略的瀏覽下我們的佈局頁面:

<?xml version="1.0" encoding="utf-8"?><android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.yanzhenjie.daynight.MainActivity">

    <android.support.design.widget.AppBarLayout        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <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" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

    <android.support.design.widget.FloatingActionButton        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" /></android.support.design.widget.CoordinatorLayout>1234567891011121314151617181920212223242526272829303132333412345678910111213141516171819202122232425262728293031323334

二、修改style

打開res/values/styles.xml,把原來的:

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

改爲:

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

也就是把Light改爲DayNightDayNight這個主題或者它的子主題才支持白夜間模式的切換。

三、爲不同的模式寫不同的colors

我們注意到上面的AppTheme這個主題下其實是設置了三個顏色,這裏簡單實現一個效果,我們就修改這三個顏色即可,在res下新建一個values-night的文件夾:

values-night

這裏先要說明一下這個文件夾的作用,我們的默認模式一般是日間模式,所以系統會讀取values中的值,當我們切換到夜間模式時會讀取values-night下的值,不論是style還是color。所以我們簡單的替換顏色,那就新建colors.xml,我們先看下values中的colors.xml:

values中的colors

然後我們把values中的colors.xml文件複製到values-night中,並且修改下顏色:

values-night中的colors

我這裏簡單把深藍改爲淺藍,把玫紅改爲金黃。

OK,styel和color到這裏就技術了,下面就是Java代碼切換模式了。

Java代碼控制日間夜間模式

首先因爲這個功能來自support-appcompat,所以我們的Activity是繼承的AppCompatActivity的。

下面的三種模式都可以用在初始化、或者顯式調用:

第一種,自動模式,如果我們app有定位權限、網絡權限等,系統可以自動確實現在是晚上還是白天,當用戶打開APP時會自動切換到響應的模式,這個模式我們可以在APP初始化或者Application中用一個靜態代碼快來設置:

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

第二種,日間模式,調用後需要調用Activity的recreate()方法:

getDelegate().setLocalNightMode(AppCompatDelegate.MODE_NIGHT_NO);
recreate();1212

第三種,夜間模式,調用後需要調用Activity的recreate()方法:

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

好了,非常粗魯,就是這麼簡單,完了咯。

總結

  1. 如果你要實現的比較複雜,就不單單是在values-night中設置不同的顏色了,你也可以建不同的style,給不同的view引用。

  2. 需要注意的兩個地方,一是app或者activity引用的style需要是Theme.AppCompat.DayNight或者它的子style,二是調用getDelegate().setLocalNightMode()你的Activity必須是繼承AppCompatActivity的。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章