美文网首页
动态换肤四(其他控件换肤)

动态换肤四(其他控件换肤)

作者: radish520like | 来源:发表于2018-05-16 11:26 被阅读0次

    前言

      上一篇文章中,将一些系统的 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 换肤后
      我们发现,Fragment 里面也可以进行换肤,为什么呢?
      一个 Fargment 里面,我们重写它的 onCreateView 方法后,onCreateView 方法里面的 LayoutInflater 会通过参数传递过来,我们通过查看 Fragment 的源码会发现,这个 LayoutInfalter 是通过 mHost.onGetLayoutInflater(); 获取的
    image.png
    image.png

      而我们的 Activity 继承自


    image.png
    image.png
      在这个 FragmentActivity 里面
    image.png
      所以我们调用的是这个 HostCallbacks 的 onGetLayoutInflater 方法
    image.png
      通过一个 cloneInContext 方法获取的一个 Activity,所以说跟 Activity 的 LayoutInflater 不是同一个 LayoutInflater,而其实我们拿到的是 LayoutInflater 的子类:PhoneLayoutInflater
    image.png
      这是 new 出来的,所以跟 Activity 的 Inflater 不是同一个,我们继续看 PhoneLayoutInflater 的构造函数
    image.png

      他会调用父类的构造函数


    image.png
      原来是这样,里面的 mFactory 、mFactory2 是同一个。也就是说,虽然 Fragment 的 LayoutInflater 跟我们的 Activity 的 LayoutInflater 不是同一个,但是他们里面的 Factory 是同一个。
      也许细心的同学,会看见这一行代码
    image.png
      这一行代码就设置 Factory2,那我们设置了 Factory2 他也设置了 Factory2 为什么会用到我们的?原因是这里面他使用了工厂合并,我们看下面的源码
    image.png
    image.png
      所以说,最终还是会回调到我们自定义的 Factory2 里面,那这也就解释了为什么我们没有给 Fragment 做任何操作,Fragment 就能换肤的原因。

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

      我们先看一张图


    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 创建的时候以及我们点击换肤按钮的时候调用一次即可。


    换肤前
    换肤后
    还原

    相关文章

      网友评论

          本文标题:动态换肤四(其他控件换肤)

          本文链接:https://www.haomeiwen.com/subject/puqudftx.html