安卓bottomnavigationview和drawlayout实现底部导航和侧滑布局
文章目录1.遇到的问题2.实现3.隐藏系统底部导航栏4.兼容刘海屏5.代码1.遇到的问题最近在开发一款app,初步的框架就是实现类似于qq布局的框架样式。那么就分为了两个部分。首先就是底部导航栏,使用bottomnavigationview和fragment可以实现,当然在创建项目时也可以使用AS默认的底部导航来进行项目创建。然后就是使用drawlayout实现侧滑的抽屉式布局。虽然分析起来...
1.遇到的问题
最近在开发一款app,初步的框架就是实现类似于qq布局的框架样式。那么就分为了两个部分。首先就是底部导航栏,使用bottomnavigationview和fragment可以实现,当然在创建项目时也可以使用AS默认的底部导航来进行项目创建。然后就是使用drawlayout实现侧滑的抽屉式布局。
虽然分析起来很简单,单独实现一样也很简单,但是小编在实操过程中遇到了些小问题就很蛋疼,总结如下:
(1)两者合并之后竟然出现了两个actionbar,我滴个乖乖
(2)合并之后运行项目竟然闪退
(3)隐藏actionbar失效?
2.实现
(1)单独实现
使用默认的可选择方案进行单个项目的创建
在单个项目创建完成之后,跑一下项目,发现和预想的差不多,改改ui啥的就能投入使用。
然后就是合并的过程了。
两种合并方式,一种是将抽屉布局侧滑加入到底部导航的项目中,另一种则相反,各有优缺点,实现方法一致。
根据项目需要,我选择第一种合并方式,因为在侧滑菜单里的点击事件是准备跳到新的activity去进行业务实现,而并非使用当前的activity。
注意,这里有个坑,千万不要将drawlayout合并到底部导航栏的fragment里面去,小编在这儿绕了好半天呢。总之会出现各种问题,喜欢钻研的小伙伴可以去试试这种方式,最后可能会解决好问题也不一定。
(2)合并:
改变底部导航栏部分main.xml的根标签 为drawlayout,不是在fragment里面。最简单的方法就是把之前单独创建的drawlayout布局的根标签拿过来替换一下。
现在标签结构如下
<drawlayout>
<BottomNavigationView></BottomNavigationView>
<fragment></fragment>
</drawlayout>
接着改造
把抽屉布局的NavigationView搬过来呀。
<drawlayout>
<BottomNavigationView></BottomNavigationView>
<fragment></fragment>
<NavigationView></NavigationView>
</drawlayout>
到这一步运行的话,你会发现很有趣的东西,底部导航栏并不在底部,而是跑到中间去了。
接着改
<drawlayout>
<ConstraintLayout>
<BottomNavigationView></BottomNavigationView>
<fragment></fragment>
</ConstraintLayout>
<NavigationView></NavigationView>
</drawlayout>
搞一个ConstraintLayout把底部导航栏的东西嵌套起来,然后底部导航栏回去了。但是这时你会发现有两个actionbar,惊不惊喜,意不意外。如果你有两个actionbar的,那把include过来的actionbar砍掉。然后就只剩一个了。
3.隐藏系统底部导航栏
首先采用修改manifest文件的方式:
选一个noactionbar的主题试试
Theme.AppCompat.Light.NoActionBar
如果你的activity是继承自AppCompatActivity的话,主题也要对应一致,不然闪退那是必须的。
但是在继承自Theme.AppCompat.Light.NoActionBar之后也闪退,没门啊。
原来是这一行出错了。
NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
这儿设置了actionbar,我不是不要actionbar吗,你设置个冒险,滚蛋,注释了。
然后运行成功。
接着好玩的来了,主题颜色变得稀奇古怪的。
底部导航栏点击之后颜色不变深了,甚至字都看不见了。
我玩个毛线。
但是呢,遇到事情不要慌,先看看默认的apptheme是什么鬼,因为要用到底部导航的样式,所以给换回去先。
跑到style.xml下面去瞅瞅样式是啥,然后就改呀。把对应的parent改成如下。
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
接着跑一下,完全ojbk的可以。
4.兼容刘海屏
修改manifest文件,在application标签内部添加
<meta-data
android:name="android.max_aspect"
android:value="2.4" />
<!--适配华为(huawei)刘海屏-->
<meta-data
android:name="android.notch_support"
android:value="true" />
<!--适配小米(xiaomi)刘海屏-->
<meta-data
android:name="notch.config"
android:value="portrait|landscape" />
5.代码
实现效果
合并后的xml文件如下
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start"
android:clipToPadding="false">
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view_left"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/activity_main_drawer" />
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/nav_view_bottom"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="@menu/bottom_nav_menu" />
<fragment
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="@id/nav_view_bottom"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/mobile_navigation" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.drawerlayout.widget.DrawerLayout>
有兴趣拿框架去改的自行下载。
链接:https://pan.baidu.com/s/14MNj_EtRU0Iif4z1XI5jsg
提取码:pjt7
复制这段内容后打开百度网盘手机App,操作更方便哦
网盘资源若无法访问,还请挪步
立即下载示例代码
最后,菜归菜,遇到事情咋不慌__@Lvan
更多推荐
所有评论(0)