Android 高仿QQ 好友分組列表

實現的效果如下:

 

 

 

用ExpandableListView實現,

先看Activity的代碼:

[java] 
public class BuddyActivity extends Activity { 
    ExpandableListView expandablelistview; 
    //群組名稱     
    private String[] group = new String[] { "在線好友", "我的好友", "我的同事"};   
    //好友名稱     
    private String[][] buddy = new String[][] { 
            { "元芳", "雷丶小賤", "狄大人"},  
            {"高太後", "士兵甲", "士兵乙", "士兵丙" }, 
            { "藝術傢", "叫獸", "攻城師", "職業玩傢" }};   
     
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        requestWindowFeature(Window.FEATURE_NO_TITLE); 
        setContentView(R.layout.activity_buddy); 
         
        expandablelistview= (ExpandableListView) findViewById(R.id.buddy_expandablelistview); 
        ExpandableListAdapter adapter=new BuddyAdapter(this,group,buddy); 
        expandablelistview.setAdapter(adapter); 
        //分組展開  
        expandablelistview.setOnGroupExpandListener(new OnGroupExpandListener(){ 
            public void onGroupExpand(int groupPosition) { 
            } 
        }); 
        //分組關閉  
        expandablelistview.setOnGroupCollapseListener(new OnGroupCollapseListener(){ 
            public void onGroupCollapse(int groupPosition) { 
            } 
        }); 
        //子項單擊  
        expandablelistview.setOnChildClickListener(new OnChildClickListener(){ 
            public boolean onChildClick(ExpandableListView arg0, View arg1, 
                    int groupPosition, int childPosition, long arg4) { 
                Toast.makeText(BuddyActivity.this,  
                        group[groupPosition]+" : "+buddy[groupPosition][childPosition],  
                        Toast.LENGTH_SHORT).show(); 
                return false; 
            } 
        }); 
    } 

public class BuddyActivity extends Activity {
 ExpandableListView expandablelistview;
 //群組名稱  
    private String[] group = new String[] { "在線好友", "我的好友", "我的同事"}; 
    //好友名稱  
    private String[][] buddy = new String[][] {
            { "元芳", "雷丶小賤", "狄大人"},
            {"高太後", "士兵甲", "士兵乙", "士兵丙" },
            { "藝術傢", "叫獸", "攻城師", "職業玩傢" }}; 
 
 public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_buddy);
       
        expandablelistview= (ExpandableListView) findViewById(R.id.buddy_expandablelistview);
        ExpandableListAdapter adapter=new BuddyAdapter(this,group,buddy);
        expandablelistview.setAdapter(adapter);
        //分組展開
        expandablelistview.setOnGroupExpandListener(new OnGroupExpandListener(){
   public void onGroupExpand(int groupPosition) {
   }
        });
        //分組關閉
        expandablelistview.setOnGroupCollapseListener(new OnGroupCollapseListener(){
   public void onGroupCollapse(int groupPosition) {
   }
        });
        //子項單擊
        expandablelistview.setOnChildClickListener(new OnChildClickListener(){
   public boolean onChildClick(ExpandableListView arg0, View arg1,
     int groupPosition, int childPosition, long arg4) {
    Toast.makeText(BuddyActivity.this,
      group[groupPosition]+" : "+buddy[groupPosition][childPosition],
      Toast.LENGTH_SHORT).show();
    return false;
   }
        });
    }
}
ExpandableListView的佈局有2個,分別是組的佈局和子項(即好友),

先看buddy_listview_group_item.xml

 

[html] 
<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/RelativeLayout1" 
    android:layout_width="match_parent" 
    android:layout_height="30dip"  
    android:background="@drawable/group_fold_bg"> 
    <ImageView 
        android:id="@+id/buddy_listview_image" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentLeft="true" 
        android:layout_centerVertical="true" 
        android:layout_marginLeft="10dp" 
        android:src="@drawable/group_fold_arrow" /> 
    <TextView 
        android:id="@+id/buddy_listview_group_name" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:layout_alignTop="@+id/buddy_listview_image" 
        android:layout_toRightOf="@+id/buddy_listview_image" 
        android:text="分組名稱" /> 
    <TextView 
        android:id="@+id/buddy_listview_group_num" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentRight="true" 
        android:layout_centerVertical="true" 
        android:layout_marginRight="10dp" 
        android:text="[10/10]" /> 
</RelativeLayout> 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RelativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="30dip"
    android:background="@drawable/group_fold_bg">
    <ImageView
        android:id="@+id/buddy_listview_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="10dp"
        android:src="@drawable/group_fold_arrow" />
    <TextView
        android:id="@+id/buddy_listview_group_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_alignTop="@+id/buddy_listview_image"
        android:layout_toRightOf="@+id/buddy_listview_image"
        android:text="分組名稱" />
    <TextView
        android:id="@+id/buddy_listview_group_num"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="10dp"
        android:text="[10/10]" />
</RelativeLayout>
下面是buddy_listview_child_item.xml

 

[html] 
<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="40dip" > 
    <ImageView 
        android:id="@+id/buddy_listview_child_avatar" 
        android:layout_width="40dip" 
        android:layout_height="40dip" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentTop="true" 
        android:layout_marginLeft="10dp" 
        android:src="@drawable/avatar" /> 
    <TextView 
        android:id="@+id/buddy_listview_child_nick" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentTop="true" 
        android:layout_toRightOf="@+id/buddy_listview_child_avatar" 
        android:text="昵稱" 
        android:textSize="16sp" /> 
    <TextView 
        android:id="@+id/buddy_listview_child_trends" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignLeft="@+id/buddy_listview_child_nick" 
        android:layout_alignParentBottom="true" 
        android:text="該好友暫時沒有新動態" 
        android:textSize="12sp" /> 
 
</RelativeLayout> 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="40dip" >
    <ImageView
        android:id="@+id/buddy_listview_child_avatar"
        android:layout_width="40dip"
        android:layout_height="40dip"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="10dp"
        android:src="@drawable/avatar" />
    <TextView
        android:id="@+id/buddy_listview_child_nick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/buddy_listview_child_avatar"
        android:text="昵稱"
        android:textSize="16sp" />
    <TextView
        android:id="@+id/buddy_listview_child_trends"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/buddy_listview_child_nick"
        android:layout_alignParentBottom="true"
        android:text="該好友暫時沒有新動態"
        android:textSize="12sp" />

</RelativeLayout>

 

Adapter自然是對應的BaseExpandableListAdapter

[java] 
public class BuddyAdapter extends BaseExpandableListAdapter {    
    private String[] group;  
    private String[][] buddy; 
    private Context context; 
    LayoutInflater inflater; 
     
    public BuddyAdapter(Context context,String[] group,String[][] buddy){ 
        this.context=context; 
        inflater = LayoutInflater.from(context); 
        this.group=group; 
        this.buddy=buddy; 
    } 
    public Object getChild(int groupPosition, int childPosition) { 
        return buddy[groupPosition][childPosition]; 
    } 
 
    public long getChildId(int groupPosition, int childPosition) { 
        return childPosition; 
    } 
 
    public View getChildView(int groupPosition, int childPosition, boolean arg2, View convertView, 
            ViewGroup arg4) { 
        convertView = inflater.inflate(R.layout.buddy_listview_child_item, null); 
        TextView nickTextView=(TextView) convertView.findViewById(R.id.buddy_listview_child_nick); 
        nickTextView.setText(getChild(groupPosition, childPosition).toString()); 
        return convertView; 
    } 
 
    public int getChildrenCount(int groupPosition) { 
        return buddy[groupPosition].length; 
    } 
 
    public Object getGroup(int groupPosition) { 
        return group[groupPosition]; 
    } 
 
    public int getGroupCount() { 
        return group.length; 
    } 
 
    public long getGroupId(int groupPosition) { 
        return groupPosition; 
    } 
 
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup arg3) { 
        convertView = inflater.inflate(R.layout.buddy_listview_group_item, null); 
        TextView groupNameTextView=(TextView) convertView.findViewById(R.id.buddy_listview_group_name); 
        groupNameTextView.setText(getGroup(groupPosition).toString()); 
        ImageView image = (ImageView) convertView.findViewById(R.id.buddy_listview_image); 
        image.setImageResource(R.drawable.group_unfold_arrow); 
        //更換展開分組圖片  
        if(!isExpanded){ 
            image.setImageResource(R.drawable.group_fold_arrow); 
        } 
        return convertView; 
    } 
 
    public boolean hasStableIds() { 
        return true; 
    } 
    // 子選項是否可以選擇    
    public boolean isChildSelectable(int arg0, int arg1) { 
        // TODO Auto-generated method stub  
        return true; 
    } 

public class BuddyAdapter extends BaseExpandableListAdapter {  
    private String[] group;
    private String[][] buddy;
    private Context context;
    LayoutInflater inflater;
   
    public BuddyAdapter(Context context,String[] group,String[][] buddy){
     this.context=context;
     inflater = LayoutInflater.from(context);
     this.group=group;
     this.buddy=buddy;
    }
 public Object getChild(int groupPosition, int childPosition) {
  return buddy[groupPosition][childPosition];
 }

 public long getChildId(int groupPosition, int childPosition) {
  return childPosition;
 }

 public View getChildView(int groupPosition, int childPosition, boolean arg2, View convertView,
   ViewGroup arg4) {
  convertView = inflater.inflate(R.layout.buddy_listview_child_item, null);
  TextView nickTextView=(TextView) convertView.findViewById(R.id.buddy_listview_child_nick);
  nickTextView.setText(getChild(groupPosition, childPosition).toString());
  return convertView;
 }

 public int getChildrenCount(int groupPosition) {
  return buddy[groupPosition].length;
 }

 public Object getGroup(int groupPosition) {
  return group[groupPosition];
 }

 public int getGroupCount() {
  return group.length;
 }

 public long getGroupId(int groupPosition) {
  return groupPosition;
 }

 public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup arg3) {
  convertView = inflater.inflate(R.layout.buddy_listview_group_item, null);
  TextView groupNameTextView=(TextView) convertView.findViewById(R.id.buddy_listview_group_name);
  groupNameTextView.setText(getGroup(groupPosition).toString());
  ImageView image = (ImageView) convertView.findViewById(R.id.buddy_listview_image);
  image.setImageResource(R.drawable.group_unfold_arrow);
  //更換展開分組圖片
  if(!isExpanded){
   image.setImageResource(R.drawable.group_fold_arrow);
  }
  return convertView;
 }

 public boolean hasStableIds() {
  return true;
 }
 // 子選項是否可以選擇 
 public boolean isChildSelectable(int arg0, int arg1) {
  // TODO Auto-generated method stub
  return true;
 }
}

 

You May Also Like