Android自定义控件进阶-打造Android自定义的下拉列表框控件

技术:Android+java
 

概述

Android中的有个原生的下拉列表控件Spinner,但是这个控件有时候不符合我们自己的要求, 比如有时候我们需要类似windows 或者web网页中常见的那种下拉列表控件

详细

代码下载:http://www.demodashi.com/demo/14682.html

一、概述

Android中的有个原生的下拉列表控件Spinner,但是这个控件有时候不符合我们自己的要求,

比如有时候我们需要类似windows 或者web网页中常见的那种下拉列表控件,类似下图这样的:

Android自定义控件进阶-打造Android自定义的下拉列表框控件_第1张图片

Android自定义控件进阶-打造Android自定义的下拉列表框控件_第2张图片

这个时候只有自己动手写一个了。其实实现起来不算很难,

本文实现的方案是采用TextView +ImageView+PopupWindow的组合方案。

先来看看我们的自己写的控件效果图吧:(源码在文章下面最后给出哈!)

Android自定义控件进阶-打造Android自定义的下拉列表框控件_第3张图片

 

二、自定义下拉列表框控件的实现

1. 自定义控件用到的布局文件和资源:

结果框的布局页面:dropdownlist_view.xml:



    
    
    

下拉弹窗列表布局页面:dropdownlist_popupwindow.xml:



    
    

 

2. 自定义下拉列表框控件类的实现:

我们采用了TextView+ImageView+PopupWindow的组合方案,所以我的自定义控件需要重写ViewGroup,由于我们已经知道了,布局方向为竖直方向,所以这里,

我直接继承LinearLayout来写这个控件。具体实现代码如下:

package com.czm.xcdropdownlistview;

import java.util.ArrayList;


import android.annotation.SuppressLint;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.PopupWindow;
import android.widget.TextView;

@SuppressLint("NewApi")
/**
 * 下拉列表框控件
 * @author caizhiming
 *
 */
public class XCDropDownListView extends LinearLayout{

    private TextView editText;
    private ImageView imageView;
    private PopupWindow popupWindow = null;
    private ArrayList dataList =  new ArrayList();
    private View mView;
    public XCDropDownListView(Context context) {
        this(context,null);
        // TODO Auto-generated constructor stub
    }
    public XCDropDownListView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
        // TODO Auto-generated constructor stub
    }
    public XCDropDownListView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        // TODO Auto-generated constructor stub
        initView();
    }

    public void initView(){
        String infServie = Context.LAYOUT_INFLATER_SERVICE;
        LayoutInflater layoutInflater;
        layoutInflater =  (LayoutInflater) getContext().getSystemService(infServie);
        View view  = layoutInflater.inflate(R.layout.dropdownlist_view, this,true);
        editText= (TextView)findViewById(R.id.text);
        imageView = (ImageView)findViewById(R.id.btn);
        this.setOnClickListener(new OnClickListener() {
            
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                if(popupWindow == null ){
                    showPopWindow();
                }else{
                    closePopWindow();
                }
            }
        });
    }
    /**
     * 打开下拉列表弹窗
     */
    private void showPopWindow() {  
        // 加载popupWindow的布局文件  
        String infServie = Context.LAYOUT_INFLATER_SERVICE;
        LayoutInflater layoutInflater;
        layoutInflater =  (LayoutInflater) getContext().getSystemService(infServie);
        View contentView  = layoutInflater.inflate(R.layout.dropdownlist_popupwindow, null,false);
        ListView listView = (ListView)contentView.findViewById(R.id.listView);
        
        listView.setAdapter(new XCDropDownListAdapter(getContext(), dataList));
        popupWindow = new PopupWindow(contentView,LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
        popupWindow.setBackgroundDrawable(getResources().getDrawable(R.color.transparent));
        popupWindow.setOutsideTouchable(true);
        popupWindow.showAsDropDown(this);
    }
    /**
     * 关闭下拉列表弹窗
     */
    private void closePopWindow(){
        popupWindow.dismiss();
        popupWindow = null;
    }
    /**
     * 设置数据
     * @param list
     */
    public void setItemsData(ArrayList list){
        dataList = list;
        editText.setText(list.get(0).toString());
    }
    /**
     * 数据适配器
     * @author caizhiming
     *
     */
    class XCDropDownListAdapter extends BaseAdapter{

        Context mContext;
        ArrayList mData;
        LayoutInflater inflater;
        public XCDropDownListAdapter(Context ctx,ArrayList data){
            mContext  = ctx;
            mData = data;
            inflater = LayoutInflater.from(mContext);
        }
        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return mData.size();
        }

        @Override
        public Object getItem(int position) {
            // TODO Auto-generated method stub
            return null;
        }

        @Override
        public long getItemId(int position) {
            // TODO Auto-generated method stub
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            // TODO Auto-generated method stub
            // 自定义视图
            ListItemView listItemView = null;
            if (convertView == null) {
                // 获取list_item布局文件的视图
                convertView = inflater.inflate(R.layout.dropdown_list_item, null);
                
                listItemView = new ListItemView();
                // 获取控件对象
                listItemView.tv = (TextView) convertView
                        .findViewById(R.id.tv);

                listItemView.layout = (LinearLayout) convertView.findViewById(R.id.layout_container);
                // 设置控件集到convertView
                convertView.setTag(listItemView);
            } else {
                listItemView = (ListItemView) convertView.getTag();
            }
            
            // 设置数据
            listItemView.tv.setText(mData.get(position).toString());
            final String text = mData.get(position).toString();
            listItemView.layout.setOnClickListener(new OnClickListener() {
                
                @Override
                public void onClick(View v) {
                    // TODO Auto-generated method stub
                    editText.setText(text);
                    closePopWindow();
                }
            });
            return convertView;
        }
    
    }
    private static class ListItemView{
        TextView tv;
        LinearLayout layout;
    }

}

三、如何使用该自定义下拉列表框控件

使用该控件和使用普通的自带的控件一样,在java代码中使用:

XCDropDownListView dropDownListView;
    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        dropDownListView = (XCDropDownListView)findViewById(R.id.drop_down_list_view);
        ArrayList list = new ArrayList();        for(int i = 0;i< 6;i++){
            list.add("下拉列表项"+(i+1));
        }
        dropDownListView.setItemsData(list);

    }

 

四、项目代码结构目录图

Android自定义控件进阶-打造Android自定义的下拉列表框控件_第4张图片

代码下载:http://www.demodashi.com/demo/14682.html

注:本文著作权归作者,由demo大师发表,拒绝转载,转载需要作者授权

转载于:https://www.cnblogs.com/demodashi/p/10503299.html

你可能感兴趣的:(Android自定义控件进阶-打造Android自定义的下拉列表框控件)