开源中国源码学习（五）——切换皮肤（日间模式和夜间模式）

在开源中国客户端源码的侧滑菜单栏里有一个模式切换的选项，可以完成夜间模式和日间模式的相互转换。

一、功能介绍

在侧滑菜单栏里点击日间或者夜间后，客户端的皮肤可以发生变化，来达到保护眼睛的作用。

二、详细介绍

这是在MainActivity的onCreate方法中的一段代码，这段代码完成了读取本地配置中存储的日间模式和夜间模式信息，从而回显到客户端中。

读取本地配置信息，在应用启动时，回显至客户端

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        if (AppContext.getNightModeSwitch()) {
            setTheme(R.style.AppBaseTheme_Night);
        } else {
            setTheme(R.style.AppBaseTheme_Light);
        }

        ......
    }

在上面代码中可以看到，各种皮肤的信息还是在Style中进行配置的

日间模式代码

   <!-- 日间模式 -->
    <style name="AppBaseTheme_Light" parent="@style/Theme.AppCompat.Light">
        <item name="colorPrimary">@color/day_colorPrimary</item>
        <item name="colorPrimaryDark">@color/day_colorPrimaryDark</item>
        <item name="android:textColorLink">#0b9a27</item>
        <item name="android:textColorPrimary">@color/white</item>
        <item name="editTextColor">@color/gray</item>
        <item name="actionBarPopupTheme">@style/ThemeOverlay.AppCompat.Dark</item>
        <item name="android:windowBackground">@color/window_background</item>
        <item name="actionMenuTextColor">@color/white</item>
        <item name="textColor">@color/day_textColor</item>
        <item name="infoTextColor">@color/day_infoTextColor</item>
        <item name="layout_bg_normal">@color/day_layout_bg_normal</item>
        <item name="lineColor">@color/day_line_color</item>
        <item name="windows_bg">@color/day_windows_bg</item>
        <item name="sliding_block_bg">@drawable/image_sliding_block</item>
        <item name="layout_item_bg">@drawable/day_list_item_background</item>
        <item name="android:editTextColor">@color/day_edit_color</item>
        <item name="android:textColorHint">@color/day_edit_hit_color</item>
        <item name="comment_reply_container_bg">@drawable/day_comment_reply_container_bg</item>
        <item name="message_bg_left">@drawable/chat_from_bg_normal</item>
        <item name="message_bg_right">@drawable/chat_to_bg_normal</item>

        <item name="quickoption_icon_text_selector">@drawable/day_quickoption_icon_text_selector</item>
        <item name="quickoption_icon_album_selector">@drawable/day_quickoption_icon_album_selector</item>
        <item name="quickoption_icon_photo_selector">@drawable/day_quickoption_icon_photo_selector</item>
        <item name="quickoption_icon_voice_selector">@drawable/day_quickoption_icon_voice_selector</item>
        <item name="quickoption_icon_scan_selector">@drawable/day_quickoption_icon_scan_selector</item>
        <item name="quickoption_icon_note_selector">@drawable/day_quickoption_icon_note_selector</item>
    </style>

夜间模式

 <!-- 夜间模式 -->
    <style name="AppBaseTheme_Night" parent="@style/Theme.AppCompat">
        <item name="colorPrimary">@color/night_colorPrimary</item>
        <item name="colorPrimaryDark">@color/night_colorPrimaryDark</item>
        <item name="android:textColorLink">@color/night_colorPrimary</item>
        <item name="android:windowBackground">@color/night_windows_bg</item>
        <item name="textColor">@color/night_textColor</item>
        <item name="infoTextColor">@color/night_infoTextColor</item>
        <item name="layout_bg_normal">@color/night_layout_bg_normal</item>
        <item name="lineColor">@color/night_line_color</item>
        <item name="windows_bg">@color/night_windows_bg</item>
        <item name="sliding_block_bg">@drawable/night_image_sliding_block</item>
        <item name="layout_item_bg">@drawable/night_list_item_background</item>
        <item name="android:editTextColor">@color/night_edit_color</item>
        <item name="android:textColorHint">@color/night_edit_hit_color</item>
        <item name="comment_reply_container_bg">@drawable/night_comment_reply_container_bg</item>
        <item name="message_bg_left">@drawable/night_chat_from_bg_normal</item>
        <item name="message_bg_right">@drawable/chat_to_bg_pressed</item>
        <item name="quickoption_icon_text_selector">@drawable/night_quickoption_icon_text_selector</item>
        <item name="quickoption_icon_album_selector">@drawable/night_quickoption_icon_album_selector</item>
        <item name="quickoption_icon_photo_selector">@drawable/night_quickoption_icon_photo_selector</item>
        <item name="quickoption_icon_voice_selector">@drawable/night_quickoption_icon_voice_selector</item>
        <item name="quickoption_icon_scan_selector">@drawable/night_quickoption_icon_scan_selector</item>
        <item name="quickoption_icon_note_selector">@drawable/night_quickoption_icon_note_selector</item>
    </style>

上述只是完成了在应用启动时，读取本地配置信息，回显至客户端。

而真正的点击设置是在侧滑菜单NavigationDrawerFragment中完成的

在NavigationDrawerFragment中通过ButterKnife注解找见menu_item_theme

 @InjectView(R.id.menu_item_theme)
    View mMenu_item_theme;

添加注册监听后

case R.id.menu_item_theme:
        //点击完成模式的切换
     switchTheme();
     break;

真正的模式切换代码：

先读取本地配置信息
如果是夜间，点击后设置为日间模式
如果是日间，点击后设置位夜间模式
随后recreate 当前Activity

    private void switchTheme() {
        if (AppContext.getNightModeSwitch()) {
            AppContext.setNightModeSwitch(false);
        } else {
            AppContext.setNightModeSwitch(true);
        }

        if (AppContext.getNightModeSwitch()) {
            getActivity().setTheme(R.style.AppBaseTheme_Night);
        } else {
            getActivity().setTheme(R.style.AppBaseTheme_Light);
        }

        getActivity().recreate();
    }

三、总结收获

明白了应用中各种皮肤、模式切换的原理，实质还是——theme