Android 自定义控件+下拉选择框实现

自定义控件+下拉选择框实现

当系统自带的控件不能满足我们的需求，而我们又会经常使用到，这个时候我们就可以自定义控件。下拉框是我们在做项目中经常会需要用到的。

上图就是一个自定义的控件
点击显示下拉框进行选择：

pop_view.xml:
(自定义控件界面)

<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/pop_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16sp"
            android:layout_marginLeft="15dp"
            android:paddingTop="26dp"
            android:paddingBottom="10dp"
            android:textColor="#000000" />
        <RelativeLayout
            android:id="@+id/pop_rl"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <TextView
                android:id="@+id/pop_choose"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:hint="请选择"
                android:textColor="#FF888888"
                android:paddingTop="26dp"
                android:paddingBottom="10dp"
                android:paddingRight="25dp"
                android:layout_toLeftOf="@+id/pop_img"
                android:textSize="16sp" />

            <ImageView
                android:id="@+id/pop_img"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:tint="#FFC7C7CC"
                android:src="@drawable/choose"
                android:layout_marginRight="15dp"
                android:layout_alignParentRight="true"
                android:paddingTop="26dp"
                android:paddingBottom="10dp"
                android:layout_centerVertical="true" />
        </RelativeLayout>
    </LinearLayout>

activity_main.xml:
(在布局中应用改控件）

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    tools:context=".MainActivity">

   <com.example.text.PopLayout
       android:id="@+id/pop_layout"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"/>

</LinearLayout>

PopLayout.java

package com.example.text;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class PopLayout extends LinearLayout {
    //自定义控件
    private TextView popText;
    private TextView popChoose;
    private ImageView popImg;
    private RelativeLayout popRl;

	//重写LinearLayout带有两个参数的构造函数
    public PopLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.pop_view, this);
        popText = findViewById(R.id.pop_text);
        popChoose = findViewById(R.id.pop_choose);
        popImg = findViewById(R.id.pop_img);
        popRl = findViewById(R.id.pop_rl);
    }


    public TextView getPopText() {
        return popText;
    }

    public TextView getPopChoose() {
        return popChoose;
    }

    public ImageView getPopImg() {
        return popImg;
    }

    public RelativeLayout getPopRl() {
        return popRl;
    }

}

choose_window.xml
(自定义下拉框布局）

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

    <ListView
        android:id="@+id/spinner_lv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="#00000000"
        android:dividerHeight="1px"
        android:divider="#DDDDDD"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:scrollbars="none"/>

</LinearLayout>

choose_item.xml
(自定义下拉框布局中listview的子布局)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:minHeight="40dp">


    <TextView
        android:id="@+id/cup_text"
        android:paddingLeft="15dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:textSize="15sp" />

</LinearLayout>

ChooseAdapter.java

package com.example.text;

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

import java.util.List;

public class ChooseAdapter extends BaseAdapter {

    //popwindow中listview的适配器
    private List<String> mList;
    private LayoutInflater mInflater;

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

    @Override
    public Object getItem(int position) {
        return mList.get(position);
    }

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

    @Override
    public View getView(int position, View view, ViewGroup parent) {
        ViewHolder viewHolder;

        if (view == null) {
            view = mInflater.inflate(R.layout.choose_item, null);
            viewHolder = new ViewHolder();
            viewHolder.text = view.findViewById(R.id.cup_text);
            view.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) view.getTag();
        }

        viewHolder.text.setText(mList.get(position));

        return view;
    }

    public static class ViewHolder {
        public TextView text;
    }

    public ChooseAdapter(Context context,List<String> mList){
        this.mList = mList;
        mInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);//  取得xml里定义的view
    }


    public void refreshData(List<String> objects, int index) {
        mList = objects;
        if (index < 0) {
            index = 0;
        }
        if (index >= mList.size()) {
            index = mList.size() - 1;
        }
    }

    //listview点击事件
    public static interface IOnItemSelectListener {
        public void onItemClick(int pos);
    }

}

ChoosePopwindow.java

package com.example.text;

import android.content.Context;
import android.graphics.drawable.ColorDrawable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.PopupWindow;

import java.util.List;

public class ChoosePopwindow extends PopupWindow implements AdapterView.OnItemClickListener {

    private Context mContext;
    private ListView mListView;
    private ChooseAdapter mAdapter;
    private ChooseAdapter.IOnItemSelectListener mItemSelectListener;

    public ChoosePopwindow(Context context) {
        super(context);
        mContext = context;
        init();
    }

    private void init() {
        View view = LayoutInflater.from(mContext).inflate(R.layout.choose_window, null);
        setContentView(view);
        setWidth(ViewGroup.LayoutParams.WRAP_CONTENT);
        setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);

        setFocusable(true);
        ColorDrawable dw = new ColorDrawable(0x00);
        setBackgroundDrawable(dw);


        mListView = (ListView) view.findViewById(R.id.spinner_lv);
        mListView.setOnItemClickListener(this);
    }

    public void refreshData(List<String> list, int selIndex) {
        if (list != null && selIndex != -1) {
            if (mAdapter != null) {
                mAdapter.refreshData(list, selIndex);
            }
        }
    }
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        dismiss();
        if (mItemSelectListener != null) {
            mItemSelectListener.onItemClick(position);
        }
    }

    public void setItemListener(ChooseAdapter.IOnItemSelectListener listener) {
        mItemSelectListener = listener;
    }

    public void setAdapter(ChooseAdapter adapter) {
        mAdapter = adapter;
        mListView.setAdapter(mAdapter);
    }
}

PopTool.java
(自定义控件的功能，即下拉框的实现)

package com.example.text;

import android.content.Context;
import android.content.res.Resources;
import android.util.DisplayMetrics;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class PopTool implements ChooseAdapter.IOnItemSelectListener{

    private TextView text1;
    private TextView text2;//显示在这个TextView下面
    private RelativeLayout relativeLayout;//点击此layout显示popwindow
    private ImageView image;

    private ChoosePopwindow choosePopwindow;
    private ChooseAdapter mAdapter;

    private List<String> mListType = new ArrayList<String>();

    public PopTool(RelativeLayout relativeLayout, TextView text1, TextView text2, ImageView image, List<String> mListType, final Context context){
        this.relativeLayout =relativeLayout;
        this.image = image;
        this.mListType = mListType;
        this.text1 = text1;
        this.text2 = text2;
        init(context);
        relativeLayout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showSpinWindow(context);
            }
        });
    }

    public void init(final Context context){
        mAdapter = new ChooseAdapter(context, mListType);
        mAdapter.refreshData(mListType, 0);
        choosePopwindow = new ChoosePopwindow(context);
        choosePopwindow.setAdapter(mAdapter);
        choosePopwindow.setItemListener(this);

    }

    //设置PopWindow
    public void showSpinWindow(Context context) {

        Resources resources = context.getResources();
        DisplayMetrics dm = resources.getDisplayMetrics();
        float density1 = dm.density;
        int width = dm.widthPixels;
        //设置popwindow大小
        choosePopwindow.setWidth(width / 2);
        //设置显示的位置在哪个控件的下方
        choosePopwindow.showAsDropDown(text2);

    }

    @Override
    public void onItemClick(int pos) {
        //将选中的内容显示在指定控件中
        String value = mListType.get(pos);
        text2.setText(value);
    }
}

MainActivity.java

package com.example.text;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private PopLayout mPopLayout;
    private PopTool mPopTool;
    private TextView text1;
    private TextView text2;
    private ImageView image;
    private RelativeLayout relativeLayout;
    private List<String> mList = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initList();
        init();
        text1.setText("单元：");

    }

    private void initList() {
        mList.add("一单元");
        mList.add("二单元");
        mList.add("三单元");
        mList.add("四单元");
    }

    private void init(){
        mPopLayout = findViewById(R.id.pop_layout);
        text1 = mPopLayout.getPopText();
        text2 = mPopLayout.getPopChoose();
        image = mPopLayout.getPopImg();
        relativeLayout = mPopLayout.getPopRl();
        mPopTool = new PopTool(relativeLayout,text1,text2,image,mList,this);
    }
    
}