Android Custom flow layouts. Implement popular tags. Open Source Library Simpleflowlayout

Objective

The actual project needs to implement a popular search column, similar to:

Because the text in the subkey (Child view) is mutable, the number of subkeys that can be displayed on a line cannot be determined. You need to support line wrapping and calculation locations.

Open Source Class Library

I wrote a custom view myself, inherited from ViewGroup, to implement it, hosted on the GitHub open source platform.

Name:simpleflowlayout

Address: Https://github.com/vir56k/SimpleFlowLayout

Features: You can continuously add multiple sub-view, calculate the position, and wrap the line. div tags similar to HTML

Applicable: Popular Tags

Implementation Ideas

To implement a custom viewgroup, you need:

1. Inherit from ViewGroup

2. Implement protected void Onmeasure (int widthmeasurespec, int heightmeasurespec)

This method is used to measure the width and height of your own (custom view) itself.

3. Implement protected void OnLayout (Boolean changed, int l, int t, int r, int b)

This method is used to specify how the child view is positioned.

Implementation code

 Packagezhangyf.vir56k.flowframelayout;ImportAndroid.content.Context;ImportAndroid.util.AttributeSet;ImportAndroid.view.View;ImportAndroid.view.ViewGroup;/*** name:android Simple flow Layout Custom View * Yunfei Zhang * Features: You can continuously add multiple sub-view, calculate the position, wrap the line. * Applicable: Popular tags * Created by Zhangyunfei on 15/12/4. */ Public classSimpleflowlayoutextendsViewGroup { PublicSimpleflowlayout (Context context) {Super(context); }     PublicSimpleflowlayout (Context context, AttributeSet attrs) {Super(context, attrs); }     PublicSimpleflowlayout (context context, AttributeSet attrs,intdefstyleattr) {        Super(context, attrs, defstyleattr); } @Overrideprotected voidOnmeasure (intWidthmeasurespec,intHeightmeasurespec) {        intWidthmax =measurespec.getsize (WIDTHMEASURESPEC); intWidthmode =Measurespec.getmode (WIDTHMEASURESPEC); intHeightMax =measurespec.getsize (HEIGHTMEASURESPEC); intHeightmode =Measurespec.getmode (HEIGHTMEASURESPEC); intWidthneed = 0; intHeightneed = 0; intx = 0; inty = 0; intCurrentlineheight = 0;        View child;  for(inti = 0; I < Getchildcount (); i++) { child=Getchildat (i); if(child.getvisibility () = =view.gone) {Continue;            } child.measure (Widthmeasurespec, Heightmeasurespec); Marginlayoutparams LP= (marginlayoutparams) child.getlayoutparams ();//get the margin of a child view//Calculate the sub-view width, the bank This code has a problem, can not calculate the child view of the word wrap int childwidth = child.getmeasuredwidth () + Lp.leftmargin + lp.rightmargin; //using ViewGroup's measurechildwithmargins to calculate the width, in this method processing the Layoutparams match_parent and other ways of processing            intChildheight = child.getmeasuredheight () + Lp.topmargin +Lp.bottommargin; Measurechildwithmargins (Child, Widthmeasurespec,0, Heightmeasurespec, 0); intChildwidth = child.getmeasuredwidth () + Lp.leftmargin +Lp.rightmargin; if(x + childwidth > Widthmax) {//Line Wrap, the bank height and X axis are zeroed, the y-axis is down (plus the last row height)Y + =Currentlineheight; Currentlineheight= 0; X= 0; } x+=Childwidth; Currentlineheight=Math.max (Currentlineheight, childheight); Widthneed= Math.max (widthneed, x);//after adding this sub view, leave the maximum widthHeightneed = Math.max (heightneed, y + currentlineheight);//compare to the last, leave the maximum height} setmeasureddimension (Widthmode= = measurespec.exactly?Widthmax:widthneed, Heightmode= = measurespec.exactly?heightmax:heightneed); } @Overrideprotected voidOnLayout (BooleanChangedintLintTintRintb) {intWidthmax =getwidth (); intx, y; X= 0; Y= 0;        View child; intleft = 0; inttop = 0; intCurrentlineheight = 0;  for(inti = 0; I < Getchildcount (); i++) { child=Getchildat (i); if(child.getvisibility () = =view.gone) {Continue; } marginlayoutparams LP=(Marginlayoutparams) child.getlayoutparams (); intChildwidth = child.getmeasuredwidth () + Lp.leftmargin +Lp.rightmargin; intChildheight = child.getmeasuredheight () + Lp.topmargin +Lp.bottommargin; if(x + childwidth > Widthmax) {//line Break ProcessingY + =Currentlineheight; X= 0; Currentlineheight= 0; } Left= x +Lp.leftmargin; Top= y +Lp.topmargin; //position the child viewChild.layout (left, top, left + child.getmeasuredwidth (), Top +child.getmeasuredheight ()); X+=Childwidth; Currentlineheight=Math.max (Currentlineheight, childheight); }} @Override Publiclayoutparams generatelayoutparams (AttributeSet attrs) {return NewMarginlayoutparams (GetContext (), attrs); }}

　　

Android Custom flow layouts. Implement popular tags. Open Source Library Simpleflowlayout