Coordinatorlayout of Android Support Design Library

Source: Internet
Author: User
Tags call back

Android Support Design Library is a 5.0 Android supporting libraries, the minimum compatible version is Android 2.2, can be said to be a conscience product, previously written Android program always need to consider the version of the problem, Now using this Android support library development can not need to consider this kind of problem, this can be said to be another development language, below we will describe each of the controls in the How to use and its extension effects.


1. What is Coordinatorlayout


From its English name can be known as the "Coordinator", the Organization of the "coordination" sub-view of the parent view, which inherits from Framelayout, its default layout is one layer to the top overlay, as framelayout.


Its magical place lies in the behavior object. You can add a behavior to any view. Behavior is a series of callbacks. gives you the opportunity to add dynamic dependency layouts and handle the parent layout (coordinatorlayout) swipe gesture with non-intrusive view.


2.CollapsingToolbarLayout for foldable toolbar


The layout file code is as follows:


<?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:id= "@+id/main_content"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
Android:fitssystemwindows= "true" >

<android.support.design.widget.appbarlayout
Android:layout_width= "Match_parent"
android:layout_height= "256DP"
Android:fitssystemwindows= "true" >
<android.support.design.widget.collapsingtoolbarlayout
Android:id= "@+id/collapsing_toolbar_layout"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
App:contentscrim= "#30469b"
App:expandedtitlemarginstart= "48DP"
App:expandedtitlemarginend= "64DP"
Android:fitssystemwindows= "true"
app:layout_scrollflags= "scroll|exituntilcollapsed" >
<imageview
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
Android:scaletype= "Centercrop"
android:src= "@drawable/BIZ_LIVE_FOOT_BG"
App:layout_collapsemode= "Parallax"
app:layout_collapseparallaxmultiplier= "0.7"/>
<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.v7.widget.recyclerview
Android:id= "@+id/recyclerview"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
App:layout_behavior= "@string/appbar_scrolling_view_behavior"/>


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


The following properties need to be explained:


The ①app:layout_scrollflags has the following 4 values:


--scroll-You must set this if you want to scroll.
--enteralways-Fast return effect, when moving down, immediately display view (such as toolbar). Used in conjunction with the scroll as follows:



--exituntilcollapsed-Shrinks the view when scrolling up, but can be fixed toolbar always on top. Used in conjunction with the scroll as follows:



--enteralwayscollapsed-When your view has set the MinHeight property and uses this flag, your view can only enter at the minimum height, and only when the scrolling view reaches the top will it expand to full height.


②app:contentscrim: The background color when collapsingtoolbarlayout folds (shrinks).


③app:expandedtitlemarginstart and App:expandedtitlemarginend: The picture pulls out and pulls in, the distance from the left side of the caption. is moving the animation distance between


Two values for ④app:layout_collapsemode:


--pin-When set to this mode, toolbar can also remain on the screen when Collapsingtoolbarlayout is fully contracted.
--parallax-When set to this mode, when content scrolls, the view (such as ImageView) in Collapsingtoolbarlayout can also scroll simultaneously, realizing the parallax scrolling effect, usually and layout_ Collapseparallaxmultiplier (set parallax factor) with.



⑤app:layout_collapseparallaxmultiplier: Visual difference in child views


⑥app:layout_behavior= "@string/appbar_scrolling_view_behavior": The most important attribute, to achieve the linkage effect, you must set the linkage of the sliding control, such as Recyclerview. When this record Recyclerview scrolling, the animation of the title bar is effective.


3. Customizing a Behavior


㈠ Inheritance Behavior


public class Lyjbehavior extends Coordinatorlayout.behavior {
Public Lyjbehavior (context context, AttributeSet Attrs) {
Super (context, attrs);
}
}


㈡2 Method of Reference:


① referencing directly in the XML layout


App:layout_behavior= "Your behavior contains the class name of the package name"


② another way if your custom view defaults to using a behavior. Add @defaultbehavior (your behavior.class) annotation to your custom view class. Your view will use this behavior by default, the code is as follows:


@DefaultBehavior (AppBarLayout.Behavior.class)
public class Lyjlayout extends LinearLayout {}


㈢ the first thing to do after generating behavior is to determine the dependency relationship. Rewrite this method of behavior to determine which view you depend on.


@Override
public Boolean Layoutdependson (coordinatorlayout parent, view child, view dependency) {
Return Super.layoutdependson (parent, child, dependency);
}


Child refers to the application of the behavior view, dependency acts as the trigger behavior role, and interacts with the child. Determine whether you rely on this viewcoordinatorlayout to judge all of your view traversal. If the dependency is determined. This method is very important.


㈣ will call back this method when it depends on the view change.


@Override
public Boolean ondependentviewchanged (coordinatorlayout parent, view child, view dependency) {
Return super.ondependentviewchanged (parent, child, dependency);
}


4. Using a custom behavior


To customize a property:


<declare-styleable name= "Follow" >
<attr name= "target" format= "reference"/>
</declare-styleab<strong>le></strong>



Using code:


public class Lyjbehavior extends Coordinatorlayout.behavior {
private int targetid;
Public Lyjbehavior (context context, AttributeSet Attrs) {
Super (context, attrs);
TypedArray a = Context.obtainstyledattributes (Attrs, R.styleable.follow);
for (int i = 0; i < A.getindexcount (); i++) {
int attr = A.getindex (i);
if (A.getindex (i) = = R.styleable.follow_target) {
Targetid = A.getresourceid (attr,-1);//Get linkage ID
}
}
A.recycle ();

}

@Override
public Boolean Layoutdependson (coordinatorlayout parent, view child, view dependency) {
return Dependency.getid () = = Targetid;
}

@Override
public Boolean ondependentviewchanged (coordinatorlayout parent, view child, view dependency) {
Child.sety (Dependency.gety () +dependency.getheight ());//child no matter how dependency moves, it's under dependency.
return true;
}
}



The code in the XML is as follows:


<?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:id= "@+id/main_content"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
Android:fitssystemwindows= "true" >

<view
Android:id= "@+id/first"
Android:layout_width= "Match_parent"
android:layout_height= "128DP"
Android:background= "@android: Color/holo_blue_light"/>

<view
Android:id= "@+id/second"
Android:layout_width= "Match_parent"
android:layout_height= "128DP"
App:layout_behavior= "Com.example.liyuanjing.tablayoutdemo.LYJBehavior"
app:target= "@id/first"
Android:background= "@android: Color/holo_green_light"/>



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

App:target: In the incoming ID, the custom behavior will get the linkage view. Then, according to the linkage method you set in Ondependentviewchanged, linkage.





????

Coordinatorlayout of Android Support Design Library

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.