前段時間容客，寫了一個小項目秕铛，里面有個界面如下圖所示，之前的版本是用Spinner來做缩挑，覺得不夠拉轟但两，所以采用GridView做了一個實現(xiàn)，效果還不錯供置，Mark一下谨湘。
彈出單選GridView.png
一、點擊那個底部的綠色按鈕士袄，彈出一個對話框悲关，對話框里面的內容是一個單選的GridView，關鍵代碼如下：
//add_pay就是底部那個按鈕
add_pay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
AlertDialog alertDialog = new AlertDialog.Builder(AddActivity.this)
.setView(getChoiceView(2))
.create();
alertDialog.show();
}
});
上面的重點是那個getChoiceView(2)娄柳，因為我有好幾個數(shù)據源寓辱，所以就用一個int類型參數(shù)的type來區(qū)分一下，不同的type取不同的數(shù)據源展示赤拒。
二秫筏、getChoiceView方法，主要是加載布局挎挖，初始化GridView这敬，然后設置Adapter和點擊事件，比較簡單蕉朵，關鍵代碼如下：
private View getChoiceView(final int type) {
//R.layout.dialog_choice就是GridView所在的那個布局崔涂，下面有介紹
View view = LayoutInflater.from(AddActivity.this).inflate(R.layout.dialog_choice, null);
GridView gv = (GridView) view.findViewById(R.id.gv);
//GridView的數(shù)據源，直接從strings.xml中加載過來
List<String> data;
//自定義適配器
final MyAdapter adapter;
//判斷類型始衅，加載數(shù)據源設置Adapter
if (type == 1) {
data = Arrays.asList(getResources().getStringArray(R.array.event));
adapter = new MyAdapter(this, data);
gv.setAdapter(adapter);
//設置默認選中
adapter.changeState(eventSelected);
} else {
data = Arrays.asList(getResources().getStringArray(R.array.pay));
adapter = new MyAdapter(this, data);
gv.setAdapter(adapter);
adapter.changeState(paySelected);
}
//監(jiān)聽點擊事件冷蚂，點擊以后缭保，之前的選中應該變?yōu)槲催x中
gv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
if (type == 1) {
eventSelected = position;
//將選擇的內容設置到底部的按鈕上去
add_event.setText(eventArray.get(position).toString());
} else {
paySelected = position;
add_pay.setText(payArray.get(position).toString());
}
alertDialog.dismiss();
adapter.changeState(position);
}
});
return view;
}
三、dialog_choice 與 choice_item布局蝙茶，非常簡單
GridView所在的布局如下：
<?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:background="@color/white"
android:gravity="center"
android:orientation="vertical">
<GridView
android:id="@+id/gv_choice"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:horizontalSpacing="15dp"
android:listSelector="@color/transparent"
android:numColumns="2" //2列
android:verticalSpacing="15dp"></GridView>
</LinearLayout>
GridView中每個item的布局如下：
<?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:orientation="vertical">
<TextView
android:id="@+id/tv_choice"
android:layout_width="match_parent"
android:layout_height="40dp"
android:button="@null"
android:gravity="center"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:textColor="@color/white" />
</LinearLayout>
四艺骂、MyAdapter繼承自BaseAdapter，關鍵是弄一個記錄選中與否的ArrayList隆夯，默認初始化的時候都是未選中钳恕，然后設置一個方法能修改選中項，在getView中根據選中與否蹄衷，來設置背景色
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = null;
if (convertView == null) {
viewHolder = new ViewHolder();
convertView = mInflater.inflate(R.layout.choice_item, null);
viewHolder.title = (TextView) convertView.findViewById(R.id.tv_choice);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
if (!"".equals(data.get(position))) {
viewHolder.title.setText(data.get(position));
}
if (list.get(position) == true) {
viewHolder.title.setBackgroundDrawable(activity.getResources()
.getDrawable(R.drawable.choice_item_bg_selected));
} else {
viewHolder.title.setBackgroundDrawable(activity.getResources()
.getDrawable(R.drawable.choice_item_bg_default));
}
return convertView;
}
/**
* 修改選中時的狀態(tài)
*
* @param position
*/
public void changeState(int position) {
if (lastPosition != -1) {
list.set(lastPosition, false);// 取消上一次的選中狀態(tài)
}
list.set(position, !list.get(position));// 設置這一次的選中狀態(tài)
lastPosition = position; // 記錄本次選中的位置
notifyDataSetChanged(); // 通知適配器進行更新
}
最終效果
演示.gif
