flutter封装日历选择器(单日选择)

2024-06-06 18:04

本文主要是介绍flutter封装日历选择器(单日选择),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在这里插入图片描述

简单封装:
引入库:table_calendar

import 'package:generated/l10n.dart';
import 'package:jade/utils/JadeColors.dart';
import 'package:jade/utils/Utils.dart';
import 'package:util/easy_loading_util.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:table_calendar/table_calendar.dart';class CustomCalendarSelector extends StatefulWidget{final DateTime dateTime;const CustomCalendarSelector({this.dateTime});State<StatefulWidget> createState() {// TODO: implement createStatereturn _CustomCalendarSelectorState();}
}
class _CustomCalendarSelectorState extends State<CustomCalendarSelector>{CalendarController _calendarController;DateTime _selectDateTime;void initState() {super.initState();_calendarController = CalendarController();_selectDateTime = widget.dateTime;}void dispose() {_calendarController.dispose();super.dispose();}Widget build(BuildContext context) {// TODO: implement build//return Container(height: Utils().screenWidth(context)*1.4,child: Column(children: [Expanded(child: TableCalendar(calendarController: _calendarController,startDay: DateTime.now(),endDay: DateTime(DateTime.now().year+ 1,12,31),calendarStyle: const CalendarStyle(weekendStyle: TextStyle(color: Color(0xffff415b)),todayColor: Colors.black12,selectedColor: Color(0xff44aab0),),headerStyle: HeaderStyle(centerHeaderTitle: true,leftChevronVisible: true,rightChevronVisible: true,formatButtonVisible: false,),initialSelectedDay:widget.dateTime??DateTime(DateTime.now().year,DateTime.now().month,DateTime.now().day+1),onUnavailableDaySelected: (){esLoadingToast('请选择可选日期之内的时间');},onDaySelected: (DateTime dateTime, List events, List holidays){if(dateTime.day == DateTime.now().day){esLoadingToast('请选择当期日期之后的时间');return;}_selectDateTime = dateTime;},onHeaderTapped:(DateTime dateTime){}),),Container(margin: EdgeInsets.only(top: 20.h, left: 80.w),child: Row(children: <Widget>[Image.asset('images/cinema/buy/cinema_buy_icon_q.png',width: 35.w,height: 35.h,),SizedBox(width: 10.w,),Text('从当日起的5个工作日内无法上刊',style: TextStyle(fontSize: 24.sp, color: JadeColors.green_3),)],),),Container(margin: EdgeInsets.only(top: 20.h, left: 80.w, right: 80.w,bottom: 40.w),width: double.infinity,height: 85.h,child: TextButton(style: ButtonStyle(minimumSize: MaterialStateProperty.all(Size(300, 38)),backgroundColor: MaterialStateProperty.all(JadeColors.green_3.withOpacity(1.0))),onPressed: () async {if (DateTime.now().isAfter(_selectDateTime)) {esLoadingToast('请选择当期日期之后的时间');return;}Navigator.pop(context, _selectDateTime);},child: Text(S.current.baocun,style: TextStyle(fontSize: 32.sp, color: Colors.white),)))],),);}
}

引用:

_showScheduledDateBottom() {showModalBottomSheet(context: context,isScrollControlled: true,shape: RoundedRectangleBorder(borderRadius: BorderRadius.only(topLeft: Radius.circular(25.w),topRight: Radius.circular(25.w))),builder: (BuildContext context) {return CustomCalendarSelector(dateTime: time);}).then((value) {if (value == null) return;print('${time.year}-${time.month}-${time.day}');});}

这篇关于flutter封装日历选择器(单日选择)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1036837

相关文章

Golang如何对cron进行二次封装实现指定时间执行定时任务

《Golang如何对cron进行二次封装实现指定时间执行定时任务》:本文主要介绍Golang如何对cron进行二次封装实现指定时间执行定时任务问题,具有很好的参考价值,希望对大家有所帮助,如有错误... 目录背景cron库下载代码示例【1】结构体定义【2】定时任务开启【3】使用示例【4】控制台输出总结背景

Python中对FFmpeg封装开发库FFmpy详解

《Python中对FFmpeg封装开发库FFmpy详解》:本文主要介绍Python中对FFmpeg封装开发库FFmpy,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录一、FFmpy简介与安装1.1 FFmpy概述1.2 安装方法二、FFmpy核心类与方法2.1 FF

一文详解如何在Vue3中封装API请求

《一文详解如何在Vue3中封装API请求》在现代前端开发中,API请求是不可避免的一部分,尤其是与后端交互时,下面我们来看看如何在Vue3项目中封装API请求,让你在实现功能时更加高效吧... 目录为什么要封装API请求1. vue 3项目结构2. 安装axIOS3. 创建API封装模块4. 封装API请求

exfat和ntfs哪个好? U盘格式化选择NTFS与exFAT的详细区别对比

《exfat和ntfs哪个好?U盘格式化选择NTFS与exFAT的详细区别对比》exFAT和NTFS是两种常见的文件系统,它们各自具有独特的优势和适用场景,以下是关于exFAT和NTFS的详细对比... 无论你是刚入手了内置 SSD 还是便携式移动硬盘或 U 盘,都需要先将它格式化成电脑或设备能够识别的「文

Flutter实现文字镂空效果的详细步骤

《Flutter实现文字镂空效果的详细步骤》:本文主要介绍如何使用Flutter实现文字镂空效果,包括创建基础应用结构、实现自定义绘制器、构建UI界面以及实现颜色选择按钮等步骤,并详细解析了混合模... 目录引言实现原理开始实现步骤1:创建基础应用结构步骤2:创建主屏幕步骤3:实现自定义绘制器步骤4:构建U

鸿蒙中Axios数据请求的封装和配置方法

《鸿蒙中Axios数据请求的封装和配置方法》:本文主要介绍鸿蒙中Axios数据请求的封装和配置方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1.配置权限 应用级权限和系统级权限2.配置网络请求的代码3.下载在Entry中 下载AxIOS4.封装Htt

SpringBoot中封装Cors自动配置方式

《SpringBoot中封装Cors自动配置方式》:本文主要介绍SpringBoot中封装Cors自动配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录SpringBoot封装Cors自动配置背景实现步骤1. 创建 GlobalCorsProperties

Flutter打包APK的几种方式小结

《Flutter打包APK的几种方式小结》Flutter打包不同于RN,Flutter可以在AndroidStudio里编写Flutter代码并最终打包为APK,本篇主要阐述涉及到的几种打包方式,通... 目录前言1. android原生打包APK方式2. Flutter通过原生工程打包方式3. Futte

Java导入、导出excel用法步骤保姆级教程(附封装好的工具类)

《Java导入、导出excel用法步骤保姆级教程(附封装好的工具类)》:本文主要介绍Java导入、导出excel的相关资料,讲解了使用Java和ApachePOI库将数据导出为Excel文件,包括... 目录前言一、引入Apache POI依赖二、用法&步骤2.1 创建Excel的元素2.3 样式和字体2.

JAVA封装多线程实现的方式及原理

《JAVA封装多线程实现的方式及原理》:本文主要介绍Java中封装多线程的原理和常见方式,通过封装可以简化多线程的使用,提高安全性,并增强代码的可维护性和可扩展性,需要的朋友可以参考下... 目录前言一、封装的目标二、常见的封装方式及原理总结前言在 Java 中,封装多线程的原理主要围绕着将多线程相关的操