首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何防止在滚动CoordinatorLayout时隐藏底部导航

在滚动CoordinatorLayout时隐藏底部导航栏,可以通过以下方法来实现防止隐藏:

  1. 使用app:layout_behavior属性:在CoordinatorLayout的直接子视图中,将底部导航栏的布局添加app:layout_behavior属性,并设置为com.google.android.material.behavior.HideBottomViewOnScrollBehavior。这个行为会在滚动CoordinatorLayout时自动隐藏底部导航栏。
代码语言:txt
复制
<androidx.coordinatorlayout.widget.CoordinatorLayout
    ...
    >

    <com.google.android.material.bottomnavigation.BottomNavigationView
        ...
        app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior"
        />

    <!-- 其他视图 -->

</androidx.coordinatorlayout.widget.CoordinatorLayout>
  1. 自定义Behavior:如果需要更多的控制和自定义行为,可以创建自定义的Behavior。首先,创建一个继承自CoordinatorLayout.Behavior<View>的类,并重写onNestedScroll()方法。在该方法中,根据滚动的方向和距离来控制底部导航栏的隐藏和显示。
代码语言:txt
复制
public class CustomBottomNavigationBehavior extends CoordinatorLayout.Behavior<View> {

    @Override
    public boolean onNestedScroll(CoordinatorLayout coordinatorLayout, View child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
        // 根据滚动的方向和距离来控制底部导航栏的隐藏和显示
        if (dyConsumed > 0) {
            // 向上滚动,隐藏底部导航栏
            hideBottomNavigation(child);
        } else if (dyConsumed < 0) {
            // 向下滚动,显示底部导航栏
            showBottomNavigation(child);
        }
        return false;
    }

    private void hideBottomNavigation(View view) {
        // 隐藏底部导航栏的逻辑
        view.setVisibility(View.GONE);
    }

    private void showBottomNavigation(View view) {
        // 显示底部导航栏的逻辑
        view.setVisibility(View.VISIBLE);
    }
}

然后,在CoordinatorLayout的直接子视图中,将底部导航栏的布局添加自定义的Behavior。

代码语言:txt
复制
<androidx.coordinatorlayout.widget.CoordinatorLayout
    ...
    >

    <com.google.android.material.bottomnavigation.BottomNavigationView
        ...
        app:layout_behavior=".CustomBottomNavigationBehavior"
        />

    <!-- 其他视图 -->

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这样,滚动CoordinatorLayout时底部导航栏将根据滚动方向自动隐藏或显示。

请注意,以上示例中使用了Google的Material组件库中的com.google.android.material.bottomnavigation.BottomNavigationView作为底部导航栏的示例,你可以根据实际情况替换为你所使用的底部导航栏组件。

推荐的腾讯云相关产品:腾讯云移动应用分析(MTA),该产品提供了移动应用数据分析的能力,可以帮助开发者深入了解用户行为和应用性能,优化应用体验。了解更多信息,请访问腾讯云移动应用分析官方网页:https://cloud.tencent.com/product/mta

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

如何防止Vue页面局部元素滚动,页面整体滚动

我尝试@mousewheel.native这个事件,第一行加入e.stopPropagation(),发现还是没有作用,最外层的body还是可以滚动。...而浏览器的默认行为是,当一个滚动事件发生且子元素滚动到边界(比如已经滚动底部或顶部),事件会继续传递给父容器,最终传递到 body,导致页面的整体滚动。...解决方法 为了防止整个页面滚动(即 body 的滚动),你需要使用 e.preventDefault() 来阻止浏览器的默认行为。...script> export default { methods: { handleScroll(e) { e.preventDefault(); // 阻止浏览器默认行为(即防止页面滚动...例如: 阻止表单提交:如果你表单的提交事件中调用 e.preventDefault(),那么表单不会被提交。 阻止链接跳转:点击 标签,浏览器会跳转到 href 属性指定的地址。

50000
  • 使用CoordinatorLayout打造各种炫酷的效果

    https://blog.csdn.net/gdutxiaoxu/article/details/52858598 CoordinatorLayout简介 CoordinatorLayout...其实相对于前 一个例子,只是把 摆放RecyclerView 的位置替换成ViewPager而已,为了有页面导航器的效果,再使用 TabLayout而已,而TabLayout 我们滑动的时候最终会停靠在...主要实现以下功能 - Collapsing title(可以折叠 的 标题 ) - Content scrim(内容装饰),当我们滑动的位置 到达一定阀值的时候,内容 装饰将会被显示或者隐藏...(当这个View到达 CollapsingToolbarLayout的底部的时候,这个View 将会被放置,即代替整个CollapsingToolbarLayout) 我们有两种方法可以设置这个常量,...- 对于AppBarLayout,我们主要 讲解了这个属性app:layout_scrollFlags,设置不同 的属性我们可以滚动的时候显示不同 的效果 - 对于CollapsingToolbarLayout

    5K10

    听说谷歌Baba更新了 Material UI ...

    当项目有3到5个顶层(底部)目的地导航到时,可以使用此模式。...持久性底部页面是从屏幕底部出现的视图,主要内容上升高。他们可以垂直拖动以暴露他们的内容列表。 注意:如果要使用模态(对话框)的底页,请使用 BottomSheetDialogFragment。...下面着撸起实现: Step 1:搞个布局玩玩 外层使用CoordinatorLayout包裹,底部导航栏采用BottomNavigationView,中间内容区域,很Easy咯~ <?...这将是可视高度,展开高度或0,以防用户操作导致底部表单隐藏; STATE_HIDDEN: Bottom Sheets隐藏。...如果已经Activity使用CoordinatorLayout,添加底部表单很简单: 将任何视图添加为CoordinatorLayout的直接子视图。

    3K20

    android 设置标题栏背景颜色_状态栏菜单栏都在哪

    android中沉浸式状态栏的文章已经满大街了,可是实现某些效果,还是得各种搜索,测试一通后,最后还常常满足不了要求,即使好不容易一部手机上满足了需求,放在另外一手机上,发现效果还各种不适配。...下面是同一个activity切换不同fragment,状态栏文字颜色跟着变化的效果图: 下图是同一个Activity向上滚动,标题栏和状态栏文字颜色根据变化的效果: 1....CommonUtils.navigationHeight); 这行代码干什么用的,因为我们这里首页和我的页面,需要背景图片填充到状态栏,故不能使用android:fitsSystemWindows属性,故实现上面效果带有底部导航栏手机上就会存在一个大坑...带有底部导航栏手机底部导航按钮会和navigationbar重叠 如下图所示: 全屏,由于视图布局会填充到状态栏和导航栏下方,如果不使用android:fitsSystemWindows=”true...”属性,就会使底部导航栏和应用底部按钮重叠,导视按钮点击失效,这该怎么办?

    2.2K10

    如何使用 CSS 设置和自定义水平和垂直滚动

    body的高度以使其足够长以滚动以下CSS代码片段描述了如何将初始导航栏样式设置为侧边栏并调整body的底部边距。...本节中,我们将专注于防止侧边栏滚动主要内容移动。我们希望将侧边栏样式设置为固定位置,以便主体可以自行滚动而不带上侧边栏。...从截图中可以看出,侧边栏的底部看起来不像设置底部。这是因为内容比其容器的高度长。在下一节中,我们将学习如何防止导航项目列表显示侧边栏之外。d)....使用滚动条管理内容溢出防止导航项目显示侧边栏之外非常简单。只需使用一行CSS代码即可完成此操作,该行代码使用overflow-y属性。...另一方面,如果将overflow-y属性的值设置为auto,则浏览器只有目标容器有超出内容才会添加滚动条。

    1.7K00

    Floating Action Button-Android M新控件

    CoordinatorLayout帮助我们协调它所包含的子view之间的交互,这一点我们后面讲如何根据滚动的变化让按钮动画隐藏与显示的时候有用。...实际上只需要指定一个布局文件,就可以看到效果了,只不过是这时候的FAB是固定在屏幕指定位置的,而无法随之滚动,不着急,下面会介绍如何设置成可滚动的FAB 属性介绍 FAB 默认使用应用主题中设置的浮起色作为按键背景...这个类用于定义按钮该如何响应包含在同一CoordinatorLayout之内的其它view。...Issues: 本文编写,FAB 支持库仍然存在一些 bug, Kitkat 和 Lollipop 中分别运行示例代码,可以看到如下结果: Lollipop 中的 FAB: ?.../> 依附到list 接下来,我们可以选择将FAB和一个ListView, ScrollView 或者 RecyclerView 关联起来,这样按钮就会随着list的向下滚动隐藏

    1.5K40

    通过来模仿稀土掘金个人页面的布局来学习使用CoordinatorLayout

    特别喜欢稀土掘金个人界面的样子,那我们就来看看如何实现这个效果吧,要想实现这个效果,肯定需要的是Material Design风格,那就需要学会使用以下控件:CoordinatorLayout,AppBarLayout...AppBarLayout里面的View,通过app:layout_scrollFlags属性来控制,滚动时候的表现。其中有4种Flag的类型。...Scroll: 表示向下滚动,这个View会被滚出屏幕范围直到隐藏. enterAlways: 表示向上滚动,这个View会随着滚动手势出现,直到恢复原来的位置. enterAlwaysCollapsed...parallax - 设置为这个模式,在内容滚动,CollapsingToolbarLayout中的View(比如ImageView)也可以同时滚动,实现视差滚动效果,通常和layout_collapseParallaxMultiplier...除此之外,设计 Toolbar 的时候,Google也留给了开发者很多可定制修改的余地,这些可定制修改的属性API文档中都有详细介绍,如: 设置导航栏图标; 设置App的logo; 支持设置标题和子标题

    2.3K90

    Android CoordinatorLayout高级用法之自定义Behavior

    view的滚动行为来改变自己的状态,现在我们就需要重写下面的方法了: public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout...接下来就是onDependentViewChanged中对View做出相应的状态改变。代码中,我们做的改变是,跟随dependedcy一起Y轴方向移动,来达到显示和隐藏的目的。...效果图上我们看到,当我们上下滑动屏幕的时候,底部footer布局和标题Toolbar一起移动,实现了显示和隐藏的效果。...target:CoordinatorLayout的子View,引起滚动的view,其实child的状态改变是根据target来实现的。...onStartNestedScroll中,首先获取targetY轴上距离屏幕顶端的距离,然后判断是否是Y轴上滚动

    1.7K21

    自定义View:手撸一个带FAB凹槽的底部导航

    ,也不缺各种花里胡哨不按常理出牌的底部导航栏。...设计思路 既然玩那就干脆玩花一点,一步到位给中间按钮加了个简单的点击动画,点击后FAB垂直方向上执行一次往返位移,同时底部导航栏上的凹槽大小跟随着FAB的凹陷深度动态变化,需要实现的功能点以及思路大体是下面的几个...导航栏中间大按钮停靠 之前已经导航栏上留好了放置大按钮的位置,接下来就是想办法把这个按钮塞进去,并且设置按钮的中心点与导航栏的顶部居中对齐。...只不过这看似挺简单的效果,设计路径和计算相关尺寸大小实践起来还是挺麻烦的,废弃了n种方案之后决定出采用以下的一种: 如上图所示,橙色实线为底部导航栏的目标形状,canvas的绘制原点默认左上角,整个形状的直线部分路径比较好确定...假设按钮垂直方向上的当前位移距离大小为d,当按钮向上运动导航栏上的凹槽应该往中间收缩,收缩过程中保持两旁小圆半径大小和30°夹角不变,这时另中间圆的圆心同步垂直方向上移动-d,动态修改distance

    20610

    NestedScrolling机制之CoordinatorLayout.Behavior实战

    @NonNull View target, int dx, int dy, @NonNull int[] consumed, int type) { //防止左右误滑...2 横向滚动1 * type 滑动类型touch 0手指按下 1手指松开 */ public boolean onStartNestedScroll(@NonNull CoordinatorLayout...target消耗的滚动时候触发,这个是水平滚动的实时距离 * dyUnconsumed view处于滚动状态,但是并不是由target消耗的滚动时候触发,这个是竖直滚动的实时距离 * type 同上 *...onStopNestedScroll():看名字就知道了,当停止滑动时调用的方法,主要是执行当滑到一般停止要怎么恢复还是隐藏商品列表的判断 onNestedFling(): 当手指快速一划所触发的方法...,代码中结合着Scroller,onNestedFling赋一个结束值给Scroller,Scroller会不断产生中间值直到结束为止。

    88910

    Android 仿高德地图可拉伸的BottomSheet的示例代码

    Bottom Sheet是Design Support Library23.2 版本引入的一个类似于对话框的控件,可以暂且叫做底部弹出框吧。...Bottom Sheet中的内容默认是隐藏起来的,只显示很小一部分,可以通过代码中设置其状态或者手势操作将其完全展开,或者完全隐藏,或者部分隐藏。...对于Bottom Sheet的描述可以官网查询:https://material.io/design/# 怎么使用?...layout_width="match_parent" android:layout_height="wrap_content"/ </LinearLayout activity中的使用 //底部抽屉栏展示地址...原则上来说,只要是可以滚动的View,加上了这个属性后,都可以作为BottomSheet来使用,建议使用NestedScrollView或者RecyclerView。

    1.8K30

    Android开发笔记(一百三十四)协调布局CoordinatorLayout

    使用CoordinatorLayout,要注意以下几点: 1、导入design库; 2、根布局采用android.support.design.widget.CoordinatorLayout; 3、...ViewGroup,实现效果类似于RelativeLayout,若要指定子视图整个页面中的位置,有以下几个办法: 1、使用layout_gravity属性,指定子视图CoordinatorLayout...FloatingActionButton后面; 2、隐藏、显示按钮上时会播放动画;其中隐藏操作是调用hide方法,显示操作是调用show方法; 3、FloatingActionButton默认会随着Snackbar...> 底部弹窗BottomSheetBehavior design库提供了Snackbar页面底部弹出提示条,可是Snackbar着实简单,如果我们想在底部弹出一组菜单,Snackbar就无能为力了。...setPeekHeight : 设置弹窗的预览高度,即setState取值STATE_COLLAPSED设定的折叠高度。 setHideable : 设置弹窗是否允许隐藏

    2.1K30

    CollapsingToolbarLayout使用

    CollapsingToolbarLayout 可以看到,Toolbar的标题放大并在下方显示,当我们向上滑动列表,顶部Header部分的图片向上折叠隐藏,标题向上移动并缩小,同时以渐显式的方式显示蓝色主题...关于CollapsingToolbarLayout的属性官网上可以查到,这里我只介绍案例中我们常用的几个属性:title标题,布局展开放大显示图片底部,布局折叠缩小显示Toolbar左侧。...,如效果图中所示;contentScrim内容遮罩,上下滚动图片上面显示和隐藏的遮罩色,Toolbar位置的的背景色;通常这样设置:app:contentScrim="?...attr/colorPrimary",即显示为Toolbar颜色,应用的主题色;layout_collapseMode折叠模式,设置其他控件滚动自身的交互行为,有两种取值:parallax,折叠视差效果...当设置为1.0,滚动列表图片不会折叠移动; 代码实现: 关于CoordinatorLayout作为根布局容器如何协调子控件之间的交互行为,可以参考上一篇文章,这里我介绍一下本例中几个新的注意点。

    2.5K60

    Material Design 实战 之第四弹 —— 卡片布局

    其中, scroll 表示当RecyclerView向上滚动,Toolbar会跟着一起向上滚动并实现隐藏; enterAlways 表示当RecyclerView向下滚动...,Toolbar会跟着一起向下滚动并重新显示; snap 表示当Toolbar还没有完全隐藏或显示,会根据当前滚动的距离,自动选择是隐藏还是显示。...当AppBarLayout接收到滚动事件的时候,它内部的子控件是可以指定如何去影响这些事件的, 通过app:layout_scrollFlags属性就能实现。...其中, scroll表示当RecyclerView向上滚动,Toolbar会跟着一起向上滚动并实现隐藏; enterAlways表示当RecyclerView向下滚动,Toolbar会跟着一起向下滚动并重新显示...; snap表示当Toolbar还没有完全隐藏或显示,会根据当前滚动的距离,自动选择是隐藏还是显示。

    2.1K10

    Android Design Support Library初探-更新中

    button (悬浮操作按钮) snackbar tabs(选项卡) a motion and scroll framework to tie them together(将这些控件结合在一起的手势滚动框架...) 官方视频简介 Navigation View 抽屉导航是app识别度与内部导航的关键,保持这里设计上的一致对app的可用性至关重要,尤其是对第一次使用的用户。...NavigationView 通过提供抽屉导航所需要的框架让实现更简单,同时它还能够直接通过菜单资源文件来直接生成导航元素。 ?...通常EditText会在用户输入第一个字母后隐藏提示信息,但是现在可以使用TextInputLayout来将EditText封装起来,提示信息(hint)会变成一个显示EditText之上的floating..., 手势, 以及滚动 CoordinatorLayout与悬浮操作按钮 CoordinatorLayout与app bar 可伸缩折叠的Toolbar (Collapsing Toolbar) CoordinatorLayout

    97320
    领券