Android: UI--顶部导航栏(颜色渐变)+Fragmen

底部导航栏使用

implementation 'com.github.CymChad:BaseRecyclerViewAdapterHelper:2.9.46'

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //去掉状态栏
        if (Build.VERSION.SDK_INT >= 21) {
            View decorView = getWindow().getDecorView();
            decorView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
        }
        setContentView(R.layout.activity_follow);
        mBottomNavigationBar = findViewById(R.id.bottom_navigation_bar);
        InitNavigationBar();
    }

    private void InitNavigationBar() {
        mBottomNavigationBar.setTabSelectedListener(this);
        mBottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);
        mBottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_DEFAULT);        mBottomNavigationBar.setTextDirection(BottomNavigationBar.TEXT_DIRECTION_INHERIT);
        mBottomNavigationBar
                .addItem(new BottomNavigationItem(R.mipmap.bottom_tuijian_active_72, "推荐").setInactiveIconResource(R.mipmap.bottom_tuijian_72).setActiveColor(R.color.black))
                .addItem(new BottomNavigationItem(R.mipmap.bottom_yule_active_72, "娱乐").setInactiveIconResource(R.mipmap.bottom_yule_72).setActiveColor(R.color.black))
                .addItem(new BottomNavigationItem(R.mipmap.bottom_guanzhu_active_72, "关注").setInactiveIconResource(R.mipmap.bottom_guanzhu_72).setActiveColor(R.color.black))
                .addItem(new BottomNavigationItem(R.mipmap.bottom_yuba_active_72, "鱼吧").setInactiveIconResource(R.mipmap.bottom_yuba_72).setActiveColor(R.color.black))
                .addItem(new BottomNavigationItem(R.mipmap.bottom_faxian_active_72, "发现").setInactiveIconResource(R.mipmap.bottom_faxian_72).setActiveColor(R.color.black))
                .setFirstSelectedPosition(0)
                .initialise();

        fm = getSupportFragmentManager();
        transaction = fm.beginTransaction();

        if (mRecommendFragment == null) {
            mRecommendFragment = RecommendFragment.newInstance();
        }
        fragmentList = new ArrayList<>();
        fragmentList.add(mRecommendFragment);
        fragmentList.add(EntertainmentFragment.newInstance());
        fragmentList.add(FollowFragment.newInstance());
        fragmentList.add(FishbarFragment.newInstance());
        fragmentList.add(DiscoverFragment.newInstance());

        transaction.replace(R.id.frameLayout,mRecommendFragment);
        transaction.commit();
    }

• .addItem(new BottomNavigationItem(R.mipmap.bottom_faxian_active_72, "发现").setInactiveIconResource(R.mipmap.bottom_faxian_72).setActiveColor(R.color.black));
  是添加一个控件，active表示选中状态时候的图片，inActive是未选中状态，activeColor是选中状态的title字体的颜色。
• 详细使用可以参考:
  https://www.jianshu.com/p/feab12806ba2
  https://www.jianshu.com/p/9be7ac6d8486
  https://www.jianshu.com/p/c9c7747768d0

顶部：

TabLayout + ViewPager + Fragment

• 通过FragmentPagerAdapter来绑定数据到视图
• android.support.design.widget.CoordinatorLayout 继承自FrameLayout，所以布局都会重叠。

<android.support.v4.view.ViewPager
        android:id="@+id/follow_viewPager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
        <FrameLayout
            android:id="@+id/follow_live_frameLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </FrameLayout>
    </android.support.v4.view.ViewPager>

• app:layout_behavior 指定控件随appbar滑动行为:appbar_scrolling_view_behavior是随着appbar一起滑动，当appbar到顶端不在滑动时，该控件中的内容继续滑动。 而不加这个行为：appbarlayout和viewPager重叠，只有appbar到达顶端，控件中的内容
  才会向上移动。
• app:layout_scrollFlags="scroll|enterAlways" 是指定导航栏滑动方式。
• 详细使用可以参考：
  https://www.jianshu.com/p/c8ea998a982a

去除AppBarLayout下面的阴影

AppBarLayout有阴影.png