flutter自定义日期选择器按日、按月、自定义开始、结束时间

在这里插入图片描述在这里插入图片描述
导入包flutter_datetime_picker: 1.5.0
封装

import 'package:atui/jade/utils/JadeColors.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_datetime_picker/flutter_datetime_picker.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';class ATuiDateTimePickerDialog {static Future<DateTime> showDatePicker(BuildContext context, {bool showTitleActions: true,bool isShowDay: true,DateTime minTime,DateTime maxTime,DateChangedCallback onChanged,DateChangedCallback onConfirm,Function onCustomDateConfirm,DateCancelledCallback onCancel,locale: LocaleType.en,DateTime currentTime,DatePickerTheme theme,}) async {return await Navigator.push(context,_DatePickerRoute(showTitleActions: showTitleActions,onChanged: onChanged,onConfirm: onConfirm,onCustomDateConfirm: onCustomDateConfirm,onCancel: onCancel,locale: locale,theme: theme,isShowDay: isShowDay,barrierLabel:MaterialLocalizations.of(context).modalBarrierDismissLabel,pickerModel: DatePickerModel(currentTime: currentTime,maxTime: maxTime,minTime: minTime,locale: locale,),),);}
}class _DatePickerRoute<T> extends PopupRoute<T> {_DatePickerRoute({this.showTitleActions,this.onChanged,this.onConfirm,this.onCustomDateConfirm,this.onCancel,theme,this.barrierLabel,this.locale,this.isShowDay,RouteSettings settings,pickerModel,})  : this.pickerModel = pickerModel ?? DatePickerModel(),this.theme = theme ?? DatePickerTheme(),super(settings: settings);final bool showTitleActions;final DateChangedCallback onChanged;final DateChangedCallback onConfirm;final Function onCustomDateConfirm;final DateCancelledCallback onCancel;final DatePickerTheme theme;final LocaleType locale;final BasePickerModel pickerModel;final bool isShowDay;Duration get transitionDuration => const Duration(milliseconds: 200);bool get barrierDismissible => true;final String barrierLabel;Color get barrierColor => Colors.black54;AnimationController _animationController;AnimationController createAnimationController() {assert(_animationController == null);_animationController =BottomSheet.createAnimationController(navigator.overlay);return _animationController;}Widget buildPage(BuildContext context, Animation<double> animation,Animation<double> secondaryAnimation) {Widget bottomSheet = MediaQuery.removePadding(context: context,removeTop: true,child: _DatePickerComponent(onChanged: onChanged,locale: this.locale,route: this,pickerModel: pickerModel,isShowDay: isShowDay,),);return InheritedTheme.captureAll(context, bottomSheet);}
}class _DatePickerComponent extends StatefulWidget {_DatePickerComponent({Key key, this.route,this.onChanged,this.locale,this.pickerModel,this.isShowDay}): super(key: key);final DateChangedCallback onChanged;final _DatePickerRoute route;final LocaleType locale;final BasePickerModel pickerModel;bool isShowDay;State<StatefulWidget> createState() {return _DatePickerState();}
}class _DatePickerState extends State<_DatePickerComponent> {FixedExtentScrollController leftScrollCtrl, middleScrollCtrl, rightScrollCtrl;List<String> _btnTitleList = ['按日','按月','自定义'];int _selectPosition = 0;bool _isCustomTime = false;String _startDate;String _endDate = '结束时间';int _customDateType = 1; //1:开始时间 2:结束时间void initState() {super.initState();refreshScrollOffset();_startDate = '${widget.pickerModel.finalTime().year}/${widget.pickerModel.finalTime().month}/${widget.pickerModel.finalTime().day}';}void refreshScrollOffset() {
//    print('refreshScrollOffset ${widget.pickerModel.currentRightIndex()}');leftScrollCtrl = FixedExtentScrollController(initialItem: widget.pickerModel.currentLeftIndex());middleScrollCtrl = FixedExtentScrollController(initialItem: widget.pickerModel.currentMiddleIndex());rightScrollCtrl = FixedExtentScrollController(initialItem: widget.pickerModel.currentRightIndex());}Widget build(BuildContext context) {DatePickerTheme theme = widget.route.theme;return GestureDetector(child: AnimatedBuilder(animation: widget.route.animation,builder: (BuildContext context, Widget child) {final double bottomPadding = MediaQuery.of(context).padding.bottom;return ClipRect(child: CustomSingleChildLayout(delegate: _BottomPickerLayout(widget.route.animation.value,theme,showTitleActions: widget.route.showTitleActions,bottomPadding: bottomPadding,),child: GestureDetector(child: Material(color: theme.backgroundColor ?? Colors.white,shape: RoundedRectangleBorder(borderRadius: BorderRadius.only(topLeft: Radius.circular(15.0),topRight: Radius.circular(10.0)), // 设置圆角半径),child: _renderPickerView(theme)),),),);},),);}void _notifyDateChanged() {if (widget.onChanged != null) {widget.onChanged(widget.pickerModel.finalTime());}String _date = '${widget.pickerModel.finalTime().year}/${widget.pickerModel.finalTime().month}/${widget.pickerModel.finalTime().day}';if(_customDateType == 1){_startDate = _date;}else if(_customDateType == 2){_endDate = _date;}}Widget _renderPickerView(DatePickerTheme theme) {Widget itemView = _renderItemView(theme);return Column(children: <Widget>[if (widget.route.showTitleActions)_renderTitleActionsView(theme),_switchBtnView(),itemView,],);}Widget _renderColumnView(ValueKey key,DatePickerTheme theme,StringAtIndexCallBack stringAtIndexCB,ScrollController scrollController,int layoutProportion,ValueChanged<int> selectedChangedWhenScrolling,ValueChanged<int> selectedChangedWhenScrollEnd,) {return Expanded(flex: layoutProportion,child: Container(padding: EdgeInsets.all(8.0),height: theme.containerHeight,decoration: BoxDecoration(color: theme.backgroundColor ?? Colors.white),child: NotificationListener(onNotification: (ScrollNotification notification) {if (notification.depth == 0 &&selectedChangedWhenScrollEnd != null &&notification is ScrollEndNotification &&notification.metrics is FixedExtentMetrics) {final FixedExtentMetrics metrics = notification.metrics;final int currentItemIndex = metrics.itemIndex;selectedChangedWhenScrollEnd(currentItemIndex);}return false;},child: CupertinoPicker.builder(key: key,backgroundColor: theme.backgroundColor ?? Colors.white,scrollController: scrollController,itemExtent: theme.itemHeight,onSelectedItemChanged: (int index) {selectedChangedWhenScrolling(index);},useMagnifier: true,itemBuilder: (BuildContext context, int index) {final content = stringAtIndexCB(index);if (content == null) {return null;}return Container(height: theme.itemHeight,alignment: Alignment.center,child: Text(content,style: theme.itemStyle,textAlign: TextAlign.start,),);},),),),);}Widget _renderItemView(DatePickerTheme theme) {return Container(color: theme.backgroundColor ?? Colors.white,child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[Container(child: widget.pickerModel.layoutProportions()[0] > 0? _renderColumnView(ValueKey(widget.pickerModel.currentLeftIndex()),theme,widget.pickerModel.leftStringAtIndex,leftScrollCtrl,widget.pickerModel.layoutProportions()[0], (index) {widget.pickerModel.setLeftIndex(index);}, (index) {setState(() {refreshScrollOffset();_notifyDateChanged();});}): null,),Text(widget.pickerModel.leftDivider(),style: theme.itemStyle,),Container(child: widget.pickerModel.layoutProportions()[1] > 0? _renderColumnView(ValueKey(widget.pickerModel.currentLeftIndex()),theme,widget.pickerModel.middleStringAtIndex,middleScrollCtrl,widget.pickerModel.layoutProportions()[1], (index) {widget.pickerModel.setMiddleIndex(index);}, (index) {setState(() {refreshScrollOffset();_notifyDateChanged();});}): null,),Text(widget.pickerModel.rightDivider(),style: theme.itemStyle,),widget.isShowDay ?? true? Container(child: widget.pickerModel.layoutProportions()[2] > 0? _renderColumnView(ValueKey(widget.pickerModel.currentMiddleIndex() * 100 +widget.pickerModel.currentLeftIndex()),theme,widget.pickerModel.rightStringAtIndex,rightScrollCtrl,widget.pickerModel.layoutProportions()[2], (index) {widget.pickerModel.setRightIndex(index);}, (index) {setState(() {refreshScrollOffset();_notifyDateChanged();});}): null,): Container(),],),);}// Title ViewWidget _renderTitleActionsView(DatePickerTheme theme) {final done = _localeDone();final cancel = _localeCancel();return Container(height: theme.titleHeight,decoration: BoxDecoration(color: theme.headerColor ?? theme.backgroundColor ?? Colors.white,borderRadius: BorderRadius.only(topLeft: Radius.circular(15.0),topRight: Radius.circular(15.0))),child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[Container(height: theme.titleHeight,child: CupertinoButton(pressedOpacity: 0.3,padding: EdgeInsets.only(left: 16, top: 0),child: Text('$cancel',style: theme.cancelStyle,),onPressed: () {Navigator.pop(context);if (widget.route.onCancel != null) {widget.route.onCancel();}},),),Container(height: theme.titleHeight,child: CupertinoButton(pressedOpacity: 0.3,padding: EdgeInsets.only(right: 16, top: 0),child: Text('$done',style: theme.doneStyle,),onPressed: () {Navigator.pop(context, widget.pickerModel.finalTime());if (widget.route.onConfirm != null) {if(!_isCustomTime){widget.route.onConfirm(widget.pickerModel.finalTime());}else{widget.route.onCustomDateConfirm(_startDate,_endDate);}}},),),],),);}String _localeDone() {return i18nObjInLocale(widget.locale)['done'];}String _localeCancel() {return i18nObjInLocale(widget.locale)['cancel'];}//切换按钮Widget _switchBtnView(){return Container(height: 120.w,padding: EdgeInsets.symmetric(horizontal: 30.w),child: Column(children: [Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [Wrap(alignment: WrapAlignment.start,direction: Axis.horizontal,spacing: 30.w,textDirection: TextDirection.ltr,children: List.generate(_btnTitleList.length, (index) {return GestureDetector(child: Container(padding: EdgeInsets.only(left: 24.w,right: 24.w,top: 10.w,bottom: 12.w),decoration: BoxDecoration(color: _selectPosition == index ? JadeColors.yellow : JadeColors.lightGrey,borderRadius: BorderRadius.all(Radius.circular(20)),),child: Text(_btnTitleList[index],style: TextStyle(fontSize: 28.sp,color: _selectPosition == index ? JadeColors.grey_2 : JadeColors.grey),),),onTap: (){setState(() {_selectPosition = index;if(_selectPosition == 0){widget.isShowDay = true;_isCustomTime = false;}else if(_selectPosition == 1){widget.isShowDay = false;_isCustomTime = false;}else if(_selectPosition == 2){widget.isShowDay = true;_isCustomTime = true;}});},);})),GestureDetector(child: Container(padding: EdgeInsets.only(left: 20.w,right: 20.w,top: 10.w,bottom: 10.w),decoration: BoxDecoration(color: Colors.white,borderRadius: BorderRadius.circular(20),border: Border.all(width: 1.w,color: JadeColors.grey_2)),child: Text('清除筛选',style: TextStyle(fontSize: 28.sp,color: JadeColors.grey_2),),),)],),_customDataSelectView()],),);}_customDataSelectView(){return _isCustomTime?Container(margin: EdgeInsets.only(top: 15.w),child: Row(mainAxisAlignment: MainAxisAlignment.center,children: [GestureDetector(child: Column(children: [IntrinsicWidth(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: [Text("$_startDate",style: TextStyle(overflow: TextOverflow.fade, color: _customDateType == 1?JadeColors.red_6 : JadeColors.grey_7, fontSize: 30.sp),),Container(margin: EdgeInsets.only(top: 1.h),height: 1,color: _customDateType == 1?JadeColors.red_6 : JadeColors.grey_7,)],),),]),onTap: () {setState(() {_customDateType = 1;});}),Container(width: 30.w, height: 1, color: JadeColors.grey_7, margin: EdgeInsets.symmetric(horizontal: 40.w)),GestureDetector(child: Column(children: [IntrinsicWidth(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: [Text("$_endDate",style: TextStyle(overflow: TextOverflow.fade, color: _customDateType == 2?JadeColors.red_6 : JadeColors.grey_7, fontSize: 30.sp),),Container(margin: EdgeInsets.only(top: 1.h),height: 1,color: _customDateType == 2?JadeColors.red_6 : JadeColors.grey_7,)],),),]),onTap: () {setState(() {_customDateType = 2;});})],),):Container();}}class _BottomPickerLayout extends SingleChildLayoutDelegate {_BottomPickerLayout(this.progress,this.theme, {this.itemCount,this.showTitleActions,this.bottomPadding = 0,});final double progress;final int itemCount;final bool showTitleActions;final DatePickerTheme theme;final double bottomPadding;BoxConstraints getConstraintsForChild(BoxConstraints constraints) {double maxHeight = theme.containerHeight;if (showTitleActions) {maxHeight += theme.titleHeight + 120.w;//增加actionTitle布局(取消、确定)时和切换按钮的布局时要在当前的布局高度上再加上去}return BoxConstraints(minWidth: constraints.maxWidth,maxWidth: constraints.maxWidth,minHeight: 0.0,maxHeight: maxHeight + bottomPadding,);}Offset getPositionForChild(Size size, Size childSize) {final height = size.height - childSize.height * progress;return Offset(0.0, height);}bool shouldRelayout(_BottomPickerLayout oldDelegate) {return progress != oldDelegate.progress;}
}

引用

_dateFilter() async {LocaleType localeType;await ATuiSharedPreferences.getStorage("localType").then((value) {if (value == "zh") {localeType = LocaleType.zh;} else if (value == "en") {localeType = LocaleType.en;}});ATuiDateTimePickerDialog.showDatePicker(context,//isShowDay: false,locale: localeType ?? LocaleType.zh,theme: DatePickerTheme(cancelStyle: TextStyle(fontSize: 30.sp,color: JadeColors.grey_2),doneStyle: TextStyle(fontSize: 30.sp,color: JadeColors.grey_2,fontWeight: FontWeight.w600)),onConfirm: (datetime) async {String newDate = '${datetime.year}-${datetime.month}-${datetime.day}';newDate += datetime.month < 10? '0${datetime.month}': datetime.month.toString();print('非自定义时点击确定按钮= $newDate');},onCustomDateConfirm: (startDatetime,endDatetime) async {print('自定义时点击确定按钮');print('startDatetime= $startDatetime');print('endDatetime= $endDatetime');},onChanged: (datetime) {print('onChanged dateTime: ${datetime}');},);}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/10830.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

景源畅信电商:经营抖店需要电脑吗?

经营抖店是否需要电脑?这个问题看似简单&#xff0c;实则关乎着商家的运营效率和成本投入。在当前数字化、网络化的商业环境中&#xff0c;电脑已经成为了不可或缺的工具。那么&#xff0c;经营抖店究竟是否需要电脑呢?答案是肯定的。 一、高效处理订单 电脑能够高效地处理大…

Mysql FLOAT和DOUBLE类型区别

存储方式&#xff1a; FLOAT和DOUBLE是浮点数类型&#xff0c;它们以二进制格式存储数值&#xff0c;可以存储近似值。这意味着某些特定的小数值可能无法精确表示&#xff0c;可能会有微小的计算误差。DECIMAL是定点数类型&#xff0c;以字符串形式存储数值&#xff0c;可以存储…

从零学算法2105

2105. 给植物浇水 II Alice 和 Bob 打算给花园里的 n 株植物浇水。植物排成一行&#xff0c;从左到右进行标记&#xff0c;编号从 0 到 n - 1 。其中&#xff0c;第 i 株植物的位置是 x i 。 每一株植物都需要浇特定量的水。Alice 和 Bob 每人有一个水罐&#xff0c;最初是满的…

如何在湖师大官网找到考研真题

今天学弟问我怎么找真题&#xff0c;我必须告诉他怎么找湖师大的真题&#xff0c;身为考研学子&#xff0c;这是必须要知道滴&#xff0c;尤其是自命题&#xff0c;是吧&#xff0c;话不多说&#xff0c;言归正传&#xff0c;我们开始吧&#xff01; 1 打开湖师大官网 什么&a…

树莓派nmap扫描

debian系统安装nmap&#xff1a; sudo apt install nmap安装nmap完成后&#xff0c;输入 ip route 来查看当前Wi-Fi路由器的ip地址。 第一行的default via后显示的便是网关地址&#xff0c;也就是路由器地址。 获取到路由器ip地址后&#xff0c;在终端中输入&#xff1a; …

一站式HMI软件开发套件eStation,让开发更简单高效

4月份举办的北京国际车展上全球首发车117辆&#xff0c;新能源车型278个&#xff0c;越来越多的车厂通过差异化和改善UI/UE体验&#xff0c;来获取更多用户的青睐。为快速响应差异化竞争需求&#xff0c;智能座舱HMI市场遇到以下挑战&#xff1a; 如何兼容不同项目开发人员编程…

C# 使用SendMessage进行进程通信,可发送字符串,结构体

发送时只能以结构体形式发送&#xff0c;类的话会提示“指定结构必须能直接复制到本机结构中&#xff0c;或是具有布局信息 ”的错误提示 以下两种结构体示例都可以被发送 public struct A{public A(int a){name "heow";array new double[3] { 1, 2, 5.6 };}strin…

批量为本地视频生成字幕文件,并可将字幕文件翻译成其它语言

VideoSubtitleGenerator 批量为本地视频生成字幕文件&#xff0c;并可将字幕文件翻译成其它语言 本项目基于 macOS, node 环境运行&#xff0c;暂未兼容 windows 环境 &#x1f310;Github地址 https://github.com/buxuku/VideoSubtitleGenerator 初衷 自己有一大批外文视频&…

力扣例题(用栈实现队列)

目录 链接. - 力扣&#xff08;LeetCode&#xff09; 描述 思路 push pop peek empty 代码 链接. - 力扣&#xff08;LeetCode&#xff09; 描述 思路 push 例如我们将10个元素放入栈中&#xff0c;假设最左边为栈顶&#xff0c;最右侧为栈底 则为10,9,8,7,6,5,4,3,…

嵌入式 - GPIO编程简介

An Introduction to GPIO Programming By Jeff Tranter Wednesday, June 12, 2019 编者按&#xff1a;本 2019 年博客系列是 ICS 最受欢迎的系列之一&#xff0c;现已更新&#xff08;2022 年 12 月&#xff09;&#xff0c;以确保内容仍然准确、相关和有用。 本博客是 Integr…

实体类和Entity Class之间有什么联系

实体类&#xff08;Entity Class&#xff09;和Entity Class在本质上是相同的&#xff0c;它们都是面向对象编程&#xff08;OOP&#xff09;中用于表示具有业务逻辑意义的实体的类。 具体来说&#xff0c;实体类通常被设计用于代表真实世界中的对象或概念&#xff0c;这些对象…

PWRWER

编译烧录完代码之后&#xff0c;按下复位键屏幕会进行刷新&#xff0c;数据不会丢失 如果按下按键&#xff0c;进行页擦除&#xff0c;之后再按下复位键&#xff0c;发现屏幕不会再进行刷新&#xff0c;原因是程序已经被擦除&#xff0c;损毁&#xff0c;无法运行&#xff0c;此…

2024OD机试卷-查找接口成功率最优时间段 (java\python\c++)

题目:查找接口成功率最优时间段 题目描述 服务之间交换的接口成功率作为 服务调用 关键质量特性,某个时间段内的接口失败率使用一个数组表示, 数组中每个元素都是单位时间内失败率数值,数组中的数值为0~100的整数, 给定一个数值(minAverageLost)表示某个时间段内平均失败…

图片转word如何转换?

要将图片转换为Word文档&#xff0c;你可以使用以下方法之一&#xff1a; 以上这些方法都可以帮助你将图片中的文本转换为可编辑的Word文档&#xff0c;你可以根据自己的喜好和需求选择其中一种方法来操作。 使用OCR软件或在线工具&#xff1a;有许多OCR&#xff08;Optical Ch…

【数据库】为何选择B+树作为索引?与红黑树、B树的对比

摘要&#xff1a; 数据库索引是数据库系统中至关重要的组成部分&#xff0c;影响着数据检索的效率和性能。本文将探讨为何数据库选择B树作为索引的原因&#xff0c;并分别分析红黑树和B树在此场景中的劣势。 介绍&#xff1a; 数据库索引是数据库系统中的重要组成部分&#xf…

实战LangChain(六):深入LangGraph的高级功能与最佳实践

实战LangChain(六):深入LangGraph的高级功能与最佳实践 实战LangChain(一):构建您的第一个聊天机器人_langchai 机器人 实战LangChain(二):探索RAG——为聊天机器人注入知识-CSDN博客 实战LangChain(三):深化交互——利用Neo4j提升聊天机器人的对话能力 实战La…

电子资源|基于SSM+vue的电子资源管理系统(源码+数据库+文档)​

电子资源管理系统 目录 基于SSMvue的电子资源管理系统 一、前言 二、系统设计 三、系统功能设计 1系统功能模块 2管理员功能模块 5.2.1管理员功能模块 5.2.2用户功能模块 四、数据库设计 五、核心代码 六、论文参考 七、最新计算机毕设选题推荐 八、源码获取&am…

【Qt 学习笔记】Qt常用控件 | 多元素控件 | Tree Widget的说明及介绍

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;Qt 专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ Qt常用控件 | 多元素控件 | Tree Widget的说明及介绍 文章编号&#x…

python代码实现TF-IDF

1、TF-IDF解释 TF-IDF&#xff08;Term frequency–inverse document frequency&#xff09;&#xff0c;中文翻译就是词频 - 逆文档频率&#xff0c;是一种用来计算关键词的传统方法。 TF&#xff08;Term Frequency&#xff09;&#xff1a;TF 的意思就是词频&#xff0c;是…

云计算的优势与未来发展

随着数字化转型的蓬勃发展&#xff0c;云计算作为信息技术应用的基础设施&#xff0c;逐渐成为企业的首选。云计算以其诸多优势和未来发展趋势&#xff0c;为企业带来了更高效、灵活和创新的IT解决方案&#xff0c;助力企业实现数字化转型和业务发展。 云计算的优势 首先&…