CoordinatorLayout使用详解基础篇

本篇主要分享CoordinatorLayout使用,在使用之前先看几张张效果图

效果图一

效果图二

效果图三

如果想要体验APP效果,可扫码下载APP体验
二维码
APP实现的微信和QQ自动抢红包功能在我之前的blog有详细分析
,以及7.0以后自动抢红包失效问题

CoordinatorLayout使用解析,大神路过,感谢能帮忙指正描述不正确的地方,如果你还是新手,本篇文章非常适合你来学习

效果图一实现了上滑一定距离显示toobar
效果图二图三实现标题跟随滚动显示,上滑到一定距离显示快速返回按钮

这里先分析图二图三实现,图一实现需要自定义Behavior,而图二和图三的效果,系统已经帮我们定义好了Behavior,我只需要配置好布局就可以了

老规矩先上代码

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">


        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CoordinatorLayout是Android Support Library中新增的一个布局容器,它继承自ViewGroup类。CoordinatorLayout的主要作用是协调子View之间的交互行为,可以让子View之间相互协调,实现一些比较复杂的交互效果。 1. 特点 - CoordinatorLayout可以作为根布局,内部可以包含多个子View。 - CoordinatorLayout可以通过设置各个子View之间的依赖关系,来实现各种复杂的交互效果。 - CoordinatorLayout默认会启用一个Behavior机制,通过设置Behavior可以对子View的布局和交互行为进行控制。 - CoordinatorLayout可以对子View进行移动、缩放、旋转等操作,实现各种炫酷的效果。 2. 使用使用CoordinatorLayout时,需要注意以下几点: - CoordinatorLayout必须作为根布局。 - 子View必须设置layout_behavior属性,用于指定Behavior。 - 子View之间可以通过设置app:layout_anchor属性和app:layout_anchorGravity属性来指定依赖关系。 - 子View的Behavior必须继承自CoordinatorLayout.Behavior类。 以下是一个简单的使用CoordinatorLayout的例子: ``` <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="match_parent" android:layout_height="200dp" android:src="@drawable/image" app:layout_behavior="@string/appbar_scrolling_view_behavior"/> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.design.widget.CollapsingToolbarLayout android:layout_width="match_parent" android:layout_height="200dp" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:layout_width="match_parent" android:layout_height="200dp" android:src="@drawable/image" android:scaleType="centerCrop" app:layout_collapseMode="parallax"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_collapseMode="pin"/> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.design.widget.FloatingActionButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/fab_margin" android:src="@drawable/ic_add" app:layout_anchor="@id/appbar" app:layout_anchorGravity="bottom|end"/> </android.support.design.widget.CoordinatorLayout> ``` 在这个例子中,CoordinatorLayout作为根布局,内部包含了一个ImageView、一个AppBarLayout和一个FloatingActionButton。通过设置各个View之间的依赖关系和Behavior,可以实现以下效果: - ImageView和AppBarLayout可以滚动。 - 当AppBarLayout滚动到顶部时,其中的Toolbar会固定在顶部。 - FloatingActionButton会跟随AppBarLayout一起滚动,并且会停留在AppBarLayout的底部。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值