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

Android -在用户触摸时显示/隐藏应用程序中的工具栏,具有上下滑动动画

Android中,要在用户触摸时显示/隐藏应用程序中的工具栏并添加上下滑动动画,可以使用CoordinatorLayout和AppBarLayout来实现。

CoordinatorLayout是一个特殊的FrameLayout,用于协调子视图之间的交互行为。它可以包含AppBarLayout作为直接子视图,以实现工具栏的显示和隐藏效果。

AppBarLayout是一个垂直滚动的容器,通常作为CoordinatorLayout的直接子视图。它可以包含一个或多个工具栏(Toolbar)作为子视图,并支持滚动事件的响应。

下面是实现该效果的步骤:

  1. 在XML布局文件中,将CoordinatorLayout作为根布局,并添加AppBarLayout和其他内容布局。
代码语言:txt
复制
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

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

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

</android.support.design.widget.CoordinatorLayout>
  1. 在Activity或Fragment中,找到Toolbar并设置为ActionBar。
代码语言:txt
复制
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
  1. 如果需要监听滚动事件并根据滚动状态显示/隐藏工具栏,可以通过给AppBarLayout添加OnOffsetChangedListener来实现。
代码语言:txt
复制
AppBarLayout appBarLayout = findViewById(R.id.appBarLayout);
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
    @Override
    public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
        if (verticalOffset == 0) {
            // 完全展开
            // 显示工具栏
            toolbar.setVisibility(View.VISIBLE);
        } else if (Math.abs(verticalOffset) >= appBarLayout.getTotalScrollRange()) {
            // 完全折叠
            // 隐藏工具栏
            toolbar.setVisibility(View.GONE);
        } else {
            // 部分折叠
            // 可以根据需要做其他操作,例如渐变透明度等
        }
    }
});

这样,当用户在应用程序中滑动屏幕时,工具栏将根据滚动状态进行显示或隐藏,并可以添加相应的动画效果。

推荐腾讯云相关产品:

  • 云服务器(CVM):提供安全、可靠的虚拟化服务器实例,支持灵活的网络配置和弹性伸缩。
    • 产品链接:https://cloud.tencent.com/product/cvm
  • 云存储(COS):提供高可靠、低成本的对象存储服务,适用于多媒体存储、大数据分析、备份和归档等场景。
    • 产品链接:https://cloud.tencent.com/product/cos
  • 人工智能语音交互(AI 语音交互):为开发者提供一站式语音交互能力,实现语音识别、语音合成等功能。
    • 产品链接:https://cloud.tencent.com/product/ai/speech

请注意,以上推荐的产品链接是基于腾讯云提供的服务,仅供参考。如果需要具体的定价、功能细节以及更多产品选择,建议访问腾讯云官方网站进行了解。

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

相关·内容

【最新】iPhone X 交互设计官方指南

所有的应用程序都应遵循 UIKit 定义安全区域和布局边距,这些区域可以根据设备和上下文进行适当填充。安全区域还能够防止内容把状态栏、导航栏、工具栏和标签栏覆盖掉。 注意状态栏高度。...但是请注意,当背景任务(例如录音和位置跟踪)处于活动状态,iPhoneX 上状态栏并不会改变高度。 如果你应用程序隐藏状态栏进行了隐藏,那么请重新考虑 iPhone X 上设计。...iPhone 上显示高度为 4.7 英寸,并且它屏幕上提供了更多垂直空间内容,状态栏占据了你应用程序本来可以使用屏幕区域,状态栏还显示了对人们有用信息,只有交换附加值时候才能被隐藏。...当启用自动隐藏,如果几秒钟内用户没有触摸屏幕,那么Home 键将会被自动隐藏。如果用户再次触摸屏幕,虚拟 Home 键会重新出现。上述行为应该只被用在被动观看场景体验,例如在播放视频或幻灯片时。...只有极其少数情况下,例如游戏这样沉浸式应用才有可能需要对屏幕边缘手势进行自定义。手势具有优先级: 第一次滑动会调用你应用手势,第二次滑动才会调用系统手势。

1.9K20

关于系统工具栏和全屏沉浸模式

这么做意义就是可以让用户目光焦点集中程序要显示内容上面,避免了屏幕上过多东西分散用户注意力。   可能这么说起来感觉这么做没有太大意义,但实际上用户体验就是各方面一点点细节积累起来。...比如你 activity onCreate() 方法里设置隐藏标志,用户按下 Home 键, status bar 会再度显示,之后再打开应用程序,status bar 会保持显示状态。...setSystemUiVisibility() 方法只可见 view 设置才有效,比如设置 View.gone 就没有效果 切换 view 会把当前 view 设置 flag 清空 将程序内容显示...bar)   这个模式效果为隐藏上下两条 bar,同时你 bar 范围内点击事件也不会将其唤出,这为程序操作提供了很大便利。...如果希望用户体验沉浸模式,那就用 STICKY 标志 如果像视频播放器那样用户交互就很少,就不要用 IMMERSIVE 了,之前写内容就可以满足需求   使用 IMMERSIVE 标志隐藏 bar

1.5K20
  • 最新iOS设计规范三|3大界面要素:栏(Bars)

    视图(Views) 包含用户APP中看到基本内容,例如:文本、图片、动画以及交互元素。视图可以具有滚动、插入、删除和排列等交互行为。 控件(Controls) 控件,是用于触发操作并传达信息。...iOS 13及更高版本,可以通过删除导航栏阴影来隐藏导航栏底部边框(当滑动内容区域,边框会自动重新出现)。无边框样式大标题导航栏效果很好,因为它增强了标题和内容之间联系感。...搜索栏可以单独显示,也可以显示导航栏或内容视图中。当显示导航栏,可以将搜索栏固定在导航栏,以便始终可以调用。也可以将其折叠,当用户向上滑动展开显示。...允许用户隐藏侧边栏以为其内容创造更多空间,并使用内置边缘滑动手势再次显示侧边栏。避免默认情况下隐藏边栏。 侧边栏标题要保持简洁明了。省略不必要和多余词。...如果没有状态栏,人们必须离开您应用程序才能检查时间或查看他们是否具有Wi-Fi连接。人们可以使用简单可发现手势重新显示隐藏状态栏。

    9.9K10

    ListView上滑和下滑,显示隐藏Toolbar实现方法

    1.准备Toolbar 先隐藏系统自带actionbar,AndroidManifest.xml文件<application 标签android:theme="@style/Theme.AppCompat.Light.NoActionBar...private float mFirstY;//用户首次触摸Y坐标 private float mLastY;//用户滑动结束Y坐标 private ObjectAnimator mAnimator...RelativeLayoutToolbar遮挡ListView第一项; (2)设置ListView触摸监听事件: 当用户首次按下(MotionEvent.ACTION_DOWN),记录开始Y坐标;...在用户滑动过程(MotionEvent.ACTION_MOVE),记录用户当前手指Y坐标;两者比较可以判断出用户手指滑动方向; (3)使用 ObjectAnimator类控制Toolbar动画效果...: 如果不是这样做,那用户不断滑动过程,会不断触发onTouch方法,不断地执行toolbarAnim方法,导致滑动效果很不流畅(从Log可以发现这一点) 实现效果: ?

    1.1K20

    Android下拉阻尼效果实现原理及简单实例

    最新微信版本还实现了一个具有惯性滑动列表(不清楚这样表述是否正确),滑动速度大小和小程序入口下拉阻尼效果会形成互动,但这已不是本文讨论重点,这需要感兴趣读者自行对我代码进行迭代。...基本布局原理差不多就这样了,但是我们还需要让自定义控件监听用户手势操作,例如上下滑动等。...注意,对于不能监听屏幕触摸事件控件需要添加: android:clickable=”true” 至此,我们已经可以进行布局和监听用户手势了,但是还需要实现一个头部展开和隐藏动画效果。...还是拿最新版微信小程序入口来讲,用户在下拉,小程序界面会占用整个屏幕,如果触发动画分界线太低,这样导致结果是用户可能无法通过上滑重新返回联系人列表,但由于微信没有对滑动距离进行减半处理,所以不存在上述问题...,初始值由mRatio计算得到 * 头部处于隐藏等于mUnfoldBoundary * 头部处于展开等于mHideBoundary * mBoundaryonTouchACTION_DOWN变化

    2.6K10

    listview上滑下滑监听,上下滑监听隐藏顶部选项栏实例

    listview上滑下滑监听,来隐藏显示顶部选项栏特效,京东 同程等APP资源列表都有此特效....两个重点: ①listviewsetOnTouchListener监听方法 当滑动Y位置减去按下Y位置大于最小滑动距离则为向下滑动 反之,当按下Y位置减去滑动Y位置大于最小滑动距离则为向上滑动...protected float mFirstY;//触摸下去位置 protected float mCurrentY;//滑动Y位置 protected int direction;//判断是否上滑或者下滑标志...();//系统级别的一个属性,判断用户最小滑动距离,可查看源码为16 //给集合添加数据 for (int i = 0; i < 40; i++) { Map<String, Object map...以上这篇listview上滑下滑监听,上下滑监听隐藏顶部选项栏实例就是小编分享给大家全部内容了,希望能给大家一个参考。

    1.1K00

    iPhone X 适配指南 (官方翻译版)

    所有应用程序都应遵循UIKit定义安全区域和布局边距,这些区域可以根据设备和上下文进行适当填充。安全区域还可以防止内容覆盖状态栏,导航栏,工具栏和标签栏。 注意状态栏高度。...iPhone X具有不同于4.7 寸iPhone长宽比,因此,全屏4.7 寸iPhone图形iPhone X上全屏显示出现裁剪或letterboxed。...当启用自动隐藏,如果用户没有触摸屏幕几秒钟,指示灯将熄灭。当用户再次触摸屏幕,它会重新出现。这种行为应该只能用于被动观看体验,如播放视频或照片幻灯片。 请参阅适应性和布局。...手势 iPhone X上显示屏使用屏幕边缘手势来访问主屏幕,应用程序切换器,通知中心和控制中心。 避免干扰系统范围屏幕边缘手势。人们依靠这些手势每个应用程序工作。...极少数情况下,像游戏这样沉浸式应用程序可能需要自定义屏幕边缘手势,优先于系统手势 - 第一个滑动会调用特定于应用手势,而第二次滑动则会调用系统手势。

    2.5K50

    【Hybrid开发高级系列】ReactNative(七) —— RN组件专题

    onSlidingComplete函数         当用户已经完成改变它值后,调用回调函数(例如,当滑动块被释放)     onValueChange函数         当用户拖动滑动,连续不断调用回调函数...如果工具栏具有唯一子级,它将显示标题和操作之间。...some_icon')     • show :当把这个操作显示为一个图标或隐藏在溢出菜单:always , ifRoom或never     • showWithText :布尔值,是否显示图标旁边文本...4.1.2 将静态资源添加到您Android应用程序         将您图像作为位图画板添加到android项目中( /android/app/src/main/res)。...NOTE:生成应用程序所需新资源         无论什么时候您把新资源添加到您画板您都需要在使用它之前通过运行react-nativerun-android重新构建您应用程序-仅重新加载JS

    55740

    最新iOS设计规范七|10大视觉规范(Visual Design)

    较大设备上显示文本,应留有可读性页边距。这些边距使文本行足够短,以确保舒适阅读体验。 适应上下变化 在上下文变化期间确保聚焦在当前内容。内容是APP优先级最高。...允许自动隐藏指示器以防误点入主屏幕。启用自动隐藏后,如果用户几秒钟未触摸屏幕,指示灯就会淡出。当人们再次触摸屏幕,它会重新出现。此行为仅适用于被动观看体验,如播放视频或照片幻灯片。...确保动画符合现实且可靠。人们倾向于接受充满艺术东西,但动画没有意义或似乎违反物理法则,他们会感到迷失方向。例如:如果有人通过从屏幕顶部向下滑动显示视图,他们应该也能够通过向上滑动来消除视图。...六、启动画面(Launch Screen) 应用程序启动时会立即显示启动屏幕,并很快被应用程序第一个屏幕替换,给人印象是您应用程序具有快速响应能力。启动屏幕不是表达艺术机会。...例如:当用户使用iPad,就不要显示iPhone 提示或图标。保持与平台一致语言。你可以点击、轻击、滑动、捏和拖动触摸屏上内容。你可以按物理按钮和内容来响应3D Touch。

    8.1K30

    最新iOS设计规范五|3大界面要素:控件(Controls)

    视图(Views) 包含用户APP中看到基本内容,例如:文本、图片、动画以及交互元素。视图可以具有滚动、插入、删除和排列等交互行为。 控件(Controls) 控件,是用于触发操作并传达信息。...情境菜单会立即弹出与相关命令;Peek和Pop则需要向上滑动才能查看命令。 用户可以通过系统定义触摸并按住或3D Touch来显示情境菜单,(3D Touch可以使情境菜单更快地显示)。...打开,情境菜单将显示该项预览并列出对其起作用命令。用户可以选择命令或将项目拖动到另一个区域、窗口或应用程序。 采用一致上下文菜单。...将进度条用于持续时间明确任务。进度条非常适合显示任务状态,尤其是当它帮助传达任务需要完成多长时间导航栏和工具栏隐藏轨道未填充部分。默认情况下,进度条轨道包含已填充和未填充部分。...例如,“文件”应用程序“更多”菜单使用分隔符来帮助用户快速查看和排序项目。不过分组不要大于三个,否则不容易辨认。 让用户知道菜单项何时具有破坏性,并要求用户二次确认。

    8.6K30

    Android经典实战之用WindowInsetsControllerCompat方便显示隐藏状态栏和导航栏

    WindowInsetsControllerCompat 是 Android 一个类,用于更方便地处理和控制窗口插入 (Window Insets),例如状态栏和导航栏显示隐藏。...它简化了不同 API 级别上控制系统窗口插入复杂性,使得开发者能够更轻松地处理状态栏和导航栏显示/隐藏动画过渡等操作。...主要有三个常量可用: 1、 BEHAVIOR_SHOW_BARS_BY_SWIPE(滑动显示系统栏): 当系统栏隐藏用户可以通过从系统栏区域向内滑动显示。...): 当系统栏隐藏用户可以通过触摸屏幕任意位置来显示系统栏。...): 当系统栏隐藏用户可以通过从系统栏区域向内滑动来临时显示系统栏。

    19910

    Material Design技术分享

    Material Design强调有三点: 实体隐喻,其实就是立体感。 鲜明,形象,合理视觉,简单点说就是时刻琢磨用户想法,并且体现在页面布局。 有意义动画效果。   ...一、环境   Material环境是基于三维立体空间,每一个处于界面显示UI对象都有一个三维坐标(x,y,z),一般来说在手机平面显示位置相对于用户来讲只有平面xOy,但是有了z轴加入,用户视角就变得更加立体...实现导航同时动态滑动隐藏toolbar动画,这是最常见主界面框架。...,那么子View下滑ToolBar和TabLayout都会隐藏了。...创建吊起新activity或者从activity返回,用来管理场景退出和共享元素退出。

    2.2K60

    从零开始Android:常见UI设计模式

    此模式关键特征是,列表/网格每个项目在被选中都应执行显示更多详细信息相同操作。...Google Play商店应用程序可以看到这种模式示例,该应用程序显示了可浏览多种类别应用程序轮播。 地图 并非所有的应用程序都是围绕需要显示用户数据列表而构建。...工具列 您可能已经注意到,Android应用程序大多数页面屏幕顶部都包含一个工具栏。...至少,该工具栏包含该部分或应用程序标题,但是工具栏设计模式还有助于将操作按钮直接放置工具栏或溢出菜单,以允许用户应用程序该部分执行任务。...浮动动作按钮 浮动操作按钮模式使开发人员可以突出显示用户应用程序一部分可以执行单个操作。

    2.7K20

    ListView滑动隐藏显示ToolBar实例

    引言 App日益追求体验时代,优秀用户体验往往会使产品脱颖而出。今天我们就来介绍一种简单滑动ListView来显示或者隐藏ToolBar功能。...widget.Toolbar </RelativeLayout 主界面代码 实现思路: 让一个布局显示或者隐藏并且带有动画效果,我们可以通过属性动画来实现。...) { direction = 1; } //如果是向上滑动,并且ToolBar是显示,就隐藏ToolBar if (direction == 1) { if (mShow) { toobarAnim...R.dimen.abc_action_bar_default_height_material)); view.setLayoutParams(params); listView.addHeaderView(view); } /** * ToolBar显示隐藏动画...以上这篇ListView滑动隐藏显示ToolBar实例就是小编分享给大家全部内容了,希望能给大家一个参考。

    1.3K30

    第134天:移动web开发一些总结(二)

    img{ max-height: 100% } 设计点三:重新布局,显示隐藏 当页面达到手机屏幕宽度时候,很多时候就要放弃一些传统页面设计思想。...(原因与300ms有关) tap透传解决方案: ①使用缓存动画,过渡300ms延迟 ②中间层dom元素加入,让中间层接收这个“穿透”事件,稍后隐藏 ③“上下”都使用tap事件,原理上解决tap穿透事件...touchstart:手指触摸屏幕触发(已经有手指放屏幕上不会出发) touchmove:手指在屏幕上滑动,连续触发 touchend:手指离开屏幕触发 touchcancel:系统取消touch时候触发...(不常用)eg:滑动页面来了一个电话或者其他系统事件 除常见事件属性外,触摸事件包含专有的触摸属性: touches:跟踪触摸操作touch对象数组 targetTouches:特定事件目标的touch...(3) 弹性滚动,下拉刷新 ①弹性滚动:当客户端页面滚动到顶部或底部时候,滚动条会收缩并让我们多滑动一定距离。通过缓冲反弹效果,带给用户良好体验。

    1.8K10

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

    ”基本实现两个功能: 作为顶层布局 调度协调子布局 CoordinatorLayout使用新思路通过协调调度子布局形式实现触摸影响布局形式产生动画效果。...Scroll: 表示向下滚动,这个View会被滚出屏幕范围直到隐藏. enterAlways: 表示向上滚动,这个View会随着滚动手势出现,直到恢复原来位置. enterAlwaysCollapsed...,它可以控制包含在CollapsingToolbarLayout控件响应layout_behavior事件作出相应scrollFlags滚动事件(移除屏幕或固定在屏幕顶端)。...同理这是展开Title文字特点外形设置 app:contentScrim 这是toolbar 标题工具栏停留在顶部时候背景设置 app:expandedTitleMarginStart 设置扩张时候...我在做这里时候遇到一个问题,那就是CollapsingToolbarLayout里Title问题,一般默认是显示,即使你不写,它也有会一个默认值一直显示在那里,等折叠收缩完时候,停留在标题工具栏

    2.3K90

    Android开发笔记(一百四十二)平滑翻页书籍浏览

    Android控件家族当中,比较接近上下层叠方式是栈视图StackView,它前后两项视图有部分是重叠在一起,然后可以通过上下滑动来切换当前显示顶层视图。...层叠翻页效果 上面提到StackView,仍然不完全符合现实生活书页排列,比如上下两页只是部分区域重叠不是完全覆盖,另外前后页面是通过上下滑动切换而不是通过左右滑动切换,所以要想实现现实生活层叠翻页效果...框架视图主要负责两块工作: 1、接管屏幕上触摸事件,通知当前页面视图向左或者向右滑动,并在松开手势判断接下来是继续翻页,还是恢复原状; 2、翻页结束屏幕上重新组织当前页面与前后两页,类似于...ViewPager+Fragment三页缓存机制; 页面视图主要负责三块工作: 1、将当前页面高亮显示,其它页面变暗显示; 2、按照用户手势触摸,将当前页面滑动相应距离; 3、在用户松开手势,如果当前页面滑动距离不超过页面宽度二分之一...,则将当前页滑动到原来位置;如果当前页面滑动距离超过页面宽度二分之一,则将当前页滑动到原来相反位置,即原来是显示则现在隐藏,原来是隐藏则现在显示

    1.2K10

    Android 仿美团悬浮购物车显示隐藏

    效果图: 这是美团效果 通过效果图可以看到 静止时候是购物车图标是显示滑动时候是隐藏一半并半透明显示。...这里用到一个触摸反馈方法dispatchTouchEvent MotionEvent.ACTION_DOWN://手指按下 MotionEvent.ACTION_MOVE://手指滑动 MotionEvent.ACTION_UP...://手指抬起 整体思路就是滑动过程,购物车图标向右位移,并加一个渐变效果。...,如果小于1s动画就不执行,避免快速反复滑动导致动画多次执行。...然后用一个定时器timer延时执行动画 在手指抬起时候记录当前时间戳,并执行动画 moveDistance就是计算移动距离 isShowFloatImage是一个布尔类型标识,判断图标状态是否显示

    99620

    iOS开发常用之网络

    TabBarController,支持自定义TabBarItem样式或添加动画 隐藏显示 SlideTapBar - 滚动栏菜单,向上滚动隐藏tabbar,向下滚动马上显示tabbar。...MediumScrollFullScreen - Medium可扩展滚动页面,上下滚动,全屏显示内容,并自然消隐上下菜单。...Persei - 动画隐藏显示顶部菜单支持库及示例项目.-- swift PDTSimpleCalendar - 是iOS最棒日历组件。...HUMSlider - HUMSlider是一款能够自动显示刻度记号滑杆,滑动到某处,该处刻度会自动上升,两边还能配置图像。支持代码或storyboard实现。...ADo_GuideView - 转动用户引导页(模仿网易bobo)因为没有从应用程序包里抓到@ 3x图片,建议iPhone5模拟器运行,保证效果〜(版本新特性,导航页,引导页)。

    23.6K10
    领券