前言:
1.主题切换需要了解 attr 和?attr的区别,style的使用,intent对象的flag ,SharedPreferences和enum
的使用。
2.需要准备日夜对应控件颜色配置。
步骤:
1.创建light theme和Dark Theme。
2.创建SharePreferenceManager
3.编写配置类,切换和保存主题。
4.在需要切换的地方使用intent对象flag实现切换
一。创建light theme和Dark Theme
<!--==================light theme==================--> <style name="LightTheme.Base" parent="AppTheme.Base"> <item name="colorPrimary">@color/light_principle</item> <item name="colorPrimaryDark">@color/light_state_bar</item> <item name="android:listDivider">@color/light_divider</item> <item name="hint">@color/light_hint</item> <item name="horizontal_divider">@color/light_divider</item> <item name="tab_item_selected">@color/light_tab_item_selected</item> <item name="tab_item_unselected">@color/light_tab_item_unselected</item> <item name="tab_item_underline">@color/light_tab_item_underline</item> <item name="list_view_background">@color/light_list_item_background</item> <item name="main_list_item_title">@color/light_main_list_item_title</item> <item name="main_list_item_content">@color/light_main_list_item_title</item> <item name="main_list_item_username">@color/light_main_list_item_username</item> <item name="main_list_item_time">@color/light_main_list_item_title</item> <item name="main_list_item_background">@drawable/selector_light_list_item</item> <item name="main_list_item_comment_count">@color/light_main_list_item_title</item> <item name="drawer_header_background">@color/light_drawer_header_background</item> <item name="drawer_header_username">@color/light_drawer_header_username</item> <item name="drawer_header_abilities">@color/light_drawer_header_abilities</item> <item name="drawer_header_abilities_background">@color/light_drawer_header_abilities_background</item> <item name="drawer_header_skill_score">@color/light_drawer_header_skill_score</item> <item name="drawer_container_background">@color/light_drawer_container_background</item> <item name="drawer_container_menu_text">@color/light_drawer_container_menu_text</item> <item name="drawer_container_menu">@drawable/selector_light_drawer_menu</item> <item name="func_loading_text">@color/light_func_loading_text</item> <item name="refresh_progress_background">@color/light_refresh_progress_background</item> <item name="detail_title_background">@color/light_detail_title_background</item> <item name="detail_title_text">@color/light_detail_title_text</item> <item name="detail_header_username">@color/light_detail_header_username</item> <item name="detail_header_other">@color/light_detail_header_other</item> <item name="detail_header_background">@color/light_detail_header_background</item> <item name="detail_content_text">@color/light_detail_content_text</item> <item name="detail_content_background">@color/light_detail_content_background</item> <item name="detail_footer_text">@color/light_detail_footer_text</item> <item name="detail_footer_background">@drawable/selector_light_detail_footer_item</item> <item name="comment_list_item_username">@color/light_comment_list_item_username</item> <item name="comment_list_item_time">@color/light_comment_list_item_time</item> <item name="comment_list_item_content">@color/light_comment_list_item_content</item> <item name="comment_list_item_background">@drawable/selector_light_list_item</item> <item name="comment_list_item_refer_background">@drawable/shape_light_refer_item</item> <item name="comment_list_item_refer_title">@color/light_comment_list_item_refer_title</item> <item name="comment_list_item_refer_content">@color/light_comment_list_item_refer_content</item> <item name="comment_list_item_refer_border">@color/light_comment_list_item_refer_border</item> <item name="keyboard_panel_background">@color/light_keyboard_panel_background</item> <item name="keyboard_emotion_tab_item_background">@drawable/selector_light_emotion_item</item> <item name="keyboard_emotion_tab_item_text">@color/light_keyboard_emotion_tab_item_text</item> <item name="keyboard_input_text">@color/light_keyboard_input_text</item> <item name="tweet_list_item_username">@color/light_tweet_list_item_username</item> <item name="tweet_list_item_content">@color/light_tweet_list_item_content</item> <item name="tweet_list_item_highlight">@color/light_tweet_list_item_highlight</item> <item name="tweet_list_item_other">@color/light_tweet_list_item_other</item> <item name="tweet_list_item_background">@drawable/selector_light_list_item</item> <item name="tweet_list_item_like_list_background">@color/light_tweet_list_item_like_list_background</item> <item name="tweet_comment_list_item_username">@color/light_tweet_comment_list_item_username</item> <item name="tweet_comment_list_item_content">@color/light_tweet_comment_list_item_content</item> <item name="tweet_comment_list_item_time">@color/light_tweet_comment_list_item_time</item> <item name="tweet_comment_list_item_background">@drawable/selector_light_list_item</item> <item name="tweet_floating_action_button_background_unselected">@color/light_tweet_floating_action_button_background_unselected</item> <item name="tweet_floating_action_button_background_selected">@color/light_tweet_floating_action_button_background_selected</item> <item name="tweet_floating_action_button_plus">@color/light_tweet_floating_action_button_plus</item> <item name="tweet_floating_action_button_item_background_unselected">@color/light_tweet_floating_action_button_item_background_unselected</item> <item name="tweet_floating_action_button_item_background_selected">@color/light_tweet_floating_action_button_item_background_selected</item> <item name="tweet_floating_cover">@color/light_tweet_floating_cover</item> <item name="login_background">@color/light_login_background</item> <item name="login_form_username">@color/light_login_form_username</item> <item name="login_form_password">@color/light_login_form_password</item> <item name="login_form_hint">@color/light_login_form_hint</item> <item name="login_form_error">@color/light_login_form_error</item> <item name="login_text">@color/light_login_text</item> <item name="dialog_opinion_background">@drawable/selector_light_opinion_item</item> <item name="dialog_text">@color/light_dialog_text</item> <item name="tweet_publish_editor_background">@color/light_tweet_publish_editor_background</item> <item name="tweet_publish_editor_text">@color/light_tweet_publish_editor_text</item> <item name="tweet_publish_emotion_navigation">@color/light_tweet_publish_emotion_navigation</item> <item name="user_home_username">@color/light_user_home_username</item> <item name="user_home_join_time">@color/light_user_home_join_time</item> <item name="user_home_coordinate">@color/light_user_home_coordinate</item> <item name="user_home_statistic">@color/light_user_home_statistic</item> <item name="user_home_statistic_border">@color/light_user_home_statistic_border</item> <item name="user_home_blow_background">@color/light_user_home_blow_background</item> <item name="user_home_blow_row">@color/light_user_home_blow_row</item> <item name="user_home_blow_label">@color/light_user_home_blow_label</item> <item name="user_home_blow_label_value">@color/light_user_home_blow_label_value</item> <item name="user_home_blow_label_value_background">@drawable/shape_light_user_home_label_value</item> </style>
<!--======================Dark Theme========================--> <style name="DarkTheme.Base" parent="AppTheme.Base"> <item name="colorPrimary">@color/dark_principle</item> <item name="colorPrimaryDark">@color/dark_state_bar</item> <item name="android:listDivider">@color/dark_divider</item> <item name="hint">@color/dark_hint</item> <item name="horizontal_divider">@color/dark_divider</item> <item name="tab_item_selected">@color/dark_tab_item_selected</item> <item name="tab_item_unselected">@color/dark_tab_item_unselected</item> <item name="tab_item_underline">@color/dark_tab_item_underline</item> <item name="list_view_background">@color/dark_list_item_background</item> <item name="main_list_item_title">@color/dark_main_list_item_title</item> <item name="main_list_item_content">@color/dark_main_list_item_content</item> <item name="main_list_item_username">@color/dark_main_list_item_username</item> <item name="main_list_item_time">@color/dark_main_list_item_time</item> <item name="main_list_item_background">@drawable/selector_dark_list_item</item> <item name="main_list_item_comment_count">@color/dark_main_list_item_comment_count</item> <item name="drawer_header_background">@color/dark_drawer_header_background</item> <item name="drawer_header_username">@color/dark_drawer_header_username</item> <item name="drawer_header_abilities">@color/dark_drawer_header_abilities</item> <item name="drawer_header_abilities_background">@color/dark_drawer_header_abilities_background</item> <item name="drawer_header_skill_score">@color/dark_drawer_header_skill_score</item> <item name="drawer_container_background">@color/dark_drawer_container_background</item> <item name="drawer_container_menu_text">@color/dark_drawer_container_menu_text</item> <item name="drawer_container_menu">@drawable/selector_dark_drawer_menu</item> <item name="func_loading_text">@color/dark_func_loading_text</item> <item name="refresh_progress_background">@color/dark_refresh_progress_background</item> <item name="detail_title_background">@color/dark_detail_title_background</item> <item name="detail_title_text">@color/dark_detail_title_text</item> <item name="detail_header_username">@color/dark_detail_header_username</item> <item name="detail_header_other">@color/dark_detail_header_other</item> <item name="detail_header_background">@color/dark_detail_header_background</item> <item name="detail_content_text">@color/dark_detail_content_text</item> <item name="detail_content_background">@color/dark_detail_content_background</item> <item name="detail_footer_text">@color/dark_detail_footer_text</item> <item name="detail_footer_background">@drawable/selector_dark_detail_footer_item</item> <item name="comment_list_item_username">@color/dark_comment_list_item_username</item> <item name="comment_list_item_time">@color/dark_comment_list_item_time</item> <item name="comment_list_item_content">@color/dark_comment_list_item_content</item> <item name="comment_list_item_background">@drawable/selector_dark_list_item</item> <item name="comment_list_item_refer_background">@drawable/shape_dark_refer_item</item> <item name="comment_list_item_refer_title">@color/dark_comment_list_item_refer_title</item> <item name="comment_list_item_refer_content">@color/dark_comment_list_item_refer_content</item> <item name="comment_list_item_refer_border">@color/dark_comment_list_item_refer_border</item> <item name="keyboard_panel_background">@color/dark_keyboard_panel_background</item> <item name="keyboard_emotion_tab_item_background">@drawable/selector_dark_emotion_item</item> <item name="keyboard_emotion_tab_item_text">@color/dark_keyboard_emotion_tab_item_text</item> <item name="keyboard_input_text">@color/dark_keyboard_input_text</item> <item name="tweet_list_item_username">@color/dark_tweet_list_item_username</item> <item name="tweet_list_item_content">@color/dark_tweet_list_item_content</item> <item name="tweet_list_item_highlight">@color/dark_tweet_list_item_highlight</item> <item name="tweet_list_item_other">@color/dark_tweet_list_item_other</item> <item name="tweet_list_item_background">@drawable/selector_dark_list_item</item> <item name="tweet_list_item_like_list_background">@color/dark_tweet_list_item_like_list_background</item> <item name="tweet_comment_list_item_username">@color/dark_tweet_comment_list_item_username</item> <item name="tweet_comment_list_item_content">@color/dark_tweet_comment_list_item_content</item> <item name="tweet_comment_list_item_time">@color/dark_tweet_comment_list_item_time</item> <item name="tweet_comment_list_item_background">@drawable/selector_dark_list_item</item> <item name="tweet_floating_action_button_background_unselected">@color/dark_tweet_floating_action_button_background_unselected</item> <item name="tweet_floating_action_button_background_selected">@color/dark_tweet_floating_action_button_background_selected</item> <item name="tweet_floating_action_button_plus">@color/dark_tweet_floating_action_button_plus</item> <item name="tweet_floating_action_button_item_background_unselected">@color/dark_tweet_floating_action_button_item_background_unselected</item> <item name="tweet_floating_action_button_item_background_selected">@color/dark_tweet_floating_action_button_item_background_selected</item> <item name="tweet_floating_cover">@color/dark_tweet_floating_cover</item> <item name="login_background">@color/dark_login_background</item> <item name="login_form_username">@color/dark_login_form_username</item> <item name="login_form_password">@color/dark_login_form_password</item> <item name="login_form_hint">@color/dark_login_form_hint</item> <item name="login_form_error">@color/dark_login_form_error</item> <item name="login_text">@color/dark_login_text</item> <item name="dialog_opinion_background">@drawable/selector_dark_opinion_item</item> <item name="dialog_text">@color/dark_dialog_text</item> <item name="tweet_publish_editor_background">@color/dark_tweet_publish_editor_background</item> <item name="tweet_publish_editor_text">@color/dark_tweet_publish_editor_text</item> <item name="tweet_publish_emotion_navigation">@color/dark_tweet_publish_emotion_navigation</item> <item name="user_home_username">@color/dark_user_home_username</item> <item name="user_home_join_time">@color/dark_user_home_join_time</item> <item name="user_home_coordinate">@color/dark_user_home_coordinate</item> <item name="user_home_statistic">@color/dark_user_home_statistic</item> <item name="user_home_statistic_border">@color/dark_user_home_statistic_border</item> <item name="user_home_blow_background">@color/dark_user_home_blow_background</item> <item name="user_home_blow_row">@color/dark_user_home_blow_row</item> <item name="user_home_blow_label">@color/dark_user_home_blow_label</item> <item name="user_home_blow_label_value">@color/dark_user_home_blow_label_value</item> <item name="user_home_blow_label_value_background">@drawable/shape_dark_user_home_label_value</item> </style> <style name="LightTheme" parent="LightTheme.Base"> </style> <style name="DarkTheme" parent="DarkTheme.Base"> </style>
二。创建SharePreferenceManager和配置类,切换和保存主题
public static SharedPreferences getApplicationSetting(Context context){ return context.getSharedPreferences(ApplicationSetting.FILE_NAME, Context.MODE_PRIVATE); } /** * 应用配置首选项, 保存主题...一些系统级别的配置 */ public static class ApplicationSetting{ public static final String FILE_NAME = "APPLICATION_SETTING"; public static final String KEY_THEME = "KEY_THEME"; // ---主题列举--- public enum ApplicationTheme{ LIGHT(1, R.style.LightTheme), DARK(2, R.style.DarkTheme); private int key; private int resId; ApplicationTheme(int key, int resId){ this.key = key; this.resId = resId; } public int getKey() { return key; } public int getResId() { return resId; } } }
三。在需要切换的地方使用intent对象flag实现切换
SharedPreferences preferences = SharePreferenceManager.getApplicationSetting(this); int theme = preferences.getInt(SharePreferenceManager.ApplicationSetting.KEY_THEME, SharePreferenceManager.ApplicationSetting.ApplicationTheme.LIGHT.getKey()); SharedPreferences.Editor editor = preferences.edit(); if (theme == SharePreferenceManager.ApplicationSetting.ApplicationTheme.LIGHT.getKey()){ editor.putInt(SharePreferenceManager.ApplicationSetting.KEY_THEME, SharePreferenceManager.ApplicationSetting.ApplicationTheme.DARK.getKey()); }else{ editor.putInt(SharePreferenceManager.ApplicationSetting.KEY_THEME, SharePreferenceManager.ApplicationSetting.ApplicationTheme.LIGHT.getKey()); } editor.apply(); finish(); Intent intent = getIntent(); intent.putExtra(CHANGE_THEME, true); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK | Intent.FLAG_ACTIVITY_CLEAR_TASK); startActivity(intent); overridePendingTransition(R.anim.enter, R.anim.exit);
enter:
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"> <alpha android:fromAlpha="0" android:toAlpha="1" android:duration="1000"/> </set>
exit:
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"> <alpha android:fromAlpha="1" android:toAlpha="0" android:duration="1000"/> </set>
xml布局文件引用style颜色:
测拉菜单:
<?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="@dimen/drawer_height" android:orientation="vertical" android:background="?attr/drawer_header_background" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin"> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp"> <de.hdodenhof.circleimageview.CircleImageView android:id="@+id/iv_portrait" android:layout_width="70dp" android:layout_height="70dp" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" android:layout_alignParentTop="true" android:contentDescription="@null" android:src="@mipmap/icon_default_portrait" /> <ImageView android:id="@+id/iv_exit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:layout_alignParentRight="true" android:contentDescription="@null" android:src="@mipmap/icon_exit" /> </RelativeLayout> <TextView android:id="@+id/tv_nick" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:drawablePadding="5dp" android:textColor="?attr/drawer_header_username" android:textSize="@dimen/drawer_header_username" /> <TextView android:id="@+id/tv_score" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.support.v7.widget.LinearLayoutCompat>
toolbar:
<android.support.design.widget.CoordinatorLayout android:id="@+id/layout_coordinator" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:id="@+id/layout_actionbar" android:layout_width="match_parent" android:layout_height="wrap_content" app:elevation="0dp"> <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/ThemeOverlay.AppCompat.Light"> </android.support.v7.widget.Toolbar> </android.support.design.widget.AppBarLayout>
总结:
这个方法思路简单,颜色配置有些麻烦,适用于小中型项目开发。