Android流行UI布局——底部导航（BottomNavigationView+ViewPager+Fragment）

最新推荐文章于 2024-07-22 16:44:57 发布

稚渊

最新推荐文章于 2024-07-22 16:44:57 发布

阅读量815

点赞数

分类专栏： Android 文章标签： viewpager fragment使用

本文链接：https://blog.csdn.net/qq_36348823/article/details/76243533

版权

本文介绍如何结合官方的BottomNavigationView、ViewPager和Fragment来创建一个流行UI布局。详细步骤包括导入依赖库、设计菜单、设置布局和监听事件。同时，文章解决了ViewPager与BottomNavigationView滑动联动的问题，并提供了禁止ViewPager滑动的方法。

摘要由CSDN通过智能技术生成

这篇文章为大家带来

1.官方BottomNavigationView的使用方法
2.结合ViewPager、Fragment实现一个流行UI布局！
3.并用反射解决ViewPager与BottomNavigationView侧滑联动时的一个小问题。

最终实现效果：

这里写图片描述

在谷歌官方发布BottomNavigationView控件之前我们可以自己组合控件实现，比如LinearLayout + TextView(使用android:drawableTop属性+selector状态切换)、RadioGroup + RadioButton等等组合控件的方法自定义实现复杂效果。除了第三方外，现在我们多了一个选择。

开始

1.新建project然后导入以下support:design library，BottomNavigationView就在这个design库中。顺带导入这个V4包，因为待会要使用到ViewPager（这里其实不用记这么麻烦的库跟版本怎么写，直接在AS 的design面板把控件拖进来就会自动导入了。）

compile’com.android.support:design:25.0.1’
compile’com.android.support:support-v4:25.0.1’

2.在res下新建menu文件夹，新建一个menu菜单

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

    <item
        android:id="@+id/action_home"
        android:title="首页"
        android:icon="@drawable/home_selected"/>

    <item
        android:id="@+id/action_explore"
        android:title="直播"
        android:icon="@drawable/live"/>

    <item
        android:id="@+id/action_me"
        android:title="关注"
        android:icon="@drawable/follow"/>
    <item
        android:id="@+id/mfaxin"
        android:title="发现"
        android:icon="@drawable/video"/>
    <item
        android:id="@+id/mi"
        android:title="我的"
        android:icon="@drawable/user"/>
</menu>

3.接着是布局文件主要代码如下（最下面的View效果是加一个阴影）：

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