DayNight实现日夜间模式

最新推荐文章于 2024-12-02 09:48:44 发布

原创最新推荐文章于 2024-12-02 09:48:44 发布 · 1.3k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

这篇博客介绍了两种在Android中实现DayNight日夜间模式切换的方法。第一种方法通过示例图展示日间和夜间模式的效果，并给出了主界面布局及相关代码。第二种方法则通过在values目录下创建日间和夜间模式的资源文件来实现切换。

有两种方式进行切换日夜间模式

第一种

先上示例图

日间模式夜间模式

主界面布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <Button
        android:id="@+id/change_theme_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:onClick="onClick"
        android:text="?attr/textContent"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:text="Hello World!xinbaba"
        android:textColor="?attr/textColorValue"
        />

    <TextView
        android:textColor="?attr/textColorValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text="Hello World!lixin" />

    <TextView
        android:textColor="?attr/textColorValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text="Hello World!xiaoxinxin" />


</LinearLayout>

Values

arrts（文件中定义了控件的所有属性以及所用控件的声明）

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <attr name="textColorValue" format="color"></attr>
    <attr name="textContent" format="string"></attr>

</resources>

colors（当中定义各种颜色值。）

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <color name="background">#252a2e</color>
    <color name="unablebtn">#dcdcdc</color>
    <color name="dark_bg">#505050</color>
    <color name="light">#ECECEC</color>
    <color name="white">#FFFFFF</color>
    <color name="black">#000000</color>
    <color name="green">#05D992</color>
    <color name="zise">#E5004F</color>
    <color name="dark_bg1">#414141</color>
    <color name="pink">#FF5877</color>
    <color name="yellow">#FFFF00</color>
</resources>

strings（当中定义使用到的字符串常量。）

<resources>
    <string name="app_name">DayNightOne</string>
    <string name="change_to_night">切换成夜间模式</string>
    <string name="change_to_day">切换成日间模式</string>

</resources>

styles（对所有控件的属性值进行了设定）

<resources>

    <!-- Base application theme. 白天的模式 -->  注意这个 因为改变了name 记得在AndroidManifest中修改
    <style name="day_theme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:windowBackground">@color/white</item>
        <!--日间模式对应的字体颜色 和日间模式对应的文本内容-->
        <item name="textColorValue">@color/black</item>
        <item name="textContent">@string/change_to_night</item>
    </style>
    <!-- Base application theme. 夜晚的模式 -->
    <style name="night_theme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/dark_bg</item>
        <item name="colorPrimaryDark">@color/dark_bg</item>
        <item name="colorAccent">@color/dark_bg</item>
        <item name="android:windowBackground">@color/dark_bg</item>
        <!--夜间模式对应的字体颜色 和夜间模式对应的文本内容-->
        <item name="textColorValue">@color/white</item>
        <item name="textContent">@string/change_to_day</item>
    </style>

</resources>

下面贴代码

Mainactivity

package com.example.lixin.daynightone;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
/**
 * 第一种实现夜间模式  用设置主题的方式
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        //设置对应的主题 ，在ui创建好之后设置主题无效，所以要放到setContentView（）方法前面setTheme()
        ThemeUtil.onActivityCreatedSetTheme(this);
        setContentView(R.layout.activity_main);

    }
    public void onClick(View view){
        //切换日夜间模式
        ThemeUtil.ChangeCurrentTheme(this);

    }
}

ThemeUtil

package com.example.lixin.daynightone;

import android.app.Activity;
import android.content.Intent;
import android.preference.PreferenceManager;

/**
 * Created by hua on 2017/8/7.
 */

public class ThemeUtil {
    //我当前应用的主题
    private static  int theme =0;
    //日间模式主题
    private static  final int DAY_THEME = 0;
    //夜间模式主题
    private static final int NIGHT_THEME = 1;

    public static void onActivityCreatedSetTheme(Activity activity){


        switch (theme){
            case DAY_THEME:
                activity.setTheme(R.style.day_theme);
                break;
            case NIGHT_THEME:
                activity.setTheme(R.style.night_theme);
                break;
        }
    }
    //点击按钮改变对应得主题
    public static void ChangeCurrentTheme(Activity activity){

        //1、改变当前主题的theme变量
        switch (theme){
            case DAY_THEME:
                theme = NIGHT_THEME;
                break;
            case NIGHT_THEME:
                theme = DAY_THEME;
                break;
        }
        //2、重启这个activity
        activity.finish();
        //加一个动画
        activity.overridePendingTransition(R.anim.sliding_in,R.anim.sliding_out);
        activity.startActivity(new Intent(activity,activity.getClass()));

    }

}

最后为了美观加了一个动画(在res里创建一个anim)

sliding_in

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromAlpha="0.0"
    android:toAlpha="1.0"></alpha>

sliding_out

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:toAlpha="0.0"
    android:fromAlpha="1.0"></alpha>

以上是第一种方法接下来介绍第二种方法：

示例图

日间模式夜间模式

主界面布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <Button
        android:text="@string/change_to_content"
        android:id="@+id/change_theme_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:gravity="center_horizontal"
        android:onClick="onClick"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:text="Hello World!"
        android:textColor="@color/main_textView"
         />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textColor="@color/main_textView"
        android:text="Hello World!" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textColor="@color/main_textView"
        android:text="Hello World!" />
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher"
        />
</LinearLayout>

这个方法创建了两个values 一个是日间模式的一个是夜间模式的

values - colors

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <color name="main_textView">#FF0000</color> 字体颜色
</resources>

values - strings

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">DayNightTwo</string>
    <string name="change_to_content">切换成夜间模式</string>
</resources>

values - styles

<resources>

    <!-- Base application theme. -->             一定要注意这个 继承这个
    <style name="AppTheme" parent="Theme.AppCompat.DayNight.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

values - night - colors

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <color name="colorPrimary">#35464e</color>
    <color name="colorPrimaryDark">#212a2f</color>
    <color name="colorAccent">#212a2f</color>

    <color name="main_textView">#00FF00</color>

</resources>

values - night - strings

<resources>

    <string name="app_name">DayNightTwo</string>
    <string name="change_to_content">切换成日间模式</string>

</resources>

下面贴代码

Mainactivity

package com.example.lixin.daynighttwo;

import android.content.res.Configuration;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.app.AppCompatDelegate;
import android.view.View;

/**
 * 优雅的实现日夜间模式，第二种实现日间模式的方式
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void onClick(View view){
        //切换日夜间模式

        int uiMode;
        uiMode = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
        switch (uiMode){
            case Configuration.UI_MODE_NIGHT_YES:
                AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO);
                getSharedPreferences("theme",MODE_PRIVATE).edit().putBoolean("night_theme",false).commit();

                break;
            case Configuration.UI_MODE_NIGHT_NO:
                AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES);
                getSharedPreferences("theme",MODE_PRIVATE).edit().putBoolean("night_theme",true).commit();

                break;
        }
        //重建
        recreate();
    }
}

MyApplication

package com.example.lixin.daynighttwo;

import android.app.Application;
import android.support.v7.app.AppCompatDelegate;

/**
 * Created by hua on 2017/8/7.
 */

public class MyApplication extends Application {

    @Override
    public void onCreate() {
        super.onCreate();
        if (getSharedPreferences("theme",MODE_PRIVATE).getBoolean("night_theme",false)){

            AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES);

        }
    }
}