开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

隐藏appbarlayout的tablayout

是通过设置相应属性来实现的。具体步骤如下：

在布局文件中，找到包含TabLayout的AppBarLayout组件，通常是在CoordinatorLayout中。在TabLayout组件的外层添加一个新的FrameLayout组件，作为包裹TabLayout的容器。
设置TabLayout的属性app:layout_scrollFlags为"scroll|enterAlways"，表示TabLayout可以跟随滚动而隐藏，并且在向下滚动时自动显示。
设置TabLayout容器的高度为0dp，并且设置属性app:layout_collapseMode为"pin"，表示TabLayout容器会随着内容的滚动而自动收缩和展开。

示例代码如下：

<androidx.coordinatorlayout.widget.CoordinatorLayout>

    <com.google.android.material.appbar.AppBarLayout>

        <!--其他组件，例如Toolbar等-->

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            app:layout_collapseMode="pin">

            <com.google.android.material.tabs.TabLayout
                android:id="@+id/tabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways"/>

        </FrameLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <!--其他内容布局-->

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这样设置后，当向下滚动时，TabLayout会自动隐藏，并且在向上滚动时自动显示。该功能常用于需要更大的内容显示区域的界面，例如图片浏览、新闻阅读等。

腾讯云相关产品推荐：

云服务器（CVM）：提供弹性、可靠的云端服务器实例，满足不同规模的业务需求。产品介绍
腾讯云容器服务（TKE）：提供容器集群的管理和调度能力，简化应用的部署和管理。产品介绍
腾讯云数据库 MySQL 版（TencentDB for MySQL）：提供高性能、高可用的云数据库服务，支持自动备份、容灾等功能。产品介绍
腾讯云对象存储（COS）：提供安全、稳定的云端存储服务，适用于各种数据存储和备份需求。产品介绍

以上是一个简要的回答，如有需要进一步了解或有其他问题，请提供更具体的信息。

相关搜索:如何使用BottomNavigationView隐藏TabLayout 一键隐藏AppBarLayout和BottomNavigationView 使用MaterialDesignComponents在RecyclerView卷轴上隐藏AppBarLayout RecyclerView:当AppBarLayout向上滚动(隐藏)时填充屏幕高度 ViewPager选项卡下的非同级约束，其中AppbarLayout中的TabLayout和DrawerLayout中的ViewPager TabLayout的问题与AppBarLayout的FrameLayout干扰与AppBarLayout的ListView干扰 TabLayout的PressedListener事件 android中的tablayout 工具栏下的AppBarLayout 更改TabLayout中的文本如何创建这样的TabLayout？使用WebServices[API]的TabLayout AppBarLayout中的SwipeRefreshLayout未包装内容在边界上有奇怪阴影的AppBarLayout 工具栏不在AppBarLayout的中心如何在安卓系统中减少tablayout的tablayout标签页的填充？处理具有多个场景的TabLayout 访问Tablayout中片段的xml

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

CoordinatorLayout+AppBarLayout实现上滑隐藏ToolBar-Android M新控件

比如：在CoordinatorLayout中使用AppBarLayout，如果AppBarLayout的子View（如ToolBar、TabLayout）标记了app:layout_scrollFlags...效果即往上滑动隐藏ToolBar，下滑出现ToolBar，而不会隐藏TabLayout，因为TabLayout没有标记scrollFlags事件，相反，如果TabLayout也标记了ScrollFlags...事件，那么LinearLayout的下滑时ToolBar和TabLayout都会隐藏了。...TabLayout TabLayout-Android M新控件说到TabLayout，就是实现多个Tab之间的切换，不过Google在Design library新推出的TabLayout既实现了固定的选项卡...并且给这些组件设置如下属性来告诉CoordinatorLayout，该组件是带有滑动行为的组件，然后CoordinatorLayout在接受到滑动时会通知AppBarLayout 中可滑动的Toolbar

2.1K3 0

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

的介绍 AppBarLayout 是一个竖直排列的线性布局，它实现了很多Material Design风格app bar的设计概念，换句话说就是滚动手势。...在AppBarLayout里面的View,通过app:layout_scrollFlags属性来控制,滚动时候的表现。其中有4种Flag的类型。...Scroll: 表示向下滚动时,这个View会被滚出屏幕范围直到隐藏. enterAlways: 表示向上滚动时,这个View会随着滚动手势出现,直到恢复原来的位置. enterAlwaysCollapsed...它是设计用于直接AppBarLayout的子视图。...> TabLayout的坑使用TabLayout有个坑，这个坑如果一般用户不知道，解决起来比较麻烦，当然看到这篇文章的人有福了，因为你找到解决方法。

2.3K9 0

CoordinatorLayout使用（四）：和Toolbar的简单使用

在style中添加，隐藏原来的actionbar 一般会写一个style，用的时候，继承它即可 false <item...这里，如果设置scroll，也就是为true的时候，上面的Toolbar就会跟着滑动，并且会隐藏反之，不设置，也就是false，就不会隐藏，只会固定不动 snap相关（scroll条件下）...这个时候，我们想做一个pending的TabLayout 滑动的时候，隐藏上面的Toolbar 于是， AppBarLayout中，Toolbar下面，添加一个TabLayout Toolbar添加...app:layout_behavior="@string/appbar_scrolling_view_behavior" 再给Fragment中添加一点TextView 在Activity中，绑定对应的TabLayout...和ViewPager tabLayout = (TabLayout) findViewById(R.id.tablayout); tabLayout.setupWithViewPager(vp); for

1.5K3 0

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

结合ViewPager的视觉特差 ? ---- AppBarLayout 它是继承与LinearLayout的，默认的方向是Vertical ?...事件响应， layout_scrollFlags=“enterAlways”的时候这个View会响应下拉事件所以呈现出来的结果应该是我们在上拉的时候toolBar 会隐藏，下拉的时候toolBar...其实相对于前一个例子，只是把摆放RecyclerView 的位置替换成ViewPager而已，为了有页面导航器的效果，再使用 TabLayout而已，而TabLayout 在我们滑动的时候最终会停靠在...简单来说 ,CollapsingToolbarLayout是工具栏的包装器,它通常作为AppBarLayout的孩子。...主要实现以下功能 - Collapsing title（可以折叠的标题） - Content scrim（内容装饰），当我们滑动的位置到达一定阀值的时候，内容装饰将会被显示或者隐藏

5K1 0

学习使用Material Design控件（四）Android实现标题栏自动缩放、放大效果

AppBarLayout 可以让包含在其中的控件响应被标记了ScrollingViewBehavior的View的滚动事件 CollapsingToolbarLayout 可以控制包含在CollapsingToolbarLayout...其中的控件，在响应collapse时是移除屏幕和固定在最上面 TabLayout 结合ViewPager，实现多个TAB的切换的功能 NestedScrollView 与ScrollView基本相同...，不过包含在NestedScrollView中的控件移动时才能时AppBarLayout缩放 Layout布局 <?...增加Tab, 并关联ViewPager TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs); tabLayout.addTab...以上就是本文的全部内容，希望对大家的学习有所帮助。

1.2K3 1

Android view滑动悬浮固定效果实现代码示例

2.思路 (CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout)+TabLayout+ViewPager 3.代码实现 a.主布局代码 <?...推测—— CollapsingToolbarLayout中以上三种view不同排序的剖面展示效果为：顺序：Toolbar—— ImageView—— TabLayout（设置layout_gravity...（因此，1.在画布下的内容就无法显示出来；2.无法覆盖画布的内容就显示为画布默认的样式）所以，如果不想要有视差效果的话，那么就将Toolbar与TabLayout的高度设置一致。...</android.support.design.widget.AppBarLayout 只要将TabLayout从CollapsingToolbarLayout中移到AppBarLayout...（这样也避免了：在CollapsingToolbarLayout中，因为视图折叠覆盖的问题，会导致整个ImageView被TabLayout覆盖一部分而显示不完全的问题。）

8671 0

一个Demo学会用Android兼容包新控件

、FloatingActionButton的用法，以及Toolbar的渐变隐藏动画效果；官方Tabs组件TabLayout和ViewPager结合实现主界面内容区域； SwipeRefreshLayout...-- AppBarLayout跟它的名字一样，把容器类的组件全部作为AppBar。...本例中，TabLayout在界面滚动时，随着Toolbar的逐渐隐藏，将占据Toolbar的位置，达到节省屏幕空间，界面动画效果的目的。...exitUntilCollapsed: 当视图会在滚动时，它一直滚动到设置的minHeight时完全隐藏。...Google在Design support library中提供官方的Tab组件，它就是TabLayout。

1.5K4 0

详解Android使用CoordinatorLayout+AppBarLayout实现拉伸顶部图片功能

tab) { } }); } } 四、重点在于设置AppBarLayout的Behavior这里自定义AppBarLayoutOverScrollViewBehavior，下面贴出代码 package...; /** * Created by gjm on 2017/5/24. * 目前包括的事件： * 图片放大回弹 * 个人信息布局的top和botoom跟随图片位移 * toolbar背景变色 */ public...{ @Override public final void onOffsetChanged(AppBarLayout appBarLayout, int i) { mToolBar.setAlpha(...使用CoordinatorLayout+AppBarLayout实现拉伸顶部图片功能,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。...在此也非常感谢大家对ZaLou.Cn网站的支持！如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

2.5K4 0

【Android】这效果，我没法描述

接着监听AppBarLayout的滚动，利用topMargin实现被“顶上去”的效果拆分完毕，接下来就是实现了实现 Tab的悬浮效果利用CoordinatorLayout、AppBarLayout...、TabLayout、ViewPager来实现Tab的悬浮效果 <?...具体的使用可以参考Android 详细分析AppBarLayout的五种ScrollFlags （CoordinatorLayout、AppBarLayout的详细用法我就不多说了）然后，只要在...这时候只要在MainActivity中对AppBarLayout的滚动进行监听即可。...的监听，设置swipeLayout的Enabled来处理 mAblAppBar.addOnOffsetChangedListener((appBarLayout, verticalOffset) ->

9925 0

Material Design技术分享

实现导航同时动态滑动隐藏toolbar动画，这是最常见的主界面框架。...在CoordinatorLayout中使用AppBarLayout，如果AppBarLayout的子View（如ToolBar、TabLayout）标记了app:layout_scrollFlags滚动事件...（如ToolBar、TabLayout）控件被标记的滚动事件。...即往上滑动隐藏ToolBar，下滑出现ToolBar，而不会隐藏TabLayout，因为TabLayout没有标记scrollFlags事件，相反，如果TabLayout也标记了ScrollFlags事件...，那么子View的下滑时ToolBar和TabLayout都会隐藏了。

2.2K6 0

Android仿微博个人详情页滚动到顶部的实例代码

widget.Toolbar </android.support.design.widget.CollapsingToolbarLayout <android.support.design.widget.TabLayout...(里面包含TabLayout)，ViewPager，根节点是CoordinatorLayout。...上下滑动会引起AppBarLayout的联动，悬浮在顶部，或者是跟着viewPager一起滑动以及视差效果之类的。...那么该怎么做呢，一种思路是在onCreate()方法中，发post任务，页面渲染结束后，执行post任务，post的任务是调用AppBarLayout的API方法，让AppBarLayout往上滑。...appBarLayout.post(() - { //...具体的滑动逻辑 }); 操作AppBarLayout滑动的是对应的Behavior。

1.2K2 0

Material Design中的一些趣事

首先我们来看布局，最上面是我们自己的一个标题栏，往下图片那一整块我用的是toolbar，里面包含了整个的头部信息，再往下面是一个Tablayout，里面是三个tab，最下面放的是三个fragment 好了...整个头部（标题栏以下） </android.support.design.widget.TabLayout...AppBarLayout 结合下拉刷新上拉加载更多的滑动冲突解决也就是说我们需要监听appbarlayout的滚动 appBarLayout.addOnOffsetChangedListener...(new AppBarLayout.OnOffsetChangedListener() { @Override public void onOffsetChanged(AppBarLayout

4901 0

Android TabLayout 使用进阶（含源码）

③ 设置下划线从上面的图可以看到TabLayout默认是一个下划线的，这个下划线默认的颜色比较的丑，我们修改一下它。...基本上这个就能满足你的需求了，那么这个TabLayout的基本使用就介绍完了，有想要我添加的可以评论区留言哦，否则我就会以为你们都会了。...这里的实现方式其实有很多，而文本以TabLayout为主，那么自然是以TabLayout来现实了，就如我标题上说的一样，用到了，TabLayout + TabItem + ViewPager + Fragment...可以看到我点击TabLayout，ViewPager就会切换，滑动ViewPager，TabLayout就会选中相应的TabItem。这样就类似于现在的App主页面了。...appBarLayout; private TabLayout tabLayout; private ViewPager viewPager; @Override

3.1K3 3

Android利用二阶贝塞尔曲线实现添加购物车动画详解

布局主要使用CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+TabLayout+ViewPager 动画主要使用二阶贝塞尔曲线与属性动画消息传递使用...，后来经同事提醒，减去了TabLayout的坐标的y轴坐标即位置才可以。...match_parent" android:layout_height="0dp" android:layout_weight="1" <android.support.design.widget.AppBarLayout...TabLayout上面的View </LinearLayout </android.support.design.widget.CollapsingToolbarLayout <android.support.design.widget.TabLayout...... ... / </android.support.design.widget.AppBarLayout <RelativeLayout ... ... android:fillViewport

8515 1

CoordinatorLayout使用浅析

CoordinatorLayout是design包中的控件，作为外层控件可以协调子控件从而实现炫酷的效果等。...，然后是内容区和FloatingActionButton 这个AppBarLayout是有固定高度的，然后里面包着Toolbar，Toolbar外层是CollapsingToolbarLayout，是可折叠的...CollapsingToolbarLayout主要参数是app:layout_scrollFlags： scroll ：想要触发滑动事件，必须要加上这个属性，不加最后会停在顶端，比如Tablayout...parallax ：视差模式，在折叠的时候会有个视差折叠的效果。... <android.support.design.widget.TabLayout

3683 0

Android材料设计Material Design 开篇前言

,而不是谷歌闲着没事弄个东西刁难我们所有的代码都我都亲自测试过，文章的语言也尽量用我的话来叙述，大量的动图和图片也是我一个一个截的属性介绍以xml里为主,代码中动态设置使用`setXXX`即可...Android材料设计之AppBarLayout+CoordinatorLayout Android材料设计之CollapsingToolbarLayout+Palette Android材料设计之DrawerLayout...状态监听.gif ---- 6.BottomNavigationBar资料卡片：国籍：View 城市：FrameLayout 爱好：切换状态一句话：最佳底栏就是我，TabLayout别跟我抢额外依赖...tablayout.png ---- 8-1.AppBarLayout资料卡片：国籍：View 城市：ViewGroup(LinearLayout) 爱好：装东西、酷炫一句话：别绑架我，我不是大佬，...design:27.1.1' ---- 9.CollapsingToolbarLayout资料卡片：国籍：View 城市：ViewGroup(LinearLayout) 爱好：潮流、碰撞一句话：AppBarLayout

8561 0

AppBarLayout和CollapsingToolbarLayout的闲谈

了解 CollapsingToolbarLayout主要是提供一个可折叠的Toolbar容器，对容器中的不同View设置layout_collapseMode折叠模式，来达到不同的折叠效果。...通常CoordinatorLayout、AppBarLayout、CollapsingToolbarLayout的搭配使用折叠的效果目前已经很常见了，在网上有很多的例子和文章，小编整理了一下知识点。...parallax：视差模式，在折叠的时候会有个视差折叠的效果。...通过appBarLayout的OnOffsetChangedListener 的监听 appBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener...@Override public final void onOffsetChanged(AppBarLayout appBarLayout, int i) { if (i ==

1.8K3 0

是时候开始用C#快速开发移动应用了

UI层的开发 Layout 与 Widget Material Design 和 Android Support Library AppbarLayout + TabLayout DrawerLayout...我们的Demo中用到的组件包括： AppBarLayout + Tab Layout 实现图1中的Tab视图 Drawer Layout + Navigation View 实现图3中的左侧菜单 CoordinatorLayout...~ AppBarLayout + Tab Layout TabLayout可以说是一个非常好用的视图，你几乎在每一个主流的APP里面都可以看到。...我们用Support Library实现起来就非常的方便，下面是这几个组件的结构，ViewPager与AppBarLayout同级。 ?...这里不太想给大家展示太多关于UI层的代码，如果感兴趣的同学可以直接到我的GitHub里面去下载。我们主要看一下C#如何在ViewPager里面放视图同时与TabLayout关联起来。

2.6K6 0

最能解决你的痛点问题，也是你最需要的，尽在Material Design 系列这篇

这篇文章其实我一直在想，是写还是不写，因为关于讲 CoordinatorLayout，AppBarLayout，CollapsingToolbarLayout，Toolbar，TabLayout 等这些控件的使用...这次关于 CoordinatorLayout，AppBarLayout，CollapsingToolbarLayout，Toolbar，TabLayout 等这些控件的用法我就不讲了，不懂的或者不清楚的就去看...问题上次关于仿稀土掘金的文章发出后，我看到有人在微信后台跟我留言，也有人在github上给我提问题，大约问的最多的有三个问题。原图是沉浸状态栏，你的这个模仿的效果图没有做到。...第二个问题以前的毛玻璃效果，是我从网上找的一个毛玻璃算法，然后搞出来的，确实很慢，然后我在网上找更快的加载的速度的算法，找来找去，网上都是那几种，最快的也得白屏四秒，最后终于搞定了一个快的，真的是脑子不灵活了...就是这么解决的。怎么使用的，我相信用过glide的都会吧，如果你没用过，就去下载源码吧，里面写的非常简单。

6528 0

TabLayout 的几种用法

1.结合ViewPager使用这是最常见的用法了，实现也比较简单。...[tablayout01.gif] 布局文件： <android.support.design.widget.TabLayout android:id="@+id...2.点击滑动选中，类似RadioGroup的效果 [tablayout02.gif] 不过它与RadioGroup不同在于它有下划线可以滑动，更动感......(TabLayout.Tab tab) { } }); 3.点击滑动到屏幕中央，并再次点击可取消 [tablayout03.gif] 这样的效果很实用，很多App都会有这样的效果，以前我都是用...HorizontalScrollView来实现的，设置点击的item滑动到屏幕中央。

1.3K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭