Achieve the top effect of each item of listview in Instagram and QQ.

First, it looks pretty bad:

The three figures are connected. The title of each group on QQ is always set to the top. When you slide up, the following will go up the title of the previous item. When you slide down, the following will pull down the above.

There are two main classes: pinnedheaderlistview inherited from listview; testadapter inherited from baseadapter

Code: pinnedheaderlistview. Java

/** Copyright (c) 2010 the android open source project ** licensed under the Apache license, version 2.0 (the "License "); * You may not use this file before t in compliance with the license. * You may obtain a copy of the license at ** http://www.apache.org/licenses/LICENSE-2.0 ** unless required by applicable law or agreed to in writing, software * distributed under the license is distributed on An "as is" basis, * Without warranties or conditions of any kind, either express or implied. * See the license for the specific language governing permissions and * limitations under the license. */package COM. sequel. it. pinnedlist; import android. content. context; import android. graphics. canvas; import android. util. attributeset; import android. view. view; import android. widget. listadapter; import android. Widget. listview;/*** A listview that maintains a header pinned at the top of the list. the pinned * header can be pushed up and dissolved as needed. */public class pinnedheaderlistview extends listview {/*** adapter interface. the list adapter must implement this interface. */public interface pinnedheaderadapter {/*** pinned header state: Don't show the header. */public static final int pinned _ Header_gone = 0;/*** pinned header state: show the header at the top of the list. */public static final int pinned_header_visible = 1;/*** pinned header state: show the header. if the header extends beyond * the bottom of the first shown element, push it up and clip. */public static final int pinned_header_pushed_up = 2;/*** used to obtain the group tag status computes the desired state of the pinned header for * Given position of the first visible list item. allowed return values * Are {@ link # pinned_header_gone}, {@ link # pinned_header_visible} Or * {@ link # pinned_header_pushed_up }. */INT getpinnedheaderstate (INT position);/*** used to set the grouping label title configures the pinned header view to match the first * visible list item. ** @ Param header * pinned header view. * @ Param position * position of the first visible lis T item. * @ Param Alpha * fading of the header view, between 0, and 255. */void configurepinnedheader (view header, int position);} Private Static final int max_alpha = 255; private pinnedheaderadapter madapter;/** the item displayed at the top */private view mheaderview; private Boolean mheaderviewvisible; private int mheaderviewwidth; private int mheaderviewheight; Public pinnedheaderlistview (context) {super (contex T);} public pinnedheaderlistview (context, attributeset attrs) {super (context, attrs);} public pinnedheaderlistview (context, attributeset attrs, int defstyle) {super (context, Context, attrs, defstyle);} public void setpinnedheaderview (view) {mheaderview = view; // disable vertical fading when the pinned header is present // todo change listview to allow separate measures for top and bottom // Fading edge; // in this special case we wocould like to disable the top, but not the // bottom edge. If (mheaderview! = NULL) {// set the length of the border gradient setfadingedgelength (0);} // requestlayout () ;}@ overridepublic void setadapter (listadapter adapter) {super. setadapter (adapter); madapter = (pinnedheaderadapter) Adapter;} @ overrideprotected void onmeasure (INT widthmeasurespec, int heightmeasurespec) {super. onmeasure (widthmeasurespec, heightmeasurespec); // obtain the width and height of mheaderviewz if (mheaderview! = NULL) {measurechild (mheaderview, widthmeasurespec, heightmeasurespec); mheaderviewwidth = mheaderview. getmeasuredwidth (); mheaderviewheight = mheaderview. getmeasuredheight () ;}}@ overrideprotected void onlayout (Boolean changed, int left, int top, int right, int bottom) {super. onlayout (changed, left, top, right, bottom); If (mheaderview! = NULL) {mheaderview. layout (0, 0, mheaderviewwidth, mheaderviewheight); configureheaderview (getfirstvisibleposition () ;}} public void configureheaderview (INT position) {If (mheaderview = NULL) {return ;} int state = madapter. getpinnedheaderstate (position); Switch (state) {Case pinnedheaderadapter. pinned_header_gone: {// mheaderviewvisible = false; break;} case pinnedheaderadapter. pinned_header_visible :{ Madapter. configurepinnedheader (mheaderview, position); // If (mheaderview. gettop ()! = 0) {// mheaderview. layout (0, 0, mheaderviewwidth, mheaderviewheight); // mheaderviewvisible = true; break;} case pinnedheaderadapter. pinned_header_pushed_up: {view firstview = getchildat (0); int Bottom = firstview. getbottom (); int headerheight = mheaderview. getheight (); int y; If (bottom 

Testadapter. Java


package com.sequel.it.pinnedList;import java.util.ArrayList;import com.demo.sectionlistview.R;import com.sequel.it.pinnedList.PinnedHeaderListView.PinnedHeaderAdapter;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.AbsListView;import android.widget.AbsListView.OnScrollListener;import android.widget.BaseAdapter;import android.widget.TextView;public class TestAdapter extends BaseAdapter implements PinnedHeaderAdapter,OnScrollListener {private LayoutInflater inflater;private ArrayList<Person> datas;private int lastItem = 0;public TestAdapter(final LayoutInflater inflater) {this.inflater = inflater;loadData();}@Overridepublic int getCount() {// TODO Auto-generated method stubreturn datas.size();}@Overridepublic Object getItem(int position) {// TODO Auto-generated method stubreturn null;}@Overridepublic long getItemId(int position) {// TODO Auto-generated method stubreturn 0;}@Overridepublic View getView(int position, View convertView, ViewGroup parent) {// TODO Auto-generated method stubView view = convertView;if (view == null) {view = inflater.inflate(R.layout.section_list_item, null);}final Person person = datas.get(position);final TextView header = (TextView) view.findViewById(R.id.header);final TextView textView = (TextView) view.findViewById(R.id.example_text_view);textView.setText(person.getNumber());header.setText(person.getName());if (lastItem == position) {header.setVisibility(View.INVISIBLE);} else {header.setVisibility(View.VISIBLE);}return view;}@Overridepublic int getPinnedHeaderState(int position) {// TODO Auto-generated method stubreturn PINNED_HEADER_PUSHED_UP;}@Overridepublic void configurePinnedHeader(View header, int position) {// TODO Auto-generated method stubif (lastItem != position) {notifyDataSetChanged();}((TextView) header.findViewById(R.id.header_text)).setText(datas.get(position).getName());lastItem = position;}private void loadData() {datas = new ArrayList<Person>();for (int i = 0; i < 50; i++) {Person p = new Person();p.setName("name-" + i);p.setNumber("100" + i);datas.add(p);}}@Overridepublic void onScroll(AbsListView view, int firstVisibleItem,int visibleItemCount, int totalItemCount) {if (view instanceof PinnedHeaderListView) {((PinnedHeaderListView) view).configureHeaderView(firstVisibleItem);}}@Overridepublic void onScrollStateChanged(AbsListView view, int scrollState) {}}



Portal activity mainactivity. Java


package com.sequel.it.pinnedList;import com.demo.sectionlistview.R;import android.app.Activity;import android.content.Context;import android.os.Bundle;import android.widget.ArrayAdapter;/** * Example activity. */public class MainActivity extends Activity {private TestAdapter adapter;private PinnedHeaderListView listView;@Overridepublic void onCreate(final Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main);adapter = new TestAdapter(getLayoutInflater());listView = (PinnedHeaderListView) findViewById(R.id.section_list_view);listView.setAdapter(adapter);listView.setOnScrollListener(adapter);listView.setPinnedHeaderView(getLayoutInflater().inflate(R.layout.list_section, listView, false));}}
Person. Java


package com.sequel.it.pinnedList;public class Person {private String name;private String number;public String getName() {return name;}public void setName(String name) {this.name = name;}public String getNumber() {return number;}public void setNumber(String number) {this.number = number;}}

Source code: http://download.csdn.net/detail/liangguo03/4294936