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

在折叠appBarLayout时更改菜单项的颜色

在折叠AppBarLayout时更改菜单项的颜色可以通过使用CollapsingToolbarLayout和AppBarLayout来实现。CollapsingToolbarLayout是一个可折叠的工具栏布局,而AppBarLayout是一个可滚动的应用栏布局。

要在折叠AppBarLayout时更改菜单项的颜色,可以按照以下步骤进行操作:

  1. 在布局文件中,将AppBarLayout和CollapsingToolbarLayout添加到你的布局中,如下所示:
代码语言:txt
复制
<androidx.coordinatorlayout.widget.CoordinatorLayout
    ...>

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

        <com.google.android.material.appbar.CollapsingToolbarLayout
            ...
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <!-- 在这里添加你的折叠布局内容 -->

            <androidx.appcompat.widget.Toolbar
                ...
                app:layout_collapseMode="pin" />

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

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

    <!-- 在这里添加你的内容布局 -->

</androidx.coordinatorlayout.widget.CoordinatorLayout>
  1. 在代码中,通过使用addOnOffsetChangedListener方法来监听AppBarLayout的折叠状态,并在不同的折叠状态下更改菜单项的颜色。例如,当AppBarLayout完全展开时,将菜单项的颜色设置为透明,当AppBarLayout折叠时,将菜单项的颜色设置为指定的颜色。示例代码如下:
代码语言:txt
复制
AppBarLayout appBarLayout = findViewById(R.id.appBarLayout);
final MenuItem menuItem = menu.findItem(R.id.menu_item);

appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
    @Override
    public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
        int totalScrollRange = appBarLayout.getTotalScrollRange();
        int offsetPercentage = Math.abs(verticalOffset) * 100 / totalScrollRange;

        if (offsetPercentage == 0) {
            // 完全展开
            menuItem.setIcon(R.drawable.ic_menu_transparent);
        } else if (offsetPercentage >= 100) {
            // 完全折叠
            menuItem.setIcon(R.drawable.ic_menu_color);
        } else {
            // 在展开和折叠之间的过渡状态
            int color = calculateColor(offsetPercentage);
            menuItem.setIconTintList(ColorStateList.valueOf(color));
        }
    }
});

private int calculateColor(int offsetPercentage) {
    // 根据折叠的百分比计算颜色
    // 返回对应的颜色值
}

在上述代码中,我们通过计算AppBarLayout的折叠百分比来确定菜单项的颜色。根据折叠的百分比,你可以使用calculateColor方法来计算对应的颜色值。

这样,当你折叠AppBarLayout时,菜单项的颜色将根据折叠的状态进行相应的更改。

对于腾讯云相关产品,你可以考虑使用腾讯云移动应用分析(MTA)来跟踪和分析用户在折叠AppBarLayout时的行为数据。MTA是一款提供应用数据分析和统计的产品,可以帮助你了解用户的使用习惯和行为,从而优化你的应用。

腾讯云移动应用分析(MTA)产品介绍链接地址:https://cloud.tencent.com/product/mta

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

相关·内容

CollapsingToolbarLayout使用

CollapsingToolbarLayout 可以看到,Toolbar标题放大并在下方显示,当我们向上滑动列表,顶部Header部分图片向上折叠隐藏,标题向上移动并缩小,同时以渐显式方式显示蓝色主题...关于CollapsingToolbarLayout属性官网上可以查到,这里我只介绍案例中我们常用几个属性:title标题,布局展开放大显示图片底部,布局折叠缩小显示Toolbar左侧。...attr/colorPrimaryDark",即style样式中定义沉浸式状态栏颜色。...attr/colorPrimary",即显示为Toolbar颜色,应用主题色;layout_collapseMode折叠模式,设置其他控件滚动自身交互行为,有两种取值:parallax,折叠视差效果...作为AppBarLayout直接子控件,CollapsingToolbarLayout包裹Header部分ImageView和Toolbar,并分别设置二者折叠模式。

2.4K60

AppBarLayout和CollapsingToolbarLayout闲谈

了解 CollapsingToolbarLayout主要是提供一个可折叠Toolbar容器,对容器中不同View设置layout_collapseMode折叠模式,来达到不同折叠效果。...通常CoordinatorLayout、AppBarLayout、CollapsingToolbarLayout搭配使用折叠效果目前已经很常见了,在网上有很多例子和文章,小编整理了一下知识点。...属性contentScrim 设置当完全CollapsingToolbarLayout折叠(收缩)后背景颜色。...属性scrimAnimationDuration 设置控制Toolbar收缩颜色变化持续时间 属性 layout_collapseMode 折叠模式,有两个值 pin:固定模式,折叠时候最后固定在顶端...parallax:视差模式,折叠时候会有个视差折叠效果。

1.6K30

细说 AppbarLayout,如何理解可折叠 Toolbar 定制

collapsed 折叠概念 其实我更愿意用伸缩解释这个概念。 ? 红框部分标明不能再被压缩范围,其它部分都可以滑动过程中伸缩。...Toolbar 先滑动,等到视图可见范围高度为 collapsed 指定高度它会静止,等到 NestedScrollView 内容完全显示 Toolbar 下方它再一起滑动,它动作是 3 段式...比如一个按钮,一般按钮正常时候背景色是一种颜色,而按下去时候,按钮会变化背景颜色,这就是一种反馈。 反馈提示了状态变化。...还是以按钮为例,手指按下去,按钮给反馈是背景颜色发生改变,这种直接视觉效果差异就是反馈,它提示了按钮从正常状态到按下状态变化。 那好。现在,我们再来思考 Toolbar。...指定 Contetn scrim 后,CollapsingToolbarLayout 会在折叠状态显示指定颜色或者是图片,它就像是一块纱布一样遮住 title 下面的内容,所以被称为内容纱布。

2.6K30

CoordinatorLayout使用全解析

AppBarLayout AppBarLayout是LinearLayout子类,必须在它子view上设置app:layout_scrollFlags属性或者是代码中调用setScrollFlags...,它可以控制包含在CollapsingToolbarLayout中控件(如:ImageView、Toolbar)响应layout_behavior事件作出相应scrollFlags滚动事件(移除屏幕或固定在屏幕顶端...CollapsingToolbarLayout可以通过app:contentScrim设置折叠工具栏布局颜色,通过app:statusBarScrim设置折叠状态栏颜色。...pin:CollapsingToolbarLayout折叠后,此布局将固定在顶部。 parallax:CollapsingToolbarLayout折叠,此布局也会有视差折叠效果。...相匹配,用来通知AppBarLayout 这个特殊view何时发生了滚动事件,这个behavior需要设置触发事件(滚动)view之上。

1.9K20

Material Design 实战 之 第六弹 —— 可折叠式标题栏(CollapsingToolbarLayout) & 系统差异型功能实现(充分利用系统状态栏空间)

就表示该控件会出现在系统状态栏里; 2.2 程序主题中将状态栏颜色指定成透明色; 主题中将android:statusBarColor属性值指定成@android:color...app:contentScrim指定CollapsmgToolbarLayout趋于折叠状态以及折叠之后背景色, 其实CollapsingToolbarLayout折叠之后就是一个普通Toolbar...以及, app:layout_collapseMode用于指定当前控件CollapsingToolbarLayout折叠过程中折叠模式, 其中Toolbar指定成pin,表示折叠过程中位置始终保持不变...然后FruitAcuvityTheme中将状态栏颜色指定成透明色, 由于values-v21目录是只有Android5.0及以上系统才会去读取, 因此这么声明是没有问题。...因为Android5.0之前系统无法指定状态栏颜色,因此这里什么都不用做就可以了。

2.2K40

界面无小事(九): 做个好看伸缩头部

如果在此之前任何兄弟视图没有此标志, 则此值无效. exitUntilCollapsed 退出(滚动屏幕), 视图将滚动直到“折叠”. 折叠高度由视图最小高度定义。...snap 滚动结束, 如果视图仅部分可见, 则它将被捕捉并滚动到其最近边缘. enterAlways 当进入(屏幕上滚动), 无论滚动视图是否也滚动, 视图都将滚动任何向下滚动事件....这通常被称为“快速返回”模式. enterAlwaysCollapsed 'enterAlways'另一个标志, 它修改返回视图, 最初只回滚到它折叠高度....一旦滚动视图到达其滚动范围末尾, 该视图其余部分将滚动到视图中. 折叠高度由视图最小高度定义....* per); mContentMask.setBackgroundColor(Color.argb(alpha, 48, 63, 159)); } 前面也说了, 就是变化遮罩透明度, 这个颜色是对应了布局中设置颜色

95020

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

AppBarLayout里面的View,通过app:layout_scrollFlags属性来控制,滚动时候表现。其中有4种Flag类型。...是一个竖直方向线性布局,如果里面包含多个子View,要想有折叠动画效果,必须把带有scroll flagview放在前面,这样收回view才能让正常退出,而固定view继续留在顶部。...,它可以控制包含在CollapsingToolbarLayout中控件响应layout_behavior事件作出相应scrollFlags滚动事件(移除屏幕或固定在屏幕顶端)。...这里我对AppBarLayout设置了一个监听,它有一个监听方法:addOnOffsetChangedListener监听折叠收缩位移。...如果设计需求不要求选项卡在切换附带有图标的切换效果,仅仅文字颜色发生变化以响应用户点击事件,那么TabLayout和ViewPager建立联系可以用官方提供方法,它可以做到交互双向联动,也就是点击

2.2K90

Android 三级NestedScroll嵌套滚动实践

现在官方 View 实现也是通过 NestedScrolling(Parent2/Child2),所以我们实现自定义嵌套滚动尽量用 2。...三级嵌套滚动 一个常见嵌套滚动例子是 CoordinatorLayout/AppbarLayout – RecyclerView, 实现效果是向上滑动列表,会先将 AppbarLayout 向上滑动直到完全折叠...这里滑动逻辑是: 向上滑动,最先折叠刷新动画,向下滑动最后展开刷新动画。 向上滑动列表折叠 AppbarLayoutAppbarLayout 完全折叠后再折叠搜索框。...向下滑动列表展开 AppbarLayout 之前先展开搜索框。 列表没滑动到顶部可以通过触发一定速度向下 fling 来展开搜索框。...onPreScroll 中执行折叠 AppbarLayout 逻辑,onAfterPreScroll 中执行搜索框折叠逻辑。

1.5K30

Android开发笔记(一百三十五)应用栏布局AppBarLayout

对于大家关心额外功能,则主要有以下几点: 1、支持响应主体页面的滑动行为,即在主体页面上移或者下拉AppBarLayout能够捕捉到主体页面的滚动操作; 2、AppBarLayout捕捉到滚动操作之后...RecyclerView是其中一个特工,它可用来替代ListView和GridView;替代ScrollView则另有其人,它便是嵌套滚动视图NestedScrollView,Android5.0之后...所以,搜遍AndroidSDK源码,总共也只有三个控件符合这个条件,它们是RecyclerView、NestedScrollView,以及SwipeRefreshLayout,布局文件中使用名称如下所示...2、AppBarLayout内部高度也可能变化,比如它嵌套了可折叠工具栏布局CollapsingToolbarLayout,有关可折叠工具栏布局详细介绍参见《Android开发笔记(一百三十六)可折叠工具栏布局...5、snap : 在用户手指松开,系统自行判断,接下来是全部向上滚到顶,还是全部向下展开。 点击下载本文用到应用栏布局工程代码 点此查看Android开发笔记完整目录

1.9K40

Android--AppBarLayout基本使用

AppBarLayout一般用于赋予Toolbar(不限于Toolbar)滚动行为,AppBarLayout是一个垂直LinearLayout,实现了Material Design中app barscrolling...AppBarLayout只有作为CoordinatorLayout直接子View才能正常工作,为了让AppBarLayout能够知道何时滚动其子View, 我们还应该在CoordinatorLayout...4.exitUntilCollapsed--需要和minHeight一起配合使用,否则没效果 Toolbar完全展开不遮挡滑动控件,消失效果变为折叠成最小高度,其他和scroll相同 ?...5.snap Toolbar折叠高度大于原高度50%,则完全折叠,否则恢复展开,同样展开高度大于50%,则完全展开,否则恢复折叠 ?...6.snapMargins 根据滑动距离折叠或者展开Toolbar ?

3.4K20

项目中运用Meterial Design实现动画效果

导语 2015 年 I/O 开发者大会上,Google 介绍了一个新 Android Design Support Library,该库可以帮助开发者应用上使用 meterial design...这个动画效果最重要重点使用了CollapsingToolbarLayout可实现Toolbar折叠效果。...有几个重要属性需要重点介绍下: 1、app:contentScrim="#30469b" 设置当完全CollapsingToolbarLayout收缩后ToolBar背景颜色。...5、app:layout_collapseMode=”parallax” app:layout_collapseMode="pin" 子视图折叠模式,有两种,经常使用: pin:设置为这个模式...,当CollapsingToolbarLayout完全收缩后,Toolbar还可以保留在屏幕上,折叠时候最后固定在顶端; parallax:视差模式,折叠时候会有个视差折叠效果。

38330

Android 折叠式布局

从头开始 先建立一个名为 Folding 项目,然后创建一个Activity, OneActivity 这个Activity带有自身XML布局文件, ** 标题栏折叠** 首先打开activity_one.xml...嵌套好之后设置一些简单样式即可 到这一步基本上这个折叠布局已经完成了,然后只要填充相关控件即可实现效果,要注意点是Toolbar中放置是你需要折叠和展开控件,而AppBarLayout中放置是...Toolbar折叠之后显示控件,这个地方你可以放任何控件,前提是你得避免控件之间冲突。...到这里我们就已经实现了这个折叠式,当你点击这个蓝色背景标题往上面滑动,ImageView就会折叠起来,往下滑动图片就会展开。...为了使体现更好可以AppBarLayout下面放一个滚动条,不要用ScrollView而是NestedScrollView因为这里你是要联动

1.4K20

【Android】5.x炫酷标题栏动画使用理解

新控件介绍、使用等等网上相应文章已经特别多了,题主也没那能力去写篇详解出来,本篇随笔记录主要是题主学习这些新控件遇见一些困惑以及搞了半天后一丝理解,或许也有新手也会碰到跟我一样困惑,相互学习哈...CollapsingToolbarLayout则只是一个对Toolbar进行包装,实现了可以对标题栏进行折叠功能一个基本容器,它是作为AppBarLayout直接子布局来使用。...当滑动屏幕,子控件都做出了相应行为(滑出屏幕,固定顶端等),这些行为其实就是AppbarLayout提供给它子控件功能。...至于CollapsingToolbarLayout则是给子控件提供了折叠功能,什么是折叠呢?...题主开始想当然以为CollapsingToolbarLayout上面只设置scroll值,ImageView、上设置snap,Toolbar上面设置exitUntilCollapsed。

1K60

详解android特性之CoordinatorLayout用法探析实例

当我AS上新建一个module,系统默认最外层布局不再是我们熟悉五大布局中一种,而是一个全新布局:CoordinatorLayout。...何时发生了滚动事件,这个behavior需要设置触发事件(滚动)view之上。...下面来通过flag为exitUntilCollapsed,来实现Toolbar折叠显示效果。...实现视觉差属性主要来自于app:layout_collapseMode=”parallax”,这个flag代表是视差模式,即在折叠时候会有视差折叠效果,而“pin”,固定模式,就是折叠最后固定在最顶端...CoordinatorLayout工作原理是搜索定义了CoordinatorLayout Behavior子view,不管是通过xml中使用app:layout_behavior标签还是通过代码中对

85441
领券