返回顶部
首页 > 资讯 > 移动开发 >AndroidPickerView底部选择框实现流程详解
  • 730
分享到

AndroidPickerView底部选择框实现流程详解

2024-04-02 19:04:59 730人浏览 泡泡鱼
摘要

目录一、时间选择器二、自定义选择器总结一、时间选择器 首先这次用到的xml文件如下 activity_main.xml <?xml version="1.0" encoding

一、时间选择器

首先这次用到的xml文件如下

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="vertical"
    tools:context=".MainActivity"
    android:gravity="center">
    <TextView
        android:id="@+id/tv_pickerview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        android:textColor="@color/black"
        android:textSize="30sp"/>
   <com.Google.android.material.button.MaterialButton
       android:id="@+id/btn"
       android:layout_width="120dp"
       android:layout_height="60dp"
       android:backgroundTint="@color/teal_200"
       app:cornerRadius="10dp"
       android:text="获取日期"
       android:textColor="@color/black"
       android:textSize="20sp"
       />
    <com.google.android.material.button.MaterialButton
        android:id="@+id/btn_1"
        android:layout_width="120dp"
        android:layout_height="60dp"
        android:backgroundTint="@color/teal_200"
        app:cornerRadius="10dp"
        android:text="自定义弹窗"
        android:textColor="@color/black"
        android:textSize="20sp"
        />
</LinearLayout>

xml布局文件比较简单,这里不再赘述,需要说的是底部弹窗不需要在布局文件申明,可以直接使 用Java代码来进行实现。

第一步引入相关依赖,这里使用的是GitHub比较好的一个开源项目

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

第二步书写相关Java代码,以及相关的设置

                TimePickerView pvTime = new TimePickerBuilder(MainActivity.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();
private String getTime(Date date) {
        SimpleDateFORMat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        return format.format(date);
    }

然后运行程序,就可以实现了

二、自定义选择器

相关Java代码如下

//自定义底部弹窗
        btn_1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                initData();
                OptionsPickerView pvOptions = new OptionsPickerBuilder(MainActivity.this, new OnOptionsSelectListener() {
                    @Override
                    public void onOptionsSelect(int options1, int options2, int options3, View v) {
                        String date = options1Items.get(options1) + " " + options2 + "时 " + options3 + "分";
                        //在此获取选择到的内容
                        tv_pickerview.setText(date);
                    }
                })
                        .setTitleText("选择时间")
                        .setContentTextSize(16)
                        .build();
                pvOptions.setPicker(options1Items, options2Items, options3Items);
                pvOptions.show();
            }
        });
private void initData() {
        options1Items.clear();
        //加入第一个列表数据
        options1Items.add("上午");
        options1Items.add("下午");
        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);
        }
    }

运行结果如下

完整代码如下:

package com.example.pickerviewtest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import com.bigkoo.pickerview.builder.OptionsPickerBuilder;
import com.bigkoo.pickerview.builder.TimePickerBuilder;
import com.bigkoo.pickerview.listener.OnOptionsSelectListener;
import com.bigkoo.pickerview.listener.OnTimeSelectChangeListener;
import com.bigkoo.pickerview.listener.OnTimeSelectListener;
import com.bigkoo.pickerview.view.OptionsPickerView;
import com.bigkoo.pickerview.view.TimePickerView;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
public class MainActivity extends AppCompatActivity {
    TextView tv_pickerview;
    Button btn;
    Button btn_1;
    private final List<String> options1Items = new ArrayList<>();
    private final List<List<String>> options2Items = new ArrayList<>();
    private final List<List<List<String>>> options3Items = new ArrayList<>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tv_pickerview = findViewById(R.id.tv_pickerview);
        btn = findViewById(R.id.btn);
        btn_1 = findViewById(R.id.btn_1);
        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                TimePickerView pvTime = new TimePickerBuilder(MainActivity.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();
            }
        });
        //自定义底部弹窗
        btn_1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                initData();
                OptionsPickerView pvOptions = new OptionsPickerBuilder(MainActivity.this, new OnOptionsSelectListener() {
                    @Override
                    public void onOptionsSelect(int options1, int options2, int options3, View v) {
                        String date = options1Items.get(options1) + " " + options2 + "时 " + options3 + "分";
                        //在此获取选择到的内容
                        tv_pickerview.setText(date);
                    }
                })
                        .setTitleText("选择时间")
                        .setContentTextSize(16)
                        .build();
                pvOptions.setPicker(options1Items, options2Items, options3Items);
                pvOptions.show();
            }
        });
    }
    private String getTime(Date date) {
        SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        return format.format(date);
    }
    private void initData() {
        options1Items.clear();
        //加入第一个列表数据
        options1Items.add("上午");
        options1Items.add("下午");
        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);
        }
    }
}

总结

本节介绍这两个底部弹窗的具体实现,使用第三方开源库比较容易实现,在这里不多赘述。

到此这篇关于Android PickerView底部选择框实现流程详解的文章就介绍到这了,更多相关Android PickerView内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: AndroidPickerView底部选择框实现流程详解

本文链接: https://lsjlt.com/news/168501.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • AndroidPickerView底部选择框实现流程详解
    目录一、时间选择器二、自定义选择器总结一、时间选择器 首先这次用到的xml文件如下 activity_main.xml <xml version="1.0" encoding=...
    99+
    2024-04-02
  • Android实现底部滚轮式选择弹跳框
    本文实例为大家分享了Android实现底部滚轮式选择弹跳框的具体代码,供大家参考,具体内容如下 先看效果: 调用方法: SlideDialog slideDialog = new ...
    99+
    2024-04-02
  • Android实现底部图片选择Dialog
    业务需要选择弹出对话框,然后点击选择图片。网上已经有了很多,不过感觉写的有点乱。自己这里总结一下,有需要开发者可以按照如下步骤直接使用即可。1.效果图如下点击选择照相后,弹出如下选择对话框: 2. Dialog实现布局<LinearL...
    99+
    2023-05-30
    android 图片选择 dialog
  • Andoroid实现底部图片选择Dialog效果
    1.效果图如下点击选择照相后,弹出如下选择对话框:2. Dialog实现布局<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" androi...
    99+
    2023-05-30
    android 底部图片 dialog
  • Flutter 底部弹窗如何实现多项选择
    目录多选和单选的不同之处 实现方式 界面变更 代码实现 总结 多选和单选的不同之处 单选的时候,选中一个就可以直接把结果返回,因此本身底部弹窗无需状态管理。但到多选的时候,需要知...
    99+
    2024-04-02
  • Android 实现IOS选择拍照相册底部弹出的实例
    Android 实现IOS选择拍照相册底部弹出的实例效果图1. AndroidStudio使用dependencies { compile 'com.guoqi.widget:actionsheet:1.0'}...
    99+
    2023-05-30
    android ios 拍照
  • Android 仿京东商城底部布局的选择效果(Selector 选择器的实现)
    京东商城的底部布局的选择效果看上去很复杂,其实很简单,这主要是要感谢 selector 选择器,本文将讲解仿照京东商城的底部布局的选择效果,如何实现 selector 选择器,在不同的状态下,给 view 设置不同的背景。 京东商城...
    99+
    2022-06-06
    选择器 商城 选择 布局 京东商城 Android
  • 微信小程序实现底部弹出框封装
    本文实例为大家分享了微信小程序底部弹出框封装的具体代码,供大家参考,具体内容如下 <!--index.wxml--> <view>   <butto...
    99+
    2024-04-02
  • jQuery如何实现选择或者不选页面上全部复选框
    这篇文章主要为大家展示了“jQuery如何实现选择或者不选页面上全部复选框”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“jQuery如何实现选择或者不选页面上全部复选框”这篇文章吧。选择或者不选...
    99+
    2023-06-27
  • Flutter实现底部导航栏创建详解
    目录添加依赖项如何使用功能属性主题预览图代码Flutter web问题:Failed to load network image我的解决办法参考资料ConvexBottomBar是一...
    99+
    2024-04-02
  • Flutter实现自定义下拉选择框的示例详解
    在一些列表页面中,我们经常会有上方筛选项的的需求,点击出现一个下拉菜单,多选、单选、列表选等,而在Flutter中,并没有现成的这样的组件,找第三方的扩展有时候又会受到一定限制,所以...
    99+
    2024-04-02
  • C++String部分成员模拟实现流程详解
    目录string类的成员设计普通构造函数的模拟拷贝构造函数的模拟赋值重载函数的模拟String的析构函数模拟补全上述的成员函数迭代器的简单模拟其他成员函数的模拟string类的成员设...
    99+
    2024-04-02
  • Vue封装数字框组件实现流程详解
    目录数量选择组件-基本结构数量选择组件-v-model语法糖数量选择组件-功能实现数量选择组件-基本结构 (1)准备基本结构 <script lang="ts" setup n...
    99+
    2023-05-16
    Vue封装数字框组件 Vue数字输入框
  • JetPackCompose底部导航栏的实现方法详解
    目录1.声明导航栏数据源2.使用Scaffold搭建页面结构3.BottomNavigation的用法1.声明导航栏数据源 主要声明导航栏label和图标数组,这里使用的是本地数据,...
    99+
    2024-04-02
  • 超详细教程实现Vue底部导航栏TabBar
    目录项目介绍:项目目录:TabBar效果预览:TabBar实现思路一、如果在下方有一个单独的TabBar组件,如何封装二、TabBar中现实的内容由外界决定。三、自定义TabBarI...
    99+
    2024-04-02
  • JavaScript实现Promise流程详解
    目录构造函数then 和 catch方法解决异步问题all和race方法构造函数 首先我们来看一下我们是如何使用promise的,我们在实例化对象是这么使用的: let p1...
    99+
    2024-04-02
  • Python实现JavaBeans流程详解
    目录场景JavaBeans in Python在JavaBeans中有这样的一个描述:当一些信息需要使用类似于字典嵌套字典再嵌套列表这种很深的结构来储存的时候,请改用类来储存。实际上...
    99+
    2023-01-14
    Python JavaBeans Python实现JavaBeans
  • Flutter多项选择弹窗实现详解
    目录多选和单选的不同之处实现方式界面变更代码实现总结在Flutter 底部弹窗详解一篇中介绍了底部弹窗的实现。发出后有在琢磨如何实现多选,这也是很常用的一个功能。本篇介绍实现多选的思...
    99+
    2024-04-02
  • js 实现picker 选择器示例详解
    目录前言实现CSSHTMLjs结语 前言 想必各位做移动端开发的小伙伴对picker选择器应该不陌生吧。你做微信小程序开发有自带的picker组件,做公众号开发可以使用weui提供的...
    99+
    2022-11-13
    js实现picker选择器 js picker
  • 详解Python中的选择排序实现
    Python中的选择排序算法详解 选择排序是一种简单但效率较低的排序算法,它的基本思想是每次从待排序的序列中找出最小(或最大)的元素,放到已排序序列的末尾。通过重复这个过程,直到所有元素都排序完毕。 选择排序的步骤如下: 遍历...
    99+
    2024-02-03
    算法 python 选择排序 排列
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作