Android實現黑白主題切換

1:建立兩種主題模式android

    <style name="AppTheme" parent="Base.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="color_bg_main">@color/color_bg_main_light</item>
        <item name="text_style">@style/Text_light_style</item>
        <item name="second_text_style">@style/second_text_style_light</item>
    </style>git

    <style name="ThemeLight" parent="AppTheme">github

    </style>ide

    <style name="ThemeDark" parent="Base.Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">@color/color_primary</item>
        <item name="colorPrimaryDark">@color/color_primary_dark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="color_bg_main">@color/color_bg_main_drak</item>
        <item name="text_style">@style/Text_dark_style</item>
        <item name="second_text_style">@style/second_text_style_dark</item>
    </style>
   <style name="Text_light_style">
        <item name="android:textColor">@color/color_white</item>
        <item name="android:background">@color/color_black</item>
    </style>this

    <style name="Text_dark_style">
        <item name="android:textColor">@color/color_black</item>
        <item name="android:background">@color/color_white</item>
    </style>
    <style name="second_text_style_light">
        <item name="android:textColor">@color/color_white</item>
        <item name="android:background">@color/color_black</item>
        <item name="android:text">@string/text_intent_light</item>
    </style>
    <style name="second_text_style_dark">
        <item name="android:textColor">@color/color_black</item>
        <item name="android:background">@color/color_white</item>
        <item name="android:text">@string/text_intent_drak</item>
    </style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
那麼其中的一些text_style,second_text_style應該在哪定義呢???.net

第二步:定義自定義屬性orm

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <attr name="color_bg_main" format="color|reference"/>
    <attr name="text_style" format="reference"/>
    <attr name="second_text_style" format="reference"/>
</resources>
1
2
3
4
5
6
定義完成以後須要引用纔有效果,如何引用呢???xml

第三步:應用樣式blog

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="?attr/color_bg_main"
    android:padding="16dp"
    tools:context="com.example.themechangeandroid.MainActivity">utf-8

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

        <TextView
            android:id="@+id/tv_light"
            style="?attr/text_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="left"
            android:padding="16dp"
            android:text="@string/text_light" />

        <TextView
            android:id="@+id/tv_dark"
            style="?attr/text_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            android:gravity="left"
            android:padding="16dp"
            android:text="@string/text_dark" />

        <TextView
            android:id="@+id/tv_intent"
            style="?attr/text_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            android:gravity="left"
            android:padding="16dp"
            android:text="@string/text_intent" />
    </LinearLayout>

</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
activity_second.xml實現

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="?attr/color_bg_main"
    tools:context="com.example.themechangeandroid.SecondActivity">

    <TextView
        style="?attr/second_text_style"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="16dp"
         />
</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
經過?attr/ 去引用樣式

第四步:切換主題

應用某個主題的時候,在setContentView方法以前纔有效果,即以下設置主題

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        ThemeUtil.setTheme(this);
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        findViewById(R.id.tv_light).setOnClickListener(this);
        findViewById(R.id.tv_dark).setOnClickListener(this);
        findViewById(R.id.tv_intent).setOnClickListener(this);
    }
1
2
3
4
5
6
7
8
9
設想,咱們須要把全部界面統一設置主題,那麼每一個Activity都須要調用 ThemeUtil.setTheme(this);修改以後如何知道當前是何主題呢?

能夠設置一個標誌,保存到本地,當每打開一個界面時,須要根據標誌位來設置主題,以下

 public static void setTheme(@NonNull Activity activity) {
        boolean isLight = PrefsUtils.read(activity, Config.THEME_CONFIG, true);
        activity.setTheme(isLight ? R.style.ThemeLight : R.style.ThemeDark);
    }
1
2
3
4
當切換主題的時候,如何修改當前頁面主題呢?上述咱們知道,setTheme在setContentView以前調用,除非咱們從新走oncrete方法,不然沒法刷新本頁面主題樣式,咱們能夠調用recreate方法,重走oncrete方法,原理是銷燬並從新建立當前Activity。

public static void reCreate(@NonNull final Activity activity) {
        activity.runOnUiThread(new Runnable() {
            @Override
            public void run() {
                activity.recreate();
            }
        });

    }
1
2
3
4
5
6
7
8
9
當點擊切換時,須要先修改保存標誌位,而後調用recrete方法

 @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.tv_light:
                PrefsUtils.write(this,Config.THEME_CONFIG,true);
                ThemeUtil.reCreate(this);
                break;
            case R.id.tv_dark:
                PrefsUtils.write(this,Config.THEME_CONFIG,false);
                ThemeUtil.reCreate(this);
                break;
            case R.id.tv_intent:
                Intent intent=new Intent(MainActivity.this,SecondActivity.class);
                startActivity(intent);
                break;

        }
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
而後獲得以下效果:

代碼地址:

github代碼地址

參考資料:https://github.com/TakWolf/CNode-Material-Desig ———————————————— 版權聲明:本文爲CSDN博主「隔壁小王66」的原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處連接及本聲明。 原文連接:https://blog.csdn.net/qq_16131393/article/details/77480315

相關文章
相關標籤/搜索