Android Streaming layout implementation

View all my open source projects "open Source Labs"
Welcome to join my QQ group: "201055521", this blog client download "please click"

Summary

The new project used a new layout ———— Android label streaming layout features, just keep saying that the implementation of custom controls, today for everyone to talk about an Android streaming layout implementation.
This article original, reprint please specify address: http://blog.kymjs.com/

Body

In the daily app use, we will see in the Android app, such as hot tags, such as the flow of the automatic line layout, today, we will look at how to customize a similar to the hot tag like the Flow layout bar (source download at the end of the last given)

This control is not my implementation, the code is found from the Web-based search flow layout. I'm just explaining to you the implementation process and principles.

Look at the code first

 Public  class flowlayout extends viewgroup {    Private floatmverticalspacing;//per item vertical spacing    Private floatmhorizontalspacing;//per item horizontal spacing     Public FlowLayout(Context context) {Super(context); } Public FlowLayout(context context, AttributeSet attrs) {Super(context, attrs); } Public void sethorizontalspacing(floatpixelsize) {mhorizontalspacing = pixelsize; } Public void setverticalspacing(floatpixelsize) {mverticalspacing = pixelsize; }@Override    protected void onmeasure(intWidthmeasurespec,intHEIGHTMEASURESPEC) {intSelfwidth = Resolvesize (0, Widthmeasurespec);intPaddingleft = Getpaddingleft ();intPaddingtop = Getpaddingtop ();intPaddingright = Getpaddingright ();intPaddingbottom = Getpaddingbottom ();intChildleft = paddingleft;intChildtop = paddingtop;intLineheight =0;//By calculating the height of each child control, get its own height         for(inti =0, ChildCount = Getchildcount (); i < ChildCount;            ++i) {View Childview = Getchildat (i);            Layoutparams childlayoutparams = Childview.getlayoutparams ();                            Childview.measure (Getchildmeasurespec (widthmeasurespec, Paddingleft + paddingright,                            Childlayoutparams.width), Getchildmeasurespec (Heightmeasurespec, Paddingtop + paddingbottom, Childlayoutparams.height));intChildwidth = Childview.getmeasuredwidth ();intChildheight = Childview.getmeasuredheight (); Lineheight = Math.max (Childheight, lineheight);if(Childleft + childwidth + paddingright > Selfwidth)                {childleft = paddingleft;                Childtop + = mverticalspacing + lineheight;            Lineheight = Childheight; }Else{Childleft + = childwidth + mhorizontalspacing; }        }intWantedheight = childtop + lineheight + paddingbottom;    Setmeasureddimension (Selfwidth, Resolvesize (Wantedheight, Heightmeasurespec)); }@Override    protected void OnLayout(BooleanChangedintLintTintRintb) {intMywidth = r-l;intPaddingleft = Getpaddingleft ();intPaddingtop = Getpaddingtop ();intPaddingright = Getpaddingright ();intChildleft = paddingleft;intChildtop = paddingtop;intLineheight =0;//Based on the height of the child controls, calculate where the child controls should appear.          for(inti =0, ChildCount = Getchildcount (); i < ChildCount; ++i) {View Childview = Getchildat (i);if(childview.getvisibility () = = View.gone) {Continue; }intChildwidth = Childview.getmeasuredwidth ();intChildheight = Childview.getmeasuredheight (); Lineheight = Math.max (Childheight, lineheight);if(Childleft + childwidth + paddingright > Mywidth)                {childleft = paddingleft;                Childtop + = mverticalspacing + lineheight;            Lineheight = Childheight;            } childview.layout (Childleft, childtop, Childleft + childwidth, childtop + childheight);        Childleft + = Childwidth + mhorizontalspacing; }    }}

Speaking from the control creation process

1. When this flow layout is loaded as memory and displayed on the screen, this method first calls View.measure (W,h), which represents the width and height of the measurement view, where the parameter W and h respectively represent the width of the control's parent control.
2. In the invocation of the View.measure () method, a callback method of the view itself is called, onmeasure (), which is a callback method for the view itself that allows the developer to recalculate the size of the view when it is customized. It is common to iterate through this method to calculate the width and height of all descendants of the control.
3. After the view's wide-height calculation is complete, consider displaying the control to the specified position on the screen, at which point the view's OnLayout () method is called. In this method, it is common to calculate the position of all descendant controls in this control.
   Maybe the basic process is a bit boring, then take a look at the code.

Implementation of flow Layout

See this paragraph in the Onmeasure () method:

//By calculating the height of each child control, get its own height for(inti =0, ChildCount = Getchildcount (); i < ChildCount;        ++i) {View Childview = Getchildat (i);        Layoutparams childlayoutparams = Childview.getlayoutparams ();                        Childview.measure (Getchildmeasurespec (widthmeasurespec, Paddingleft + paddingright,                        Childlayoutparams.width), Getchildmeasurespec (Heightmeasurespec, Paddingtop + paddingbottom, Childlayoutparams.height));intChildwidth = Childview.getmeasuredwidth ();intChildheight = Childview.getmeasuredheight (); Lineheight = Math.max (Childheight, lineheight);if(Childleft + childwidth + paddingright > Selfwidth)            {childleft = paddingleft;            Childtop + = mverticalspacing + lineheight;        Lineheight = Childheight; }Else{Childleft + = childwidth + mhorizontalspacing; }    }

First, by looping through all the child controls of the control and calling the measure () method of the child control, the two parameters of the measure method are the maximum width that the control can give the child control (as we all know, the child controls are larger and the size of the display cannot be larger than the parent control). Here the Getchildmeasurespec () method is used to calculate the size (width or height) of a suitable sub-view, combined with the Measurespec information we give from the layoutparams of the child view to obtain the most appropriate result. For example, if the view knows its size (because its measurespec model is exactly, and the child view is exactly the same size as the parent window, the parent window must go to the layout child view with the given size)
Parameter meaning: size and pattern passed to child view by Spec parent window
Padding the margins of the parent window, which is the android:padding in XML
Childdimension the exact size that the child view wants to draw, but it does not necessarily draw this value in the end

When you get the size of each child control, it's easier to calculate your own width.
int wantedheight = childtop + lineheight + paddingbottom;

In the same vein, this sentence in the OnLayout

 for(inti =0, ChildCount = Getchildcount (); i < ChildCount; ++i) {View Childview = Getchildat (i);if(childview.getvisibility () = = View.gone) {Continue; }intChildwidth = Childview.getmeasuredwidth ();intChildheight = Childview.getmeasuredheight (); Lineheight = Math.max (Childheight, lineheight);if(Childleft + childwidth + paddingright > Mywidth)            {childleft = paddingleft;            Childtop + = mverticalspacing + lineheight;        Lineheight = Childheight;        } childview.layout (Childleft, childtop, Childleft + childwidth, childtop + childheight);    Childleft + = Childwidth + mhorizontalspacing; }

First, by looping through, control the display position of each item child control, if the current line can also put the next item, put it on the current row, if not put down to the left of the next line.
In the end, the traversal is done, which is the equivalent of displaying your own position.

Effect

Android Streaming layout implementation