Custom implementation Waterfall Flow effect with text caption

Most of the information on the Internet can be found in the waterfall flow effect is purely photo implementation, and now I will implement a text title. The effect is as follows:

Each item is made up of two parts: a picture and a text title.

Layout mode for ScrollView inside nested a horizontal direction of the linearlayout, inside and nested two vertical direction of the linearlayout, and then determine the vertical direction of the two linearlayout height, Add item to the lower LinearLayout.

Here is the code

<scrollview xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http// Schemas.android.com/tools "android:layout_width=" match_parent "android:layout_height=" Match_parent "Tools:context = "Com.example.waterfall.MainActivity" > <linearlayout android:id= "@+id/llccasecade" android:layout_width= "Match_parent" android:layout_height= "match_parent" android:background= "@android: Color/white" Android:orien tation= "Horizontal" > <linearlayout android:id= "@+id/casecade1" Android:layout_width= "M Atch_parent "android:layout_height=" Wrap_content "android:layout_weight=" 1 "Android:orien tation= "vertical" android:padding= "2DP" > </LinearLayout> <linearlayout an            Droid:id= "@+id/casecade2" android:layout_width= "match_parent" android:layout_height= "Wrap_content" android:layout_weight= "1" android:orientation= "vertical" android:padding= "2DP" > </LinearLayout> &LT;/LINEARLAYOUT&GT;&L T;/scrollview>

Custom Flowview

public class Flowview extends ImageView implements View.onclicklistener,view.onlongclicklistener {private Context Mcontext;public Bitmap bitmap;private int columnindex;private int rowindex;private Handler viewhandler;private String tag; @Overridepublic void Settag (Object tag) {//TODO auto-generated method Stubsuper.settag (tag); This.tag = (String) tag; }public Flowview (Context C, attributeset attrs, int defstyle) {super (C, Attrs, defstyle); this.mcontext = C;init ();} Public Flowview (Context C, AttributeSet attrs) {super (C, attrs); this.mcontext = C;init ();} Public Flowview (Context c) {super (c); this.mcontext = C;init ();} private void Init () {Setonclicklistener (this), This.setonlongclicklistener (this); Setadjustviewbounds (true);} @Overridepublic boolean Onlongclick (View v) {return true;} Private Handler mhandler;public void SetHandler (Handler Handler) {Mhandler=handler;} @Overridepublic void OnClick (View v) {message msg=new message (); Bundle Bun=new Bundle (); Bun.putstring ("tag", tag); Msg.what=1;msg.sEtdata (bun); Mhandler.sendmessage (msg);} public int Getcolumnindex () {return columnindex;} public void Setcolumnindex (int columnindex) {this.columnindex = columnindex;} public int Getrowindex () {return rowIndex;} public void Setrowindex (int rowIndex) {this.rowindex = RowIndex;} Public Handler Getviewhandler () {return viewhandler;} Public Flowview Setviewhandler (Handler viewhandler) {This.viewhandler = Viewhandler;return this;}}

Then the

public class Mainactivity extends Activity {private LinearLayout lvcasecade1;private linearlayout lvcasecade2;private Display display;private int casecadewidth;private arraylist<baobei> mbaobeilist = new arraylist<baobei> (); Private linearlayout[] mrelativelayout;private bitmaputils mbitmaputils;private int MJ, mposition; @Overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview (r.layout.activity_ Main);d isplay = This.getwindowmanager (). Getdefaultdisplay (); casecadewidth = Display.getwidth ()/2;initdata (); Initview ();} private void InitData () {if (environment.getexternalstoragestate () = = environment.media_mounted) {File File = new file (En Vironment.getexternalstoragedirectory () + "/imagecache"), if (!file.exists ()) {file.mkdirs ();} Mbitmaputils = new Bitmaputils (this, File.getabsolutepath ());} else {mbitmaputils = new bitmaputils (this, null);} for (int i = 0; i < BaseData.imageUris.length; i++) {Mbaobeilist.add (new Baobei (BasedaTa.titles[i], basedata.imageuris[i]);};} private void Initview () {lvCasecade1 = (linearlayout) Findviewbyid (r.id.casecade1); lvCasecade2 = (linearlayout) Findviewbyid (R.ID.CASECADE2); Layoutparams LP1 = Lvcasecade1.getlayoutparams (); lp1.width = Casecadewidth;lvcasecade1.setlayoutparams (LP1); Layoutparams LP2 = Lvcasecade2.getlayoutparams (); lp2.width = Casecadewidth;lvcasecade2.setlayoutparams (LP2); if ( Mbaobeilist.size () > Mposition) {addimgtocasecade (Mbaobeilist.get (mposition), MJ, mposition);}} private void Addimgtocasecade (final baobei bb, Int j, final int i) {//TODO auto-generated method stublinearlayout LV = (L Inearlayout) Layoutinflater.from (this). Inflate (R.layout.item, NULL), if (j = = 0) {lvcasecade1.addview (LV);} else if (j = = 1) {Lvcasecade2.addview (LV);} final Flowview im = (flowview) Lv.findviewbyid (R.ID.ITEM_IV); Im.sethandler (MHandler); Final TextView Item_title = (TextView) Lv.findviewbyid (r.id.item_title); Mbitmaputils.display (IM, bb.getimage (), New Bitmaploadcallback<view> () {@Overridepublic void onloadcompleted (View container, String uri,bitmap Bitmap, Bitmapdisplayconfig config, Bitmaploadfrom from) {//TODO auto-generated method stubif (im! = null && bb.getimage ()! = null) {IM.SETIMAGEBITMA P (bitmap); Item_title.settext (Bb.getname ());} try {int height1 = lvcasecade1.getheight (); int height2 = Lvcasecade2.getheight (); LOGUTILS.E ("height1:" + height1); LOGUTILS.E ("height2:" + height2); if (height1 <= height2) {MJ = 0;} else {MJ = 1;} Mposition++;if (Mbaobeilist.size () >mposition) {Addimgtocasecade (Mbaobeilist.get (mposition), MJ, mPosition);} Thread.Sleep (2000);} catch (Exception e) {//TODO auto-generated catch Blocke.printstacktrace ();}} @Overridepublic void onloadfailed (View container, String uri,drawable drawable) {//TODO auto-generated Method stub}}); Private Handler Mhandler = new Handler () {@Overridepublic void Handlemessage (Message msg) {//TODO auto-generated method s Tubsuper.handlemessage (msg); switch (msg.what) {case 1:bundle GgitembunDle = Msg.getdata (); if (ggitembundle! = null) {String address = ggitembundle.getstring ("tag"); Intent Intent = new Intent (M Ainactivity.this,taobaoactivity.class); Intent.putextra ("Address", address); StartActivity (intent);} Break;default:break;}}};}

By the way, the loading memory of the picture is given to Xutils.

If it is necessary to implement the waterfall flow effect of pure picture can refer to Guo Lin's blog: http://blog.csdn.net/guolin_blog/article/details/10470797

Custom implementation Waterfall Flow effect with text caption