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

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

转载请注明出处

作者：AboutJoke ( http://blog.csdn.net/u013200308 )

原文链接：/article/10209212.html

最近刚刚做完了个人项目，腾出时间来把自己遇到过的一些问题和处理技巧写出来，和大家交流交流。

今天要说的就是仿知乎客户端的主题切换，首先来看看知乎客户端的切换图例：



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

白天黑夜主题的切换

切换带有渐变的动画效果

主题切换比较简单，较适合初学者的方式就是通过给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下载址：https://github.com/AboutJoke/SwitchTheme.git