美文网首页
仿bilili侧滑左侧菜单

仿bilili侧滑左侧菜单

作者: _成长ing_ | 来源:发表于2019-05-24 14:01 被阅读0次

1. 概述

Android侧滑菜单的实现有很多方式,本文采用DrawerLayout + NavigationView的方式实现侧滑菜单,仿照bilibili的侧滑菜单,效果如图所示:


仿bilibili左侧菜单.gif

2.实现

2.1 DrawerLayout + NavigationView生成侧滑菜单
2.2 NavigationView添加头部布局
2.3 NavigationView添加menu布局
2.4 NavigationView添加底部布局
2.5 menu中item右边添加new标志

2.4 NavigationView添加底部布局
前三个实现方式比较简单,教程网上一搜一大把,但是在实现第四点的时候出现了问题,由于自己技术太垃圾,懵逼了好长时间,NavigationView只有添加头部和menu的代码,没有添加footView的方法,怎么整??想把NavigationView和底部layout放在一个LinearLayout里整体作为侧滑菜单,但是会发现底部的layout的背景是有阴影的,即使你设置了背景颜色,还是有阴影的。持续懵逼中。。。最后发现NavigationView其实是继承FrameLayout的,瞬间知道怎么做了,替自己的垃圾技术感到悲哀。

 <android.support.design.widget.NavigationView
        android:id="@+id/leftMenuView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/menu_header"
        app:menu="@menu/menu_main">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_gravity="bottom"
            android:orientation="vertical">

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="#e5e5e5" />

            <include layout="@layout/menu_home_bottom" />

        </LinearLayout>


    </android.support.design.widget.NavigationView>

运行发现确实底部布局被添加到了NavigationView,但是你会发现当你的menu布局过多时,bottom布局会遮挡一个item,这个不知道怎么整,我就在item里多加个item,,,哪位大神知道怎么解决,求告知!!!

2.5 menu中item右边添加new标志
new标签是一个布局文件

android:actionLayout="@layout/menu_new_logo"

运行发现没有作用,google一通,把android 改成app即可

app:actionLayout="@layout/menu_new_logo"

图片需要的素材:阿里巴巴矢量图标库

3.代码

链接:https://pan.baidu.com/s/1yYqjCqXgKw5nWlewLBoSbg
提取码:4m6k

相关文章

  • 仿bilili侧滑左侧菜单

    1. 概述 Android侧滑菜单的实现有很多方式,本文采用DrawerLayout + NavigationVi...

  • Flutter-抽屉效果只能拖拽

    flutter_new类似日历的抽屉 仿QQ侧滑菜单

  • 仿QQ侧滑菜单

    一. 实例说明 二. 关键技术    使用自定义类 QQMenu 类中的构造方法,View类中的 onMeasur...

  • Android仿qq侧滑菜单

    我们经常能看到各种app中都有应用侧滑菜单(SlidingMenu),效果很好的一种显示方式,今天我就向大家展示可...

  • iOS仿QQ侧滑菜单

    最近看到QQ上的侧滑菜单特有意思,就自己试着去实现了一下,看上去效果相差不大。最后的效果图: 首先,需要自定义一个...

  • Android仿QQ侧滑菜单

    先上效果图: GIF图有点模糊,源码已上传Github:Android仿QQ侧滑菜单 整体思路: 自定义ItemV...

  • iOS仿QQ侧滑菜单

    第一次在简书上写文章。 今天我要记录下如何拿UITabBarController做QQ侧滑菜单效果: 首先要了解U...

  • DrawerLayout

    Android DrawerLayout 高仿QQ5.2双向侧滑菜单 DrawerLayout的使用 直接将Dra...

  • 侧滑效果[第十五篇]:侧滑框架SmartSwipe之全局返回

    前面,我为大家展示了5种侧滑返回效果:仿手机QQ侧滑返回、仿微信侧滑返回效果、仿MIUI系统贝塞尔曲线侧滑返回、开...

  • ios 侧滑菜单与侧滑删除手势冲突问题

    用的侧滑菜单库是:CWLateralSlide 在使用这个库后,侧滑菜单正常, 但是侧滑删除就失效了,这是因为,侧...

网友评论

      本文标题:仿bilili侧滑左侧菜单

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