前言

  上一篇文章中，将一些系统的 View 已经完成换肤了。这篇文章我们会完成 Fragment、状态栏、底部虚拟按键的换肤。

上一篇文章地址：https://www.jianshu.com/p/1139df041cb6

Fragment 换肤

  我们需要使用到 TableLayout，所以添加一个依赖
compile 'com.android.support:design:26.+'，然后修改 MainActivity 的布局文件，并修改 MainActivity 给其添加几个 Fragment

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    android:background="?attr/colorAccent">

    <TextView
        android:id="@+id/tv_click"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="换肤"
        android:padding="10dp"
        android:background="#ffffff"
        android:layout_marginBottom="30dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/tv_other"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:textColor="@color/black"
        android:text="还原"
        android:background="@color/black"/>

    <TableLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize">

    </TableLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //...

        TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout);
        ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);

        List<Fragment> list = new ArrayList<>();
        list.add(new MusicFragment());
        list.add(new VideoFragment());
        list.add(new RadioFragment());
        List<String> listTitle = new ArrayList<>();
        listTitle.add("音乐");
        listTitle.add("视频");
        listTitle.add("电台");
        MyFragmentPagerAdapter myFragmentPagerAdapter = new MyFragmentPagerAdapter
                (getSupportFragmentManager(), list, listTitle);
        viewPager.setAdapter(myFragmentPagerAdapter);
        tabLayout.setupWithViewPager(viewPager);
    }
}

  这里新建了几个 Fragment 并且显示在 Activity 中，我们测试一下前面写的系统的 View 换肤能否在 Fragment 里面进行换肤

Fragment 换肤前

  点击换肤按钮

Fragment 换肤后

image.png

image.png

  而我们的 Activity 继承自

image.png

image.png

image.png

image.png

image.png

image.png

  他会调用父类的构造函数

image.png

image.png

image.png

image.png

状态栏和底部虚拟按键换肤

  我们先看一张图

image.png

  很多人都见过这张图，状态栏是由 statusBarColor 和 colorPrimaryDark 来控制，底部虚拟按键是由 navigationBarColor 来控制的。

注意：其中 colorPrimaryDark 的全路径是：android.support.v7.appcompat.R.attr.colorPrimaryDark
statusBarColor 的全路径是：android.R.attr.statusBarColor
navigationBarColor 的全路径是：android.R.attr.navigationBarColor

  状态栏换肤和底部虚拟按键换肤有对应的 api 可以调用，但是需要在 Android 5.0 版本以上才可以。注意状态栏的配置有两个，我们优先从 statusBarColor 里面去找，如果没找到就去 colorPrimaryDark 中找。
  在 SkinThemeUtils 增加如下方法

    /**
     * 状态栏、底部虚拟按钮换肤
     */
    public static void updateStatusBar(Activity activity) {
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
            return ;
        }
        int[] resId = getResId(activity, STATUSBAR_COLOR_ATTRS);
        if(resId[0] == 0){
            resId[0] = getResId(activity,APPCOMPAT_COLOR_PRIMARY_DARK_ATTR)[0];
        }
        //更换状态栏
        if(resId[0] != 0){
            activity.getWindow().setStatusBarColor(SkinResources.getInstance().getColor(resId[0]));
        }
        //更换底部虚拟按键
        if(resId[1] != 0){
            activity.getWindow().setNavigationBarColor(SkinResources.getInstance().getColor(resId[1]));
        }
    }

  然后我们在我们的主包下面添加如下代码

image.png

image.png

  这样我们确保就能在 Android 5.0 系统以上的手机可以使用使用 navigationBarColor 这个属性并且可以进行换肤。然后我们把皮肤包中的 colorPrimaryDark 设置成白色，也就是最终换肤后系统状态栏和底部虚拟按键的背景色都换成了白色。
  最后，就是要调用状态栏换肤的功能了。分别在 Activity 创建的时候以及我们点击换肤按钮的时候调用一次即可。

换肤前

换肤后

还原