仿知乎客户端的白天黑夜主题切换

转载请注明出处
作者：AboutJoke ( http://blog.csdn.net/u013200308 )
原文链接：http://blog.csdn.net/u013200308/article/details/51168922

最近刚刚做完了个人项目，腾出时间来把自己遇到过的一些问题和处理技巧写出来，和大家交流交流。
今天要说的就是仿知乎客户端的主题切换，首先来看看知乎客户端的切换图例：
知乎示例

通过上示的图例，我们来进行分析。图例实现了两种效果：

白天黑夜主题的切换
切换带有渐变的动画效果

主题切换比较简单，较适合初学者的方式就是通过给Activity设置不同的theme来实现。用到的主要方法就是setTheme()，值得注意的是该方法必须放在onCreate()方法之前，不然不会有任何效果。这样就会有同学疑问，既然切换主题的方法放在了onCreate()之前，那么在Activity呈现之后，再点击按钮去切换主题，这时onCreate()已经被调用过了，那么就不会有任何效果。除非…对，我们把当前Activity给finish()掉然后再次打开，就可顺利的设置主题了。而切换带有的渐变效果，网上关于这方面的争议比较多，但实现起来都比较麻烦，笔者通过给Activity设置进入退出动画，实现了这一效果，接下来就通过一个简单的Demo来实现一下。

主要代码如下，具体可通过下载源码查看。

首先定义切换的主题和动画效果

这里使用Android主题来实现，具体的图片或文字的效果可以通过自定义属性来实现。

<resources>

    <!--白天主题-->
    <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>

    <!--黑夜主题-->
    <style name="AppTheme.Black" parent="Theme.AppCompat">

    </style>

</resources>

activity_in.xml 进入动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <alpha
        android:duration="700"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0">

    </alpha>
</set>

activity_out.xml 退出动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <alpha
        android:duration="700"
        android:fromAlpha="1.0"
        android:interpolator="@android:anim/decelerate_interpolator"
        android:toAlpha="0.0">

    </alpha>
</set>

切换和获取主题

//获取主题
    public static int getAppTheme(Context ctx) {
        String value = Preferences.getString(ctx, "activity_theme", "1");
        switch (Integer.valueOf(value)) {
            case 1:
                return R.style.AppTheme;//白色主题
            case 2:
                return R.style.AppTheme_Black;
            default:
                return R.style.AppTheme;//默认白色
        }
    }


    //切换主题
    //当然也可以使用资源ID来进行标记
    public static void switchAppTheme( Context ctx){
        String value = Preferences.getString(ctx, "activity_theme", "1");
        switch (Integer.valueOf(value)){
            case 1:
                Preferences.setString(ctx, "activity_theme", "2");
                break;
            case 2:
                Preferences.setString(ctx, "activity_theme", "1");
                break;
            default:
                Preferences.setString(ctx, "activity_theme", "1");
                break;
        }
    }

加载主题

public void reload() {
        Intent intent = getIntent();
        overridePendingTransition(R.anim.activity_in, R.anim.activity_out);//进入动画
        finish();
        overridePendingTransition(R.anim.activity_in, R.anim.activity_out);
        startActivity(intent);
    }

当Activity启动时设置主题

//切换主题必须放在onCreate()之前
        if (savedInstanceState == null) {
            theme = UiUtils.getAppTheme(MainActivity.this);
        } else {
            theme = savedInstanceState.getInt("theme");
        }
        setTheme(theme);

看完了代码，我们就来看一看具体的实现效果：
demo示例

demo下载址：https://github.com/AboutJoke/SwitchTheme.git