背景

公司项目中有关于个人信息登记的界面，其中有左右眼视力，左右耳听力之类的填写。如果让用户手动输入就太不人性化了，所以决定使用弹出 dialog 列表的形式，让用户进行选择。因为是左右两个数据，就有了现在这个自定义的 DoubleChooseDialog。

效果

效果.gif

思路

少废话，上代码

初始化函数

/** 
* 初始化函数 
* @param context 
* @param strings 视力数组 
* @param title 标题 
* @param leftRbtnText 左Rbtn文字 
* @param rightRbtnText 右Rbtn文字 
* @param viewId 控件id */
public MyDoubleDialog(Context context, String[] strings,
          String title, String leftRbtnText,
          String rightRbtnText, int viewId) {    
    super(context, R.style.MyDialog);    
    this.mContext = context;   
    this.mStrings = strings;    
    this.mTitle = title;    
    this.mLeftRbtnText = leftRbtnText;    
    this.mRightRbtnText = rightRbtnText;    
    this.mViewId = viewId;    
    initDialog();}

初始化 dialog 样式

private void initDialog() {    
    LayoutInflater inflater = (LayoutInflater) mContext.
    getSystemService(mContext.LAYOUT_INFLATER_SERVICE);
    View view = inflater.inflate(R.layout.layout_double_choose_dialog, null);   
    this.setContentView(view);    
    mTvDialogTitle = (TextView) view.findViewById(R.id.tv_dialog_title);
    mRbtnLeft = (RadioButton) view.findViewById(R.id.rbtn_left);
    mRbtnRight = (RadioButton) view.findViewById(R.id.rbtn_right);
    mLvDlalogList = (ListView) view.findViewById(R.id.lv_dialog_list);
    mTvDialogTitle.setText(mTitle);    mRbtnLeft.setText(mLeftRbtnText);
    mRbtnRight.setText(mRightRbtnText);
    mLvDlalogList.setAdapter(new ArrayAdapter<String>(mContext,
    R.layout.layout_list_item, R.id.tv_item, mStrings));
    mLvDlalogList.setOnItemClickListener(this);
    mArrayList = new ArrayList<>();
}

列表以及左右 Rbtn 点击事件

@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
    if (mRbtnLeft.isChecked()) { 
        mRbtnLeft.setText(mLeftRbtnText + " [" + mStrings[position] + "]");
        mArrayList.add(0, mStrings[position]);
        mRbtnLeft.setChecked(false);
        mRbtnRight.setChecked(true);
        leftChooseOK = true;
    } else {
        mRbtnRight.setText(mRightRbtnText +  " [" + mStrings[position] +   "]");
        mArrayList.add(1, mStrings[position]); 
        mRbtnLeft.setChecked(true);
        mRbtnRight.setChecked(false);
        rightChooseOK = true;
    }
    if (leftChooseOK && rightChooseOK) {
        this.dismiss();//如果选择完成，关闭dialog
        Log.i(TAG, "onItemClick: 选择结果 " + mLeftRbtnText + "：" + mArrayList.get(0)
        + " " + mRightRbtnText + "：" + mArrayList.get(1));
        mSetChooseListener.onChooseSelect(mLeftRbtnText + "：" + mArrayList.get(0)
        + " " + mRightRbtnText + "：" + mArrayList.get(1), mViewId); 
    }
}

接口回调函数

//回调接口
public interface SetChooseListener {
    void onChooseSelect(String chooseResult, int viewId);
}
public void setChooseListener(SetChooseListener listener) {
    mSetChooseListener = listener;
}

使用

MyDoubleDialog mMyDoubleDialog = new MyDoubleDialog(MainActivity.this,
visionStrings, "选择视力", "左眼", "右眼",R.id.tv_test);
mMyDoubleDialog.show();
mMyDoubleDialog.setChooseListener(MainActivity.this);

@Override
public void onChooseSelect(String chooseResult, int viewId) {
    if (viewId == R.id.tv_test) { 
        mTvTest.setText(chooseResult);
    }
}

The End

原理和详细使用方法在代码中已经写得很详细了，如果还有不懂的地方，请私信或者评论中留言。