Android 自定义下拉选择

    UI妹子总是能创造出漂亮的北鼻,但程序猿哥哥总是把它养残,最近项目上遇到需要用到下拉控件,但因为对原生下拉控件的不熟悉导致做出来的界面总是达不到要求,被按在地板上摩擦了一遍又一遍,于是就用自己的方式重新写了一个下拉控件。

先上效果图

该控件是采用布局加dialog实现的,没研究过官方的,所以将就用。

不哔哔,先上代码 所有代码就一个类和几个xml使用方便

import android.app.Dialog;
import android.content.Context;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewTreeObserver;
import android.view.Window;
import android.view.WindowManager;
import android.widget.AbsListView;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.wealth.gys.crdeit.wealth.R;
import com.wealth.gys.crdeit.wealth.utils.ContextUtil;

import java.util.List;

/**
 * Created by 郭月森 on 2019/1/15.
 */

public class MySpinnerDialog extends RelativeLayout implements View.OnClickListener{
    Context context;
    TextView textView;
    List<String> datas;
    Dialog dialog;//下拉列表弹框
    int index = -1;//选中下标
    int thiswidth;//控件宽度
    int thisheight;//控件高度
    private OnSpinnerItemClick onSpinnerItemClick;
    public MySpinnerDialog(Context context) {
        super(context);
        this.context = context;
        initView(context);
    }

    public MySpinnerDialog(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.context = context;
        initView(context);
    }

    public MySpinnerDialog(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.context = context;
        initView(context);
    }
    private void initView(Context context) {
        View inflate = LayoutInflater.from(context).inflate(R.layout.view_spinner, null);
        textView = inflate.findViewById(R.id.spinner_text);
        inflate.setOnClickListener(this);//设置控件点击事件
        addView(inflate);
    }

    /**
     * 设置选择内容
     * @param index 下标
     */
    public void setIndex(int index) {
        if(index>datas.size()-1){
            return;
        }
        this.index = index;
        textView.setText(datas.get(index));
        if (onSpinnerItemClick!=null){//通知页面刷新相关数据
            onSpinnerItemClick.onSpinnerItemClick(index,datas.get(index));
        }
    }

    @Override
    protected void onFinishInflate() {//确保宽高被获取到,没获取到宽高是显示不出列表弹框的(弹框的宽高根据控件的宽高设置的)
        super.onFinishInflate();
        this.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                MySpinnerDialog.this.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                thiswidth = MySpinnerDialog.this.getMeasuredWidth();
                thisheight = MySpinnerDialog.this.getMeasuredHeight();
                //Log.d("宽度1",""+thiswidth);
                if (datas!=null)
                    initData();
            }
        });

    }

    /**
     * 设置通知接口
     * @param onSpinnerItemClick
     */
    public void setOnSpinnerItemClick(OnSpinnerItemClick onSpinnerItemClick) {
        this.onSpinnerItemClick = onSpinnerItemClick;
    }

    /**
     * 设置数据源
     * @param datas
     */
    public void setDatas(List<String> datas) {
        this.datas = datas;
        if (thiswidth!=0){//判断宽高是否有获取到,如果已获取到宽高则直接更新dialog
            initData();
        }
    }
    private void initData(){
        if (datas.size()>0) {
            textView.setText(datas.get(0));//设置默认值
            index =0;//保存默认下标
            View inflate = LayoutInflater.from(context).inflate(R.layout.dialog_my_spinner, null);//下拉列表弹框布局
            ListView listView = inflate.findViewById(R.id.spinner_list);//数据展示列表
            listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                    textView.setText(datas.get(i));//设置选中值
                    index = i;//保存选中下标
                    dialog.dismiss();//隐藏列表
                    if (onSpinnerItemClick!=null){//返回数据
                        onSpinnerItemClick.onSpinnerItemClick(i,datas.get(i));
                    }
                }
            });
            ViewGroup.LayoutParams layoutParams = listView.getLayoutParams();//获得listView的params
            layoutParams.width = thiswidth;//将弹框的宽设置为和控件宽度一样
            layoutParams.height = datas.size()>5?thisheight * 5:thisheight * datas.size();//如果条数小于等于5条则将弹框高度设置为条数*控件高度,大于5条则设置5个控件的高度
            listView.setLayoutParams(layoutParams);
            listView.setAdapter(new ThisAdapter(context,datas));
            dialog = new Dialog(context,R.style.dialog);//设置弹窗的style
            dialog.setContentView(inflate);
            int[] location = new int[2];
            getLocationOnScreen(location);//获取控件在整个屏幕内的绝对坐标
            Window dialogWindow = dialog.getWindow();
            WindowManager.LayoutParams lp = dialogWindow.getAttributes();
            dialogWindow.setGravity(Gravity.LEFT | Gravity.TOP);//将弹框显示的位置参数修正为左上角
            //dialogWindow.clearFlags( WindowManager.LayoutParams.FLAG_DIM_BEHIND);
            lp.x = location[0]; // 新位置X坐标,即弹框在屏幕中的X值
            lp.y = location[1] + thisheight- ContextUtil.dip2px(context,22); // 新位置Y坐标,即弹框距离顶部的位置,ContextUtil.dip2px(context,22)为手机状态栏的高度,getLocationOnScreen获取到的位置是包含了状态栏的高度的
            lp.width = layoutParams.width; // 宽度
            lp.height = layoutParams.height; // 高度
            lp.alpha = 1f; // 透明度
            dialogWindow.setAttributes(lp);
        }
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    public void onClick(View view) {
        if (dialog!=null){
            if (dialog.isShowing()){
                dialog.dismiss();
            }else {
                dialog.show();
            }
        }
    }
    class ThisAdapter extends BaseAdapter {
        Context context;
        List<String> datas;

        public ThisAdapter(Context context, List<String> datas) {
            this.context = context;
            this.datas = datas;
        }

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

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

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

        public void notifyDataSetChanged(List<String> array) {
            datas = array;
            notifyDataSetChanged();
        }

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {
            ThisItem item = null;
            if (view == null) {
                item = new ThisItem();
               view = LayoutInflater.from(context).inflate(R.layout.item_dialog_spinner,null);
               item.t1 = view.findViewById(R.id.spinner_item);
               view.setTag(item);
                ViewGroup.LayoutParams layoutParams = new AbsListView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,thisheight);//将item的高度设置为控件的高度
                //layoutParams.height = thisheight;
                view.setLayoutParams(layoutParams);
            } else {
                item = (ThisItem) view.getTag();
            }
            item.t1.setText(datas.get(i));
            return view;
        }
    }

    class ThisItem {
        TextView t1;
    }
    public interface OnSpinnerItemClick{//返回参数的接口

        /**
         *
         * @param i 选中的下标
         * @param str 对应的内容
         */
        public void onSpinnerItemClick(int i,String str);
    }
}
UI代码都是xml写的,下面粘贴出来
view_spinner 当然还有一个下拉箭头,也可以直接写在这个xml里面,我把它写在了控件外面。
<?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">
<TextView
    android:id="@+id/spinner_text"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical"
    android:text="默认"
    android:paddingLeft="10dip"
    android:textColor="#ff333333"
    />
</RelativeLayout>
dialog_my_spinner 这个是dialog的布局
<?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="@drawable/spinner_bg"
    >
    <ListView
        android:id="@+id/spinner_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></ListView>
</RelativeLayout>

有个边框 布局  spinner_bg

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 主体背景颜色值 -->
    <solid android:color="#FFFFFF" />
    <!-- 连框宽度和颜色值 -->
    <stroke
        android:width="1dp"
        android:color="#cccccc" />
</shape>
item_dialog_spinner   列表item的布局,这个布局可以直接代码写的很简单
<?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"
    >
<TextView
    android:id="@+id/spinner_item"
    android:layout_width="match_parent"
    android:layout_height="38dip"
    android:paddingLeft="10dip"
    android:gravity="center_vertical"
    />
</RelativeLayout>

还有个dialog的style也一并贴出来

<style name="dialog" parent="@android:style/Theme.Dialog">
        <!-- 有无边框 -->
        <item name="android:windowFrame">@null</item>
        <!-- 是否浮现在activity之上 -->
        <item name="android:windowIsFloating">true</item>
        <!-- 是否透明 -->
        <item name="android:windowIsTranslucent">true</item>
        <!--无标题 -->
        <item name="android:windowNoTitle">true</item>
        <!--透明背景-->
        <item name="android:background">@android:color/white</item>
        <!--窗口背景透明-->
        <item name="android:windowBackground">@android:color/transparent</item>
        <!--弹窗背景是否变暗-->
        <item name="android:backgroundDimEnabled">false</item>
    </style>

控件代码就这些,复制即可用,有注释,修改方便,也没有自定义控件的属性参数

下面是使用方式,直接在xml中使用就可以了

<com.***.***.MySpinnerDialog
                android:id="@+id/my_spinner1"
                android:layout_width="match_parent"
                android:layout_height="38dip"
                android:background="#ececec"
                ></com.***.***.MySpinnerDialog>

当然,不要忘了加上下拉箭头,这里我没有将下拉箭头加上。还要注意包名

下面是设置数据源

    List<String> list = new ArrayList<>();
        for (int i = 0; i < array.length(); i++) {
            JSONObject object = array.getJSONObject(i);
            list.add("123");
        }
        mySpinner.setDatas(list);
        mySpinner.setOnSpinnerItemClick(new MySpinnerDialog.OnSpinnerItemClick() {
            @Override
            public void onSpinnerItemClick(int i, String str) {
                //得到返回
            }
        });

代码贴的有点长,不过就一个类而已,复制粘贴即可用

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值