Flutter - flutter_picker选择器封装 (底部弹出,包含日期,单列、多列文本)

demo 地址: https://github.com/iotjin/jh_flutter_demo

以下代码不是最新代码,最新版支持对象数组数据格式和自定义UI,请前往github下载

使用版本

  flutter_picker: ^1.1.0
  date_format: ^1.0.8 #时间处理

包地址

flutter_picker packages地址

date_format packages地址 (判断上下午使用了)

###效果图

单列选择器多列选择器

年月日年月年月日时分年月日时分带上下午

使用方法

导入 jhPickerTool.dart

单列选择器

       var aa =  ["11","22","33","44"];
//       var aa =  [11,22,33,44];

       JhPickerTool.showStringPicker(context,
           data: aa,
//           normalIndex: 2,
//           title: "请选择2",
           clickCallBack: (int index,var str){
            print(index);
            print(str);
           }
       );

多列选择器

       var bb =  [["11","22"],["33","44"],["55","66"]];
//       var bb =  [[1,2],[3,4],["5","6"]];


        JhPickerTool.showArrayPicker(context,
            data: bb,
//            title: "请选择2",
//        normalIndex: [0,1,0],
            clickCallBack:(var index, var strData){
            print(index);
            print(strData);
            }
        );

日期选择器

        JhPickerTool.showDatePicker(
            context,
//            dateType: DateType.YMD,
//            dateType: DateType.YM,
//            dateType: DateType.YMD_HM,
//            dateType: DateType.YMD_AP_HM,
//             title: "请选择2",
//            minValue: DateTime(2020,10,10),
//            maxValue: DateTime(2023,10,10),
//            value: DateTime(2020,10,10),
            clickCallback: (var str,var time){
            print(str);
            print(time);
            }
        );

jhPickerTool.dart 代码

import 'package:flutter/material.dart';
import 'package:flutter_picker/flutter_picker.dart';
import 'package:date_format/date_format.dart';

const double kPickerHeight = 216.0;
const double kItemHeight = 40.0;
const Color kBtnColor = Color(0xFF323232);//50
const Color kTitleColor = Color(0xFF787878);//120
const double kTextFontSize = 17.0;

typedef StringClickCallback = void Function(int selectIndex,Object selectStr);
typedef ArrayClickCallback = void Function( List<int> selecteds,List<dynamic> strData);
typedef DateClickCallback = void Function(dynamic selectDateStr,dynamic selectDate);

  enum DateType {
     YMD,        // y, m, d
      YM,        // y ,m
     YMD_HM,     // y, m, d, hh, mm
     YMD_AP_HM,  // y, m, d, ap, hh, mm
  }

class JhPickerTool {

      /** 单列*/
    static void showStringPicker<T>(
        BuildContext context, {
          @required List<T> data,
          String title,
          int normalIndex,
          PickerDataAdapter adapter,
          @required StringClickCallback clickCallBack,
        }) {

        openModalPicker(context,
            adapter: adapter ??  PickerDataAdapter( pickerdata: data, isArray: false),
            clickCallBack:(Picker picker, List<int> selecteds){
              //          print(picker.adapter.text);
            clickCallBack(selecteds[0],data[selecteds[0]]);
           },
        selecteds: [normalIndex??0] ,
            title: title);
        }

        /** 多列 */
      static void showArrayPicker<T>(
          BuildContext context, {
            @required List<T> data,
            String title,
            List<int> normalIndex,
            PickerDataAdapter adapter,
            @required ArrayClickCallback clickCallBack,
          }) {
        openModalPicker(context,
            adapter: adapter ??  PickerDataAdapter( pickerdata: data, isArray: true),
            clickCallBack:(Picker picker, List<int> selecteds){
            clickCallBack(selecteds,picker.getSelectedValues());
            },
            selecteds: normalIndex,
            title: title);

      }


        static void openModalPicker(
            BuildContext context, {
              @required PickerAdapter adapter,
              String title,
              List<int> selecteds,
              @required PickerConfirmCallback clickCallBack,
            }) {
          new Picker(
            adapter: adapter,
            title: new Text(title ?? "请选择",style:TextStyle(color: kTitleColor,fontSize: kTextFontSize)),
            selecteds: selecteds,
            cancelText: '取消',
            confirmText: '确定',
            cancelTextStyle: TextStyle(color: kBtnColor,fontSize: kTextFontSize),
            confirmTextStyle: TextStyle(color: kBtnColor,fontSize: kTextFontSize),
            textAlign: TextAlign.right,
            itemExtent: kItemHeight,
            height: kPickerHeight,
            selectedTextStyle: TextStyle(color: Colors.black),
            onConfirm:clickCallBack
          ).showModal(context);
        }


     /** 日期选择器*/
      static void showDatePicker(
          BuildContext context, {
          DateType dateType,
          String title,
          DateTime maxValue,
          DateTime minValue,
          DateTime value,
          DateTimePickerAdapter adapter,
          @required DateClickCallback clickCallback,
          }) {

        int timeType;
        if(dateType == DateType.YM){
          timeType =  PickerDateTimeType.kYM;
        }else if(dateType == DateType.YMD_HM){
          timeType =  PickerDateTimeType.kYMDHM;
        }else if(dateType == DateType.YMD_AP_HM){
          timeType =  PickerDateTimeType.kYMD_AP_HM;
        }else{
          timeType =  PickerDateTimeType.kYMD;
        }

        openModalPicker(context,
        adapter: adapter ??
        DateTimePickerAdapter(
        type: timeType,
        isNumberMonth: true,
        yearSuffix: "年",
        monthSuffix: "月",
        daySuffix: "日",
        strAMPM: const["上午", "下午"],
        maxValue: maxValue ,
        minValue: minValue,
        value: value ?? DateTime.now(),
        ),
        title: title,
        clickCallBack:(Picker picker, List<int> selecteds){

          var time = (picker.adapter as DateTimePickerAdapter).value;
          var timeStr;
          if(dateType == DateType.YM){
            timeStr =time.year.toString()+"年"+time.month.toString()+"月";
          }else if(dateType == DateType.YMD_HM){
            timeStr =time.year.toString()+"年"+time.month.toString()+"月"+time.day.toString()+"日"+time.hour.toString()+"时"+time.minute.toString()+"分";
          }else if(dateType == DateType.YMD_AP_HM){
          var str = formatDate(time, [am])=="AM" ? "上午":"下午";
          timeStr =time.year.toString()+"年"+time.month.toString()+"月"+time.day.toString()+"日"+str+time.hour.toString()+"时"+time.minute.toString()+"分";
          }else{
            timeStr =time.year.toString()+"年"+time.month.toString()+"月"+time.day.toString()+"日";
          }
//          print(formatDate(DateTime(1989, 02, 21), [yyyy, '-', mm, '-', dd]));
             clickCallback(timeStr,picker.adapter.text);

          }

          );

        }



}