先看效果Ok
下面我们粘布局 然后一点一点来介绍
<?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:fitsSystemWindows="true"
tools:context="com.android50.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll"
app:popupTheme="@style/AppTheme.PopupOverlay" />
<TextView
android:background="@android:color/holo_orange_light"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="作者:"
android:gravity="center|left"
android:textSize="20sp"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"></TextView>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
textview里的内容太长就省略了
大家可以看到我们整个代码全部是用布局来实现的 是不是 感觉代码萌萌哒呢 哈哈!!!
这些布局是在android5.0的时候出的,最值得高兴的是向下兼容的
第一 首先我们要引入
compile 'com.android.support:design:25.1.0'
这个包里也包括了RecyclerView
然后我们先来解释下toolbar这个控件
简单说 就是 actionBar的替代品 actionBar所拥有的特点 Toolbar全部拥有。
那为什么还要搞一个toolbar呢?
答案就是为了实现我们这么炫的布局效果。可以和别的控件组合起来产生出行云流水般的效果 ^^
诗歌那栏就是我们的toolBar了
再看包着toolBar的AppBarLayout 这哥们又是用来干啥的呢?
它可以让你定制当某个可滚动View的滚动手势发生变化时,其内部的子View实现某种动作。
最重要的就是内部的子view 那么问题又来了实现哪种动作?又怎么实现呢?
我们先看怎么实现 然后再一个一个来讲都有哪些动作?
app:layout_scrollFlags="scroll|enterAlways"
实现在的方式就是这句代码了 ,这个属性是加在appbarLayout的子view里的这个属性的值 分为四种 每一种是一个特效
scroll :
这个属性值的意思就是我们的view可以跟着我们下面设置的
SrollView 一起滚动,就像把两个控件粘合在一起了
enterAlways :
app:layout_scrollFlags=”scroll|enterAlways”
exitUntilCollapsed:
app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="150dp"
android:minHeight="50dp"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:popupTheme="@style/AppTheme.PopupOverlay" />
大家可以看下上面的代码 高度150dp 最小高度50dp 往上滑动的时候先到最小高度然后再滚动
enterAlwaysCollapsed:
app:layout_scrollFlags="scroll|enerAlways|enterAlwaysCollapsed"
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="150dp"
android:minHeight="50dp"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
app:popupTheme="@style/AppTheme.PopupOverlay" />
是不是很清楚了呢 ?这个时候又有一个疑问了 那么我们的toolBar能不能换成布局呢 换成 Imageview TextView这样的布局呢 答案是肯定的
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<ImageView
android:layout_width="match_parent"
android:layout_height="150dp"
app:layout_scrollFlags="scroll|enterAlways"
android:background="@mipmap/aaa"/>
</android.support.design.widget.AppBarLayout>
添加布局的
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="vertical"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:minHeight="50dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="150dp"
app:layout_scrollFlags="scroll|enterAlways"
android:background="@mipmap/aaa"/>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="@+id/tl">
</android.support.design.widget.TabLayout>
</LinearLayout>
大家可以看到我利用exitUntilCollapsed的特点 设置了最小高度
而我的tablayout的高度正好是最小高度
是不是觉得具然还可以这么玩,没错就是这么cool
再次提出一个疑问
我们最上边的实现是里面嵌套了两个view实现的 , 那么他的孩子到底可以有几个还可以组成什么样的格式来玩?
其实这个我也试过几个子view都可以 但是必须是 最后一个子view的上边的view必须能scroll滚动才行 否则上边不能滚 最下边的可以滚动 也是没有什么效果的。具体的还要大家自己尝试
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"></TextView>
</android.support.v4.widget.NestedScrollView>
还有一个这样的布局没有讲
这个NestedScrollView就是和我们上边的AppBarLayout一起实现连在一起滚动的,他滚动的最重要的一点就是这个属性
app:layout_behavior=”@string/appbar_scrolling_view_behavior”
固定写法就可以和上边联动了,当然behavior的强大不至于此 大家有兴趣的可以自己研究
**那么又会有同学再想 即然最关键的是属性能不能换成别的控件呢
答案是能 但是有局限性**
可以的有viewpager recylerView FrameLayout
具体的哪些可以用 我现在还在研究中 如果有哪位大神搞明白了也可以告诉我一下