自定义Dialog弹框,以GridView表格形式完成单选

       最近公司在做一个商城的项目,业务中需要选取保险公司。逻辑大概就是点击选择保险公司,弹出一个悬浮框,悬浮框展示几个保险公司供选择,选中后点确认弹框消失,功能很简单,一般都自定义一个Dialog或者自定义一个PopupWindow。但是网上实现的基本都是listview等以列表形式展示的,所以很有正义感的我有必要把表格布局的实现方式展示给大家。

       先上图。 

       

       主要实现的逻辑是自定义一个布局实现Dialog,重写相关方法,构造方法提供给外界(这里是MainActivity)设置数据,重写相关点击事件,实现一个回调的接口供外界处理点击事件。

       下面主要是贴出主要的实现逻辑代码,懒得看的话,具体的Demo可以点击 这里 直达GitHub。记得小手点星星哦~

                                                    

这里是关键代码 自定义保险选取类 SelectInsurDialog :

package com.xdx.doall.griddialog;

import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.WindowManager;
import android.widget.AdapterView;
import android.widget.Button;
import android.widget.GridView;
import java.util.ArrayList;
import java.util.List;

/**
 * Created by xdx on 2018/7/30.
 */
public class SelectInsurDialog extends Dialog {

    DialogCallback callback;
    String name ;
    Button sure;
    InsurGridViewAdapt mAdapter;
    List<InsurEntity> listData;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setCustomeDialog();

    }
    // 提供构造方法让外界设置数据
    public void setList(List<InsurEntity> listData){
        this.listData = listData;
    }
    public SelectInsurDialog(Context context) {
        super(context, R.style.mall_Dialog);

    }
    public SelectInsurDialog(Context context, int themeResId) {
        super(context, themeResId);
    }

    protected SelectInsurDialog(Context context, boolean cancelable, OnCancelListener cancelListener) {
        super(context, cancelable, cancelListener);
        setCustomeDialog();
    }


    public void setDialogCallback(DialogCallback callback) {
        this.callback = callback;
    }

    private void setCustomeDialog() {

        final List<InsurEntity> list = new ArrayList<InsurEntity>();
        for (int i = 0 ;i<listData.size(); i++){
            InsurEntity insurEntity = new InsurEntity();
            insurEntity.setName(listData.get(i).getName());
            list.add(insurEntity);
        }
        View mView = LayoutInflater.from(getContext()).inflate(R.layout.mall_dialog_selectinsur, null);
        GridView gridView= mView.findViewById(R.id.gridView);
        mAdapter = new InsurGridViewAdapt(getContext(),list);
        gridView.setAdapter(mAdapter);
        gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) {
                for(int i = 0;i<list.size();i++){
                    if(position == i){
                        name = list.get(position).getName();
                        list.get(i).setSelect(true);
                    }else{
                        list.get(i).setSelect(false);
                    }
                }
                mAdapter.notifyDataSetChanged();
            }
        });
        Button cancle = (Button) mView.findViewById(R.id.btn_cancel);
        sure = (Button) mView.findViewById(R.id.btn_sure);
        setContentView(mView);
        //这里设置弹框的具体大小
        WindowManager.LayoutParams lp = getWindow().getAttributes();
        lp.width = (int) (DisplayUtil.getScreenWidth(getContext()) * 0.8);
        getWindow().setAttributes(lp);

        cancle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                SelectInsurDialog.this.dismiss();
            }
        });
        sure.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                callback.onClickRadioButton(name);
            }
        });

    }

    /**
     * 提供一个接口,供外界处理点击事件,也可以单独写个接口
     */
    public interface DialogCallback {
        void onClickRadioButton(String name);
    }


}

 

然后是处理弹框的GridView 布局文件 :all_dialog_selectinsur.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rootView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    android:descendantFocusability="blocksDescendants"
    android:orientation="vertical">


    <TextView
        android:id="@+id/groupnameet"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="20dp"
        android:text="请选择保险公司"
        android:textColor="@color/mall_selector_order_paytype"
        android:textSize="12sp" />


    <GridView
        android:id="@+id/gridView"
        android:clickable="true"
        android:focusable="true"
        android:listSelector="#00000000"
        android:verticalSpacing="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible"
        android:numColumns="2">
    </GridView>

    <LinearLayout
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_marginTop="40dp"
        android:layout_marginBottom="20dp"
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/btn_cancel"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="30dp"
            android:background="@drawable/me_shape_eclass"
            android:button="@null"
            android:gravity="center"
            android:text="取消"
            android:layout_marginLeft="20dp"
            android:textColor="@color/mall_bg_1DC97C"
            android:textSize="12sp">
        </Button>

        <Button
            android:id="@+id/btn_sure"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:gravity="center"
            android:layout_marginRight="20dp"
            android:layout_marginLeft="20dp"
            android:layout_height="30dp"
            android:background="@drawable/mall_shape_sure"
            android:button="@null"
            android:text="确认"
            android:textColor="#ffffff"
            android:textSize="12sp">

        </Button>
    </LinearLayout>

</LinearLayout>

再是处理布局逻辑的 adapter

package com.xdx.doall.griddialog;

import android.content.Context;
import android.graphics.Color;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

import java.util.List;
/**
 * Created by xdx on 2018/7/30.
 */
public class InsurGridViewAdapt extends BaseAdapter {
    private Context mContext;
    private List<InsurEntity> List;

    public InsurGridViewAdapt(Context mContext, List<InsurEntity> List) {
        this.mContext = mContext;
        this.List = List;
    }

    @Override
    public int getCount() {
        return List.size();
    }

    @Override
    public Object getItem(int i) {
        return List.get(i);
    }

    @Override
    public long getItemId(int i) {
        return i;
    }

    @Override
    public View getView(int position, View view, ViewGroup viewGroup) {
        final InsurEntity insurBean = (InsurEntity) getItem(position);
        ViewHolder viewHolder;
        if(view == null){
            view = View.inflate(mContext, R.layout.mall_item_insur,null);
            viewHolder = new ViewHolder();
            viewHolder.name = view.findViewById(R.id.rb03);
            view.setTag(viewHolder);
        }else {
            viewHolder = (ViewHolder) view.getTag();
        }
        if(insurBean.isSelect()){
            viewHolder.name.setBackgroundResource(R.drawable.me_shape_eclass);
            viewHolder.name.setTextColor(Color.parseColor("#28cc82"));
        }else {
            viewHolder.name.setBackgroundResource(R.drawable.me_shape_eclass_u);
            viewHolder.name.setTextColor(Color.parseColor("#8F8F8F"));
        }
        viewHolder.name.setText(List.get(position).getName());

        return view;
    }
    class ViewHolder{
        TextView name;
    }


}

基本上主要的代码就这些,然后是在具体的页面里面调用即可。其他的一些详细代码可以看我 GitHub上的Demo,都在上面了。如果有帮到你,请给我一个布灵布灵的 star 哦~

展开阅读全文

没有更多推荐了,返回首页