Using Expandablelistview to implement a time axis

Source: Internet
Author: User

In many apps can see the effect of the time axis, such as Ctrip and so on, then we use expandablelistview today to achieve a time axis effect, first to see:


The effect is quite simple, here we mainly use Expandablelistview to achieve, about Expandablelistview's detailed usage see (Android Development Expandablelistview use, implement similar QQ friend list ), here we mainly introduce the implementation of this effect:

Let's take a look at the main layout file:

<relativelayout 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 "> <Text View android:id= "@+id/title_p" android:layout_width= "wrap_content" android:layout_height= "Wrap_conten        T "android:layout_centerhorizontal=" true "android:layout_margin=" 12DP "android:gravity=" center " Android:text= "November 2015" android:textsize= "18SP"/> <view android:id= "@+id/hor_div" Android : layout_width= "match_parent" android:layout_height= "1DP" android:layout_below= "@id/title_p" android:b ackground= "#9F79EE"/> <view android:id= "@+id/ver_div" android:layout_width= "1DP" Android:la yout_height= "Match_parent" android:layout_below= "@id/hor_div" android:layout_marginleft= "70DP" Androi d:background= "#9F79EE"/> <textview       Android:id= "@+id/title_c" android:layout_width= "match_parent" android:layout_height= "Wrap_content"        android:layout_below= "@id/hor_div" android:layout_marginleft= "60DP" android:paddingbottom= "12DP" android:paddingleft= "18DP" android:paddingtop= "12DP" android:text= "Time axis" android:textsize= "24SP"/&gt    ; <expandablelistview android:id= "@+id/lv" android:layout_width= "Match_parent" android:layout_height = "Match_parent" android:layout_below= "@id/title_c" android:layout_marginleft= "60DP" Android:backgroun D= "@null" android:clickable= "false" android:divider= "@null" > </expandablelistview></relative Layout>

Two split line with view to do, the whole is not difficult, not much to say, see mainactivity

public class Mainactivity extends Activity {private list<timelinebean> list;private Expandablelistview lv;@ overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Requestwindowfeature (Window.feature_no_title); Setcontentview (R.layout.activity_main); InitData (); InitView ();} private void Initview () {LV = (Expandablelistview) This.findviewbyid (r.id.lv); Lv.setadapter (New Myadapter ( Mainactivity.this, list)); for (int i = 0; i < list.size (); i++) {lv.expandgroup (i);} Lv.setgroupindicator (null); Lv.setongroupclicklistener (new Ongroupclicklistener () {@Overridepublic Boolean Ongroupclick (expandablelistview parent, View v, int groupposition, long id) {return true;}}); private void InitData () {list = new arraylist<timelinebean> (); list<string> things = new Arraylist<string> () Things.add ("Six Wang Bi, Sihai one;"); Things.add ("Shushan Wu, a room out.") Things.add ("Over 300 miles, isolating the daylight.") List.add (New Timelinebean ("November 24", things)) things = new arraylist<string> (); THINGS.ADD ("Lishan and West Fold,"); Things.add ("Go straight to Xianyang." "); Things.add (" Two Chuan Rongrong, inflow Palace walls. List.add (New Timelinebean ("November 23", things)), things = new arraylist<string> (); Things.add ("Five Steps, one floor, ten steps, one court;"); Things.add ("List.add"), New Timelinebean ("November 22", things), things = new arraylist<string> (); Things.add ( "The eaves of the teeth high peck;" Things.add ("each hold the terrain, rivalry.") Things.add ("Granary granary Yan, Hive whirlpools,"); Things.add ("Chu does not know tens of millions of falls! List.add (New Timelinebean ("November 21", things)), things = new arraylist<string> (); Things.add ("Long Bridge, not Cloud Dragon?"). Things.add ("Complex daoxing empty, not Ji Ho Rainbow?") Things.add ("The high and low fans, do not know West East.") List.add (New Timelinebean ("November 20", things)), things = new arraylist<string> (); Things.add ("The song platform warms up,"); Things.add ("Spring"), List.add (New Timelinebean ("November 19", things)), things = new arraylist<string> (); Things.add ( "Dance hall Cold Sleeves,"); Things.add ("Shing. Things.add ("Within a day, between a house,"); Things.add ("and the climate is not.") "); List.add (New Timelinebean (" November 18 ", Things);}}

In Mainactivity we initialize the simulation data, then initialize the view, initialize the view, let all the group expand through a for loop, and then block the group's click events, and then look at adapter:

public class Myadapter extends Baseexpandablelistadapter {private Context context;private list<timelinebean> List ;p ublic Myadapter (context context, list<timelinebean> list) {this.context = Context;this.list = list;} @Overridepublic Object getchild (int groupposition, int childposition) {return list.get (groupposition). Getthings (); @Overridepublic long Getchildid (int groupposition, int childposition) {return childposition;} @Overridepublic view Getchildview (int groupposition, int childposition, Boolean islastchild, view Convertview,viewgroup Parent) {Childholder holder = null;if (Convertview = = null) {Convertview = Layoutinflater.from (context). Inflate (r.layout . Child_item, null); holder = new Childholder (); holder.tv = (TextView) Convertview.findviewbyid (r.id.ci_thing); Convertview.settag (holder);} else {holder = (Childholder) Convertview.gettag ();} Holder.tv.setText (List.get (groupposition). Getthings (). Get (Childposition)); return Convertview;} @Overridepublic int getchildrencount (int gRoupposition) {return list.get (groupposition). Getthings (). Size (); @Overridepublic Object getgroup (int groupposition) {return list.get (groupposition). GetDate ();} @Overridepublic int GetGroupCount () {return list.size ();} @Overridepublic long getgroupid (int groupposition) {return groupposition;} @Overridepublic view Getgroupview (int groupposition, Boolean isexpanded, View Convertview, ViewGroup parent) { Groupholder holder = null;if (Convertview = = null) {Convertview = Layoutinflater.from (context). Inflate (R.layout.group_ item, NULL); holder = new Groupholder (); holder.tv = (TextView) Convertview.findviewbyid (r.id.gi_date); Convertview.settag (holder);} else {holder = (Groupholder) Convertview.gettag ();} Holder.tv.setText (List.get (groupposition). GetDate ()); return Convertview;} @Overridepublic Boolean hasstableids () {return false;} @Overridepublic boolean ischildselectable (int groupposition, int childposition) {return false;} Class Groupholder {TextView TV;} Class Childholder {TextView TV;}}
This adapter also have nothing to say, if you have any questions you can see the use of Android development Expandablelistview, to achieve similar QQ friends list, here are Expandablelistview detailed introduction. Finally, there are two item files:

Group_item.xml

<?xml version= "1.0" encoding= "Utf-8"? ><linearlayout xmlns:android= "http://schemas.android.com/apk/res/ Android "    android:layout_width=" match_parent "    android:layout_height=" match_parent "    android:o rientation= "Horizontal" >    <view        android:layout_width= "20DP"        android:layout_height= "20DP        " android:layout_margintop= "22DP"        android:background= "@drawable/circle"/>    <textview        android:id = "@+id/gi_date"        android:layout_width= "match_parent"        android:layout_height= "Wrap_content"        Android:paddingbottom= "16DP"        android:paddingleft= "12DP"        android:paddingtop= "18DP"        android:text= "November 24"        android:textsize= "22SP"/></linearlayout>

Child_item.xml:

<?xml version= "1.0" encoding= "Utf-8"? ><linearlayout xmlns:android= "http://schemas.android.com/apk/res/ Android "    android:layout_width=" match_parent "    android:layout_height=" match_parent "    android:o rientation= "vertical" >    <textview        android:id= "@+id/ci_thing" android:layout_width= "Match_        Parent "        android:layout_height=" wrap_content "        android:paddingleft=" 22DP "        android:paddingtop=" 8DP "        android:text= "November 24"        android:textcolor= "#999999"        android:textsize= "16SP"/></linearlayout >

In front of each group_item there is a red solid ball, which we draw with shape, and the use of shape is detailed in the shape of Android development:

Circle.xml

<?xml version= "1.0" encoding= "Utf-8"? ><shape xmlns:android= "Http://schemas.android.com/apk/res/android"    android:shape= "Oval" >    <corners android:radius= "10DP"/>    <size        android:height= "10DP"        android:width= "10DP"/>    <solid android:color= "#FF6A6A"/></shape>

Well, this thing seems to be no difficulty, in fact, is the use of Expandablelistview.

Demo Download http://download.csdn.net/detail/u012702547/9297507


Using Expandablelistview to implement a time axis

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.