【Android -- 开源库】Android-PickerView 的基本使用

一、简介

Android-PickerView 是一款仿 iOS 的 PickerView 控件，带有 3D 圆弧效果，并封装了时间选择和选项选择这两种选择器。

目前最新版本是 4.1.9。
GitHub：https://github.com/Bigkoo/Android-PickerView

功能

• 支持三级联动
• 设置是否联动
• 设置循环模式
• 支持自定义布局。
• 支持 item 的分隔线设置。
• 支持 item 间距设置。
• 时间选择器支持起始和终止日期设定。
• 支持“年，月，日，时，分，秒”，“省，市，区”等选项的单位（label）显示、隐藏和自定义。
• 支持自定义文字、颜色、文字大小等属性
• Item 的文字长度过长时，文字会自适应缩放到Item的长度，避免显示不完全的问题
• 支持 Dialog 模式。
• 支持自定义设置容器。
• 实时回调。

二、引入框架

1. 在 app/build.gradle 中添加依赖

implementation 'com.contrarywind:Android-PickerView:4.1.9'

三、使用

TimePickerView 的基本使用

1. 效果图

2. 代码

TimePickerView pvTime = new TimePickerBuilder(this, new OnTimeSelectListener() {
    @Override
    public void onTimeSelect(Date date, View v) {
        tv_pickerview.setText(getTime(date));
    }
})
        .setTimeSelectChangeListener(new OnTimeSelectChangeListener() {
            @Override
            public void onTimeSelectChanged(Date date) {
            
            }
        })
        .setType(new boolean[]{true, true, true, true, true, true})
        .setItemVisibleCount(6)
        .setLineSpacingMultiplier(2.0f)
        .isAlphaGradient(true)
        .build();
pvTime.show()

----------------------------------------分隔线-----------------------------------------
// getTime()方法
private String getTime(Date date) {
    SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
    return format.format(date);

OptionsPickerView 的基本使用

首先：创建数据项，每个数据项为一个列表，每多定义一个项就要多嵌套一层

private final List<String> options1Items = new ArrayList<>();
private final List<List<String>> options2Items = new ArrayList<>();
private final List<List<List<String>>> options3Items = new ArrayList<>();

添加数据（重点）

private void initData() {
        //加入第一个列表数据
        options1Items.add(getResources().getString(R.string.morning));
        options1Items.add(getResources().getString(R.string.afternoon));

        List<String> a = new ArrayList<>();
        List<String> b = new ArrayList<>();
        List<List<String>> c = new ArrayList<>();
        
        //创建最后一个列表数据（分）
        for (int i = 0; i < 60; i++) {
            if (i < 10) {
                a.add("0" + i + "分");
            } else {
                a.add(i + "分");
            }
        }
        
        //创建第二个列表数据（时）,同时将最后一个列表数据加入c,加入次数为第二个列表的大小
        for (int i = 0; i <= 12; i++) {
            if (i < 10) {
                b.add("0" + i + "时");
            } else {
                b.add(i + "时");
            }
            c.add(a);
        }
        
        //将第二个列表数据加入options2Itmes,加入次数为options1Items的大小
        for (int j = 0; j < options1Items.size(); j++) {
            options2Items.add(b);    
        }
        
        //将第三个列表数据加入options3Items,加入次数为第二个列表数据的长度
        for (int i = 0; i < b.size(); i++) {
            options3Items.add(c);
        }
    }

通过 show() 方法来控制显示

OptionsPickerView pvOptions = new OptionsPickerBuilder(this, new OnOptionsSelectListener() {
            @Override
            public void onOptionsSelect(int options1, int options2, int options3, View v) {
                String date = options1Items.get(options1) + " " + options2 + "时 " + options3 + "分";
                //在此获取选择到的内容
            }
        })
                .setTitleText("选择时间")
                .setContentTextSize(16)
                .build();

        pvOptions.setPicker(options1Items, options2Items, options3Items);
        pvOptions.show();

省、市、区三级联动

1. 下载 province.json .放到如下 assets 。

2. 效果图

3. 代码
布局文件

<?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="vertical"
    tools:context=".ui.InstalledActivity">

    <com.hjq.bar.TitleBar
        android:id="@+id/title_bar"
        android:layout_width="match_parent"
        android:background="@color/purple_500"
        android:layout_height="?android:attr/actionBarSize"
        app:title="@string/main_installed"
        app:titleStyle="bold"
        app:titleSize="18sp"
        app:titleColor="@color/white"
        app:leftIcon="@mipmap/ic_back"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbars="none">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="@color/white"
            android:layout_marginTop="2dp"
            android:padding="8dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:textSize="16sp"
                android:layout_marginLeft="8dp"
                android:textColor="@color/text_color"
                android:text="客户名称:"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/text_E3"
                android:layout_toLeftOf="@id/iv_arrow_sex"
                android:layout_centerVertical="true"
                android:layout_marginRight="8dp"
                android:text="云蝶"/>

            <ImageView
                android:id="@+id/iv_arrow_sex"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_arrow_right"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"/>
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="@color/white"
            android:layout_marginTop="2dp"
            android:padding="8dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:textSize="16sp"
                android:layout_marginLeft="8dp"
                android:textColor="@color/text_color"
                android:text="业务员:"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/text_E3"
                android:layout_toLeftOf="@id/iv_arrow"
                android:layout_centerVertical="true"
                android:layout_marginRight="8dp"
                android:text="丁朗"/>

            <ImageView
                android:id="@+id/iv_arrow"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_arrow_right"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"/>
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_new_contact"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_marginTop="2dp"
            android:background="@color/white"
            android:padding="10dp">
            <TextView
                android:id="@+id/tv_text4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:textSize="16sp"
                android:layout_marginLeft="6dp"
                android:textColor="@color/text_color"
                android:text="联 系 人:"/>

            <EditText
                android:id="@+id/edt_new_contact"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/tv_text4"
                android:layout_marginLeft="8dp"
                android:textSize="14sp"
                android:background="@null"
                android:hint="请输入联系人"/>

        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_new_method"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_marginTop="2dp"
            android:background="@color/white"
            android:padding="10dp">
            <TextView
                android:id="@+id/tv_text5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_marginLeft="6dp"
                android:textSize="16sp"
                android:textColor="@color/text_color"
                android:text="联系方式:"/>

            <EditText
                android:id="@+id/edt_new_method"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/tv_text5"
                android:layout_marginLeft="8dp"
                android:textSize="14sp"
                android:background="@null"
                android:hint="请输入联系方式"/>

        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_new_address"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_marginTop="2dp"
            android:background="@color/white"
            android:padding="10dp">
            <TextView
                android:id="@+id/tv_text8"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_marginLeft="6dp"
                android:textSize="16sp"
                android:textColor="@color/text_color"
                android:text="地    址:"/>

            <TextView
                android:id="@+id/tv_new_address"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/tv_text8"
                android:layout_marginLeft="8dp"
                android:background="@null"
                android:hint="广东省-深圳市-龙岗区"/>

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_arrow_right"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"/>

        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_detail_address"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_marginTop="2dp"
            android:background="@color/white"
            android:padding="10dp">
            <TextView
                android:id="@+id/tv_text9"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:textSize="16sp"
                android:layout_marginLeft="6dp"
                android:textColor="@color/text_color"
                android:text="详细地址:"/>

            <EditText
                android:id="@+id/tv_detail_address"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/tv_text9"
                android:layout_marginLeft="8dp"
                android:textSize="14sp"
                android:background="@null"
                android:hint="龙岗智慧家园"/>

        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_product"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="@color/white"
            android:layout_marginTop="2dp"
            android:padding="8dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:textSize="16sp"
                android:layout_marginLeft="8dp"
                android:textColor="@color/text_color"
                android:text="品名规格:"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/text_E3"
                android:layout_toLeftOf="@id/iv_arrow2"
                android:layout_centerVertical="true"
                android:layout_marginRight="8dp"
                android:text="选择"/>

            <ImageView
                android:id="@+id/iv_arrow2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_arrow_right"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"/>
        </RelativeLayout>

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <Button
            android:id="@+id/btn_submit"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/ic_button_bg"
            android:layout_marginTop="120dp"
            android:layout_marginLeft="34dp"
            android:layout_marginRight="34dp"
            android:textSize="16sp"
            android:textColor="@color/white"
            android:text="提交"
            />
    </LinearLayout>

    </ScrollView>

</LinearLayout>

InstallActivity.java

public class InstalledActivity extends BaseActivity {
    @BindView(R.id.title_bar)
    TitleBar mTitleBar;

    private List<JsonBean> options1Items = new ArrayList<>();
    private ArrayList<ArrayList<String>> options2Items = new ArrayList<>();
    private ArrayList<ArrayList<ArrayList<String>>> options3Items = new ArrayList<>();
    private Thread thread;
    private static final int MSG_LOAD_DATA = 0x0001;
    private static final int MSG_LOAD_SUCCESS = 0x0002;
    private static final int MSG_LOAD_FAILED = 0x0003;

    @BindView(R.id.tv_new_address)
    TextView mAddress;

    private static boolean isLoaded = false;
    @SuppressLint("HandlerLeak")
    private Handler mHandler = new Handler() {
        public void handleMessage(Message msg) {
            switch (msg.what) {
                case MSG_LOAD_DATA:
                    if (thread == null) {//如果已创建就不再重新创建子线程了
                        thread = new Thread(new Runnable() {
                            @Override
                            public void run() {
                                // 子线程中解析省市区数据
                                initJsonData();
                            }
                        });
                        thread.start();
                    }
                    break;

                case MSG_LOAD_SUCCESS:
                    isLoaded = true;
                    break;

                case MSG_LOAD_FAILED:
                    ToastUtils.showToast(InstalledActivity.this,"解析失败!");
                    break;
            }
        }
    };

    @Override
    protected int getLayoutId() {
        return R.layout.activity_installed;
    }


    @Override
    protected void initView() {
        mHandler.sendEmptyMessage(MSG_LOAD_DATA);
        mTitleBar.setOnTitleBarListener(new OnTitleBarListener() {
            @Override
            public void onLeftClick(View view) {
                finish();
            }

            @Override
            public void onTitleClick(View view) {

            }

            @Override
            public void onRightClick(View view) {

            }
        });
    }

    @OnClick({R.id.rl_product,R.id.rl_new_address})
    public void onClicked(View view) {
        switch (view.getId()) {
            case R.id.rl_product :
                readyGo(ProductActivity.class);
                break;

            case R.id.rl_new_address :
                showPickerView();
                break;
        }
    }

    private void showPickerView() {

        OptionsPickerView pvOptions = new OptionsPickerBuilder(this, new OnOptionsSelectListener() {
            @Override
            public void onOptionsSelect(int options1, int options2, int options3, View v) {
                //返回的分别是三个级别的选中位置
                String opt1tx = options1Items.size() > 0 ?
                        options1Items.get(options1).getPickerViewText() : "";

                String opt2tx = options2Items.size() > 0
                        && options2Items.get(options1).size() > 0 ?
                        options2Items.get(options1).get(options2) : "";

                String opt3tx = options2Items.size() > 0
                        && options3Items.get(options1).size() > 0
                        && options3Items.get(options1).get(options2).size() > 0 ?
                        options3Items.get(options1).get(options2).get(options3) : "";

                String tx = opt1tx + "-" + opt2tx + "-" + opt3tx;
                mAddress.setText(tx);
            }
        })

                .setTitleText("城市选择")
                .setDividerColor(Color.BLACK)
                .setTextColorCenter(Color.BLACK) //设置选中项文字颜色
                .setContentTextSize(20)
                .build();

        pvOptions.setPicker(options1Items, options2Items, options3Items);//三级选择器
        pvOptions.show();
    }

    private void initJsonData() {//解析数据

        /**
         * 注意：assets 目录下的Json文件仅供参考，实际使用可自行替换文件
         * 关键逻辑在于循环体
         *
         * */
        String JsonData = new GetJsonDataUtil().getJson(this, "province.json");//获取assets目录下的json文件数据

        ArrayList<JsonBean> jsonBean = parseData(JsonData);//用Gson 转成实体

        /**
         * 添加省份数据
         *
         * 注意：如果是添加的JavaBean实体，则实体类需要实现 IPickerViewData 接口，
         * PickerView会通过getPickerViewText方法获取字符串显示出来。
         */
        options1Items = jsonBean;

        for (int i = 0; i < jsonBean.size(); i++) {//遍历省份
            ArrayList<String> cityList = new ArrayList<>();//该省的城市列表（第二级）
            ArrayList<ArrayList<String>> province_AreaList = new ArrayList<>();//该省的所有地区列表（第三极）

            for (int c = 0; c < jsonBean.get(i).getCityList().size(); c++) {//遍历该省份的所有城市
                String cityName = jsonBean.get(i).getCityList().get(c).getName();
                cityList.add(cityName);//添加城市
                ArrayList<String> city_AreaList = new ArrayList<>();//该城市的所有地区列表
                city_AreaList.addAll(jsonBean.get(i).getCityList().get(c).getArea());
                province_AreaList.add(city_AreaList);//添加该省所有地区数据
            }

            /**
             * 添加城市数据
             */
            options2Items.add(cityList);

            /**
             * 添加地区数据
             */
            options3Items.add(province_AreaList);
        }

        mHandler.sendEmptyMessage(MSG_LOAD_SUCCESS);

    }


    public ArrayList<JsonBean> parseData(String result) {
        ArrayList<JsonBean> detail = new ArrayList<>();
        try {
            JSONArray data = new JSONArray(result);
            Gson gson = new Gson();
            for (int i = 0; i < data.length(); i++) {
                JsonBean entity = gson.fromJson(data.optJSONObject(i).toString(), JsonBean.class);
                detail.add(entity);
            }
        } catch (Exception e) {
            e.printStackTrace();
            mHandler.sendEmptyMessage(MSG_LOAD_FAILED);
        }
        return detail;
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        if (mHandler != null) {
            mHandler.removeCallbacksAndMessages(null);
        }
    }
}