NO IMAGE

前言

很早之前寫過一篇
自定義提示資訊Dialog
如圖:


這個形式也是最常用的,不過最近需要用到列表資訊Dialog,原生的不光樣式不能滿足需求,而且是開發電視端的APP,需要對焦點進行特殊處理,所以就需要自定義Dialog

我們先來看一下系統自帶的列表Dialog。

系統自帶列表Dialog

第一種:純列表

我們先來看第一種:

最簡單的一種,沒有當前狀態,只有列表,選中之後彈框就會消失(非手動呼叫dialog.dismiss()

程式碼如下:

AlertDialog alertDialog = new AlertDialog
.Builder(MainActivity.this)
.setItems(new String[]{"科目一", "科目二", "科目三"}, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(MainActivity.this,"選擇了第" which "個",Toast.LENGTH_SHORT).show();
}
}).create();
alertDialog.show();

第二種:單選列表

這種列表會有checked提示,setSingleChoiceItems()中第二個引數就是控制第幾個被選中,而且點選之後不會自動消失,需要手動呼叫dialog.dismiss(),有時會配合setNegativeButton()、setPositiveButton等一起使用。

程式碼如下:

AlertDialog alertDialog = new AlertDialog
.Builder(MainActivity.this)
.setSingleChoiceItems(new String[]{"科目一", "科目二", "科目三"}, 0, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(MainActivity.this,"選擇了第" which "個",Toast.LENGTH_SHORT).show();
}
}).create();
alertDialog.show();

第三種:多選列表

這種列表也會有checked提示,而且是多選框,setSingleChoiceItems()的第二個引數是boolean陣列,控制哪些被選中。而且點選之後也不會自動消失,需要手動呼叫dialog.dismiss(),有時會配合setNegativeButton()、setPositiveButton()等一起使用。

程式碼如下:

AlertDialog alertDialog = new AlertDialog
.Builder(MainActivity.this)
.setMultiChoiceItems(new String[]{"科目一", "科目二", "科目三"}, new boolean[]{true, false, true}, new DialogInterface.OnMultiChoiceClickListener() {
@Override
public void onClick(DialogInterface dialog, int which, boolean isChecked) {
Toast.makeText(MainActivity.this,"選擇了第" which "個",Toast.LENGTH_SHORT).show();
}
}).create();
alertDialog.show();

自定義Dialog

看了系統自帶的效果你會發現不能滿足UI的效果,那麼接下來進行我們的自定義。

第一步:自定義item的佈局檔案

item佈局檔案dialog_item.xml程式碼

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@ id/contentConstraintLayout"
android:layout_width="@dimen/dp_450"
android:layout_height="@dimen/dp_85">
<TextView
android:id="@ id/typeTextview"
android:textSize="@dimen/sp_30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:text="256Kbps"
android:textColor="@color/color_212121"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@ id/stateImageView"
android:layout_width="@dimen/dp_65"
android:layout_height="@dimen/dp_65"
android:layout_marginEnd="17dp"
android:background="@drawable/diglog_sel"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

圖片選中效果diglog_sel.xml程式碼

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/selected" android:state_selected="true" />
<item android:drawable="@android:color/transparent" />
</selector>

第二步:自定義adapter

我這裡只是傳遞一些簡單的資料到adapter,具體看實際業務傳遞不同的資料,控制不同的效果。

public class DialogItemAdapter extends BaseAdapter {
//這裡可以傳遞個物件,用來控制不同的item的效果
//比如每個item的背景資源,選中樣式等
public List<String> list;
LayoutInflater inflater;
public DialogItemAdapter(Context context, List<String> list) {
this.list = list;
inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return list.size();
}
@Override
public String getItem(int i) {
if (i == getCount() || list == null) {
return null;
}
return list.get(i);
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public View getView(int position, View convertView, ViewGroup viewGroup) {
ViewHolder holder;
if (convertView == null) {
holder = new ViewHolder();
convertView = inflater.inflate(R.layout.dialog_item, null);
holder.typeTextview = (TextView) convertView.findViewById(R.id.typeTextview);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.typeTextview.setText(getItem(position));
return convertView;
}
public static class ViewHolder {
public TextView typeTextview;
}
}

第三步:使用

DialogItemAdapter adapter = new DialogItemAdapter(MainActivity.this, iniDatas());
AlertDialog alertDialog = new AlertDialog
.Builder(MainActivity.this)
.setSingleChoiceItems(adapter, 0, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
dialog.dismiss();
}
}).create();
alertDialog.show();
public List<String> iniDatas() {
List<String> list = new ArrayList<String>();
list.add("科目一");
list.add("科目二");
list.add("科目三");
return list;
}

博主這個dialog要在TV上使用,所以可以看到通過上下鍵控制選中的時候右邊會有一個選中箭頭,然後在點選的時候dismiss

更多效果等待你可自行打造你的專屬Dialog。