快捷導(dǎo)航

Android ListView構(gòu)建支持單選和多選的投票項(xiàng)目

更新時(shí)間：2017年01月10日 14:05:50 作者：邊寫(xiě)邊唱

如何在Android的ListView中構(gòu)建CheckBox和RadioButton列表？這篇文章主要為大家詳細(xì)介紹了Android ListView實(shí)現(xiàn)支持單選和多選的投票項(xiàng)目，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

引言

我們?cè)赼ndroid的APP開(kāi)發(fā)中有時(shí)候會(huì)碰到提供一個(gè)選項(xiàng)列表供用戶(hù)選擇的需求，如在投票類(lèi)型的項(xiàng)目中，我們提供一些主題給用戶(hù)選擇，每個(gè)主題有若干選項(xiàng)，用戶(hù)對(duì)這些主題的選項(xiàng)進(jìn)行選擇，然后提交。

本文以一個(gè)支持單選和多選投票項(xiàng)目為例，演示了在一個(gè)ListView中如何構(gòu)建CheckBox列表和RadioButton列表，并分析了實(shí)現(xiàn)的原理和思路，提供有需要的朋友參考。

項(xiàng)目的演示效果如下。

數(shù)據(jù)源

通常我們的數(shù)據(jù)源來(lái)自于數(shù)據(jù)庫(kù)。首先，我們構(gòu)建投票項(xiàng)目類(lèi)SubjectItem。

/**
 * 主題項(xiàng)目類(lèi)
 * @author zoupeiyang
 *
 */
public class SubjectItem {
 /**
  * 主題id
  */
 private String subjectId;
 /**
  * 主題名稱(chēng)
  */
 private String subjectName;
 /**
  * 主題id
  */
 private String itemId;
 /**
  * 主題名稱(chēng)
  */
 private String itemName;
 /**
  * 是否多選
  */
 private Boolean isMultiChoice;
 public String getSubjectId() {
  return subjectId;
 }
 public void setSubjectId(String subjectId) {
  this.subjectId = subjectId;
 }
 public String getSubjectName() {
  return subjectName;
 }
 public void setSubjectName(String subjectName) {
  this.subjectName = subjectName;
 }
 public String getItemId() {
  return itemId;
 }
 public void setItemId(String itemId) {
  this.itemId = itemId;
 }
 public String getItemName() {
  return itemName;
 }
 public void setItemName(String itemName) {
  this.itemName = itemName;
 }
 public Boolean getIsMultiChoice() {
  return isMultiChoice;
 }
 public void setIsMultiChoice(Boolean isMultiChoice) {
  this.isMultiChoice = isMultiChoice;
 }
}

然后我們構(gòu)造一個(gè)SubjectItem對(duì)象的List集合作為我們這個(gè)投票項(xiàng)目的數(shù)據(jù)源，實(shí)際項(xiàng)目中這個(gè)數(shù)據(jù)源可以來(lái)自數(shù)據(jù)庫(kù)投票項(xiàng)目表。

/**
  * 模擬從數(shù)據(jù)庫(kù)表獲取投票主題項(xiàng)目的數(shù)據(jù)源
  * 
  * @return
  */
 public static List<SubjectItem> getSubjectItems() {
  List<SubjectItem> list = new ArrayList<SubjectItem>();
  HashMap<String, Boolean> subjectMap = new HashMap<String, Boolean>();
  for (int i = 0; i < 3; i++) {

   for (int j = 0; j < 3; j++) {

    SubjectItem item = new SubjectItem();
    item.setSubjectId(i + "");
    //為了方便主題標(biāo)題和主題項(xiàng)目的布局，集合中同一個(gè)主題的項(xiàng)目，只有主題第一個(gè)項(xiàng)目的對(duì)象的主題名稱(chēng)不為空，其它為空
    //這樣顯示ListView的每列時(shí)如果主題名稱(chēng)為空就隱藏主題名稱(chēng)
    if (subjectMap.containsKey(item.getSubjectId())) {
     item.setSubjectName("");
    } else {
     item.setSubjectName("投票主題" + i);
     subjectMap.put(item.getSubjectId(), true);
    }

    item.setItemId(i + "" + j);
    item.setItemName("項(xiàng)目名稱(chēng)" + i + "" + j);
    item.setIsMultiChoice(i % 2 == 1 ? true : false);
    list.add(item);

   }
  }
  return list;
 }

如何在ListView控件上展示以列表的方式展示投票項(xiàng)目

首先我們先來(lái)了解下在ListView控件展示列表數(shù)據(jù)的流程。
1、定義一個(gè)展示列表每一行的布局layout，我們這里定義這個(gè)layout的文件名為listview_subject_item.xml。
2、定義展示listview的布局layout，我們這里定義這個(gè)layout的文件名為listview_subject_activity.xml。
3、定義listview的數(shù)據(jù)適配器SubjectAdapter。

定義ListView控件每列的布局

listview_subject_item.xml文件定義的ListView控件中每列view的布局。我們這里的投票項(xiàng)目是支持單選和多項(xiàng)，可以每列view的布局都包含了CheckBox和RadioButton控件，在手機(jī)界面顯示視圖的時(shí)候根據(jù)當(dāng)前項(xiàng)目的投票類(lèi)型（單選或多選）來(lái)自動(dòng)顯示（隱藏）對(duì)應(yīng)的控件。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical" >
 <!-- 投票主題ID，默認(rèn)隱藏 -->
 <TextView
  android:id="@+id/tv_subject_id"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text=""
  android:visibility="gone" />
  <!-- 投票主題下項(xiàng)目ID，默認(rèn)隱藏 -->
 <TextView
  android:id="@+id/tv_subject_item_id"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text=""
  android:visibility="gone" />
  <!-- 投票主題類(lèi)型，true為多選，否則為單選，默認(rèn)隱藏 -->
  <TextView
  android:id="@+id/tv_is_multi_choice"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text=""
  android:visibility="gone" />
  <!-- 投票主題名稱(chēng)，只有主題下的第一個(gè)項(xiàng)目才會(huì)顯示主題名稱(chēng)，其它項(xiàng)目不顯示 -->
 <TextView
  android:id="@+id/tv_subject_name"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_marginTop="20dp"
  android:layout_marginBottom="10dp"
  android:textSize="14sp"
  android:textColor="#1387DD"
  android:textStyle="bold"
  android:text="" />
 <LinearLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="horizontal" >
   <!-- 投票項(xiàng)目名稱(chēng) -->
  <TextView
   android:id="@+id/tv_subject_item_name"
   android:layout_width="0dp"
   android:layout_height="wrap_content"
   android:layout_weight="1"
   android:gravity="center_vertical" />
   <!-- 多選項(xiàng)目顯示CheckBox -->
  <CheckBox
   android:id="@+id/cb_subject_item"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:clickable="false"
   android:focusable="false"
   android:focusableInTouchMode="false"
   android:gravity="center_vertical" />
   <!-- 單選項(xiàng)目顯示RadioButton -->
  <RadioButton
   android:id="@+id/rb_subject_item"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:clickable="false"
   android:focusable="false"
   android:focusableInTouchMode="false"
   android:gravity="center_vertical" />
 </LinearLayout>
</LinearLayout>

定義展示ListView的布局

定義展示listview的布局layou，文件名為listview_subject_activity.xml
這里使用了RelativeLayout布局，將提交按鈕固定在屏幕底部，方便用戶(hù)提交投票信息。

<?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="match_parent"
 android:background="#ffffffff" >
 <RelativeLayout
  android:id="@+id/rl_head"
  android:layout_width="match_parent"
  android:layout_height="45dp"
  android:layout_alignParentTop="true"
  android:background="#0C99EF"
  android:paddingLeft="10dp" >
  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerInParent="true"
   android:text="投票項(xiàng)目"
   android:textColor="#ffffffff"
   android:textSize="16sp" />
 </RelativeLayout>
 <!-- 投票項(xiàng)目ListView -->
 <ListView
  android:id="@+id/lv_subject"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_below="@id/rl_head"
  android:layout_marginBottom="50dp"
  android:layout_marginLeft="10dp" >
 </ListView>
 <Button
  android:id="@+id/btn_add"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_alignParentBottom="true"
  android:layout_marginBottom="10dp"
  android:text="提交" />
</RelativeLayout>

定義數(shù)據(jù)適配器SubjectAdapter

listview_subject_activity.xml文件定義了名為lv_subject的ListView，這個(gè)ListView如何和listview控件中每列view的布局listview_subject_item.xml進(jìn)行關(guān)聯(lián)，還有我們前面定義了投票主題項(xiàng)目數(shù)據(jù)源，它又如何和listview進(jìn)行關(guān)聯(lián)數(shù)據(jù)綁定，要完成這些，我們必須依賴(lài)一個(gè)Apdater適配器類(lèi)。
ListView控件通過(guò)方法setAdapter和Adapter關(guān)聯(lián)。
在Adapter中通過(guò)getView方法和列view的布局listview_subject_item.xml進(jìn)行關(guān)聯(lián)。
數(shù)據(jù)源通過(guò)Adapter的自定義構(gòu)造函數(shù)的參數(shù)傳人Adapter。

package com.example.listviewcheckbox.adapter;

import java.util.HashMap;
import java.util.List;

import com.example.listviewcheckbox.R;
import com.example.listviewcheckbox.entity.SubjectItem;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.RadioButton;
import android.widget.TextView;

public class SubjectAdapter extends BaseAdapter {
 
 private List<SubjectItem> list;
 private Context context;
 //存儲(chǔ)所有主題的項(xiàng)目的選中狀態(tài)，遍歷這個(gè)容器可以獲取選中的項(xiàng)目信息
 private HashMap<String,Boolean> subjectItemMap;
 private LayoutInflater inflater;
 
 public class ViewHolder{
  //投票主題id控件
  public TextView tvSubjectId;
  //投票主題名稱(chēng)控件
  public TextView tvSubjectName;
  //投票項(xiàng)目名稱(chēng)控件
  public TextView tvSubjectItemName;
  //投票項(xiàng)目id控件
  public TextView tvSubjectItemId;
  //投票主題類(lèi)型（單選或多選）控件
  public TextView tvIsMultiChoice;
  //選中CheckBox控件（主題類(lèi)型為多選時(shí)顯示）
  public CheckBox cbSubjectItem;
  //選中RadioButton控件（主題類(lèi)型為單選時(shí)顯示）
  public RadioButton rbSubjectItem;
  
 }
 
 public SubjectAdapter(List<SubjectItem> list,Context context)
 {
  this.list=list;
  this.context=context;
   inflater = LayoutInflater.from(context);
  this.subjectItemMap=new HashMap<String, Boolean>();
  //初始化subjectItemMap，默認(rèn)所有項(xiàng)目為未選中狀態(tài)
  for (int i = 0; i < list.size(); i++) {
   this.subjectItemMap.put(list.get(i).getItemId(), false);
  }
 }

 @Override
 public int getCount() {
  // TODO Auto-generated method stub
  return list.size();
 }

 @Override
 public Object getItem(int position) {
  // TODO Auto-generated method stub
  return list.get(position);
 }

 @Override
 public long getItemId(int position) {
  // TODO Auto-generated method stub
  return position;
 }

 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
  // TODO Auto-generated method stub
  ViewHolder viewHolder = null;
  SubjectItem item = list.get(position);
  if(convertView!=null&&convertView.getId()==R.id.lv_subject)
  {
   viewHolder=(ViewHolder)convertView.getTag();
  }
  else {
   viewHolder = new ViewHolder();
   convertView=inflater.inflate(R.layout.listview_subject_item, null);
   viewHolder.tvSubjectId=(TextView)convertView.findViewById(R.id.tv_subject_id);
   viewHolder.tvSubjectName=(TextView) convertView.findViewById(R.id.tv_subject_name);
   viewHolder.tvSubjectItemId = (TextView) convertView.findViewById(R.id.tv_subject_item_id);
   viewHolder.tvSubjectItemName = (TextView) convertView.findViewById(R.id.tv_subject_item_name);
   viewHolder.cbSubjectItem = (CheckBox) convertView.findViewById(R.id.cb_subject_item);
   viewHolder.rbSubjectItem = (RadioButton) convertView.findViewById(R.id.rb_subject_item);
   viewHolder.tvIsMultiChoice = (TextView) convertView.findViewById(R.id.tv_is_multi_choice );
   
  }
  //如果項(xiàng)目名稱(chēng)為空就隱藏當(dāng)前項(xiàng)的產(chǎn)品名稱(chēng)，即所有子項(xiàng)目只允許第一個(gè)子項(xiàng)目出現(xiàn)產(chǎn)品名稱(chēng)
  if(item.getSubjectName().equals(""))
  {
   viewHolder.tvSubjectName.setVisibility(View.GONE);
  }
  else {
   viewHolder.tvSubjectName.setText(item.getSubjectName());
  }
  viewHolder.tvSubjectItemId.setText(item.getItemId());
  viewHolder.tvSubjectId.setText(item.getSubjectId());
  viewHolder.tvSubjectItemName.setText(item.getItemName());
  viewHolder.tvIsMultiChoice.setText(item.getIsMultiChoice().toString());
  //當(dāng)前項(xiàng)目為多選項(xiàng)目
  if(item.getIsMultiChoice().toString().equals("true"))
  {
   viewHolder.cbSubjectItem.setVisibility(View.VISIBLE);
   viewHolder.rbSubjectItem.setVisibility(View.GONE);
   viewHolder.cbSubjectItem.setChecked(this.subjectItemMap.get(item.getItemId()));
   
  }
  //當(dāng)前項(xiàng)目為單選項(xiàng)目
  else {
   viewHolder.cbSubjectItem.setVisibility(View.GONE);
   viewHolder.rbSubjectItem.setVisibility(View.VISIBLE);
   viewHolder.rbSubjectItem.setChecked(this.subjectItemMap.get(item.getItemId()));
  }
  convertView.setTag(viewHolder);
  return convertView;
 }
 
 /**
  * 獲取所有主題的項(xiàng)目的選中狀態(tài)容器
  * @return
  */
  public HashMap<String,Boolean> getSubjectItemMap() {
   return this.subjectItemMap;
  }
}

定義顯示投票項(xiàng)目的Activity組件

最后我們定義一個(gè)Activity組件，將投票項(xiàng)目顯示出來(lái)。
為了解決單選項(xiàng)目選中后同時(shí)要將同主題原來(lái)已經(jīng)選中的項(xiàng)目取消，定義了一個(gè)Map（radioButtonSelectedMaps）來(lái)存儲(chǔ)單選主題的選中的項(xiàng)目信息，key為單選主題ID，value為選中的項(xiàng)目ID。
這樣在用戶(hù)選擇某個(gè)單選項(xiàng)目時(shí)，程序先將SubjectAdapter對(duì)象中subjectItemMap該項(xiàng)目主題之前選中的項(xiàng)目的狀態(tài)設(shè)置為false，然后將當(dāng)前選中的項(xiàng)目設(shè)置為true，然后更新ListView，實(shí)現(xiàn)單選效果。

public class SubjectActivity extends Activity {

 private ListView lvSubject;
 private SubjectAdapter subjectAdapter;
 private List<SubjectItem> list;
 private Button btnAdd;
 // 用來(lái)保存單選主題當(dāng)前選中的項(xiàng)目，這樣用戶(hù)在切換選擇同一個(gè)主題下其它選項(xiàng)時(shí)能夠?qū)⒅斑x中的項(xiàng)目的狀態(tài)設(shè)置為未選狀態(tài)
 private HashMap<String, String> radioButtonSelectedMaps;

 @Override
 public void onCreate(Bundle savedInstanceState) {
  // TODO Auto-generated method stub
  super.onCreate(savedInstanceState);
  setContentView(R.layout.listview_subject_activity);
  lvSubject = (ListView) findViewById(R.id.lv_subject);
  btnAdd = (Button) findViewById(R.id.btn_add);
  //從數(shù)據(jù)源獲取投票主題和項(xiàng)目信息
  list = DataService.getSubjectItems();
  subjectAdapter = new SubjectAdapter(list, this);
  lvSubject.setAdapter(subjectAdapter);
  radioButtonSelectedMaps = new HashMap<String, String>();
  // 提交投票事件處理
  btnAdd.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    String selectValues="選中信息:";
    //遍歷用戶(hù)選中項(xiàng)目，可以根據(jù)實(shí)際需求獲取選中項(xiàng)目的任何信息
    for (int i = 0; i < list.size(); i++) {
     if(subjectAdapter.getSubjectItemMap().get(list.get(i).getItemId()))
     {
      selectValues+="項(xiàng)目ID:"+list.get(i).getItemId()+"項(xiàng)目名稱(chēng):"+list.get(i).getItemName();
     }
     
    }
    Toast.makeText(SubjectActivity.this, selectValues.equals("選中信息:")?"未選中任何信息":selectValues, Toast.LENGTH_LONG).show();
   }
  });

  // ListView控件每一行點(diǎn)擊事件處理
  lvSubject.setOnItemClickListener(new OnItemClickListener() {

   @Override
   public void onItemClick(AdapterView<?> parent, View view,
     int position, long id) {
    // TODO Auto-generated method stub
    ViewHolder viewHolder = (ViewHolder) view.getTag();
    // 如果當(dāng)前行是多選項(xiàng)目
    if (viewHolder.tvIsMultiChoice.getText().equals("true")) {
     viewHolder.cbSubjectItem.toggle();
     subjectAdapter.getSubjectItemMap().put(viewHolder.tvSubjectItemId.getText().toString(),viewHolder.cbSubjectItem.isChecked());

    } 
    
    //如果當(dāng)前行為單選項(xiàng)目，注意單選項(xiàng)目選中后需要將同一主題下已經(jīng)選中的項(xiàng)目設(shè)置為未選中狀態(tài)
    else {
     String currentSubjectIdSelected=viewHolder.tvSubjectId.getText().toString();
     String currentSubjectItemId=viewHolder.tvSubjectItemId.getText().toString();
     //判斷該單選主題是否有已經(jīng)選中項(xiàng)目，如果有需要將它的選中狀態(tài)設(shè)置為未選中
     if (radioButtonSelectedMaps.containsKey(currentSubjectIdSelected)) {
      subjectAdapter.getSubjectItemMap().put(radioButtonSelectedMaps.get(currentSubjectIdSelected),false);

     }
     //將當(dāng)前選中的項(xiàng)目設(shè)置為該單選主題的選中項(xiàng)目
     radioButtonSelectedMaps.put(currentSubjectIdSelected,currentSubjectItemId);
     viewHolder.rbSubjectItem.toggle();
     subjectAdapter.getSubjectItemMap().put(currentSubjectItemId,viewHolder.rbSubjectItem.isChecked());
     //更新ListView
     updateListView();

    }}});
 }
 
 /**
  * 更新ListView
  */
 private void updateListView()
 {
  subjectAdapter.notifyDataSetChanged();
 }

}

獲取投票結(jié)果

// 提交投票事件處理
  btnAdd.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    String selectValues="選中信息:";
    //遍歷用戶(hù)選中項(xiàng)目，可以根據(jù)實(shí)際需求獲取選中項(xiàng)目的任何信息
    for (int i = 0; i < list.size(); i++) {
     if(subjectAdapter.getSubjectItemMap().get(list.get(i).getItemId()))
     {
      selectValues+="項(xiàng)目ID:"+list.get(i).getItemId()+"項(xiàng)目名稱(chēng):"+list.get(i).getItemName();
     }
     
    }
    Toast.makeText(SubjectActivity.this, selectValues.equals("選中信息:")?"未選中任何信息":selectValues, Toast.LENGTH_LONG).show();
   }
  });

代碼下載：https://github.com/zoupeiyang/ListViewCheckBox

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: