百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术资源 > 正文

Flutter CupertinoDatePicker 时间选择器的使用

lipiwang 2024-11-07 12:47 6 浏览 0 评论


前言

Flutter默认使用的安卓时间选择器不好看,其他一些插件要么用的人太少,要么好几年没更新了。比如flutter_datetime_picker,是我喜欢的样式,但是两年没更新了,而且一直报错Error: 'DatePickerTheme' is imported from both,根本用不了。

以下介绍一下Flutter下的CupertinoDatePicker的详细使用方法。

导入

import 'package:flutter/cupertino.dart';

页面添加CupertinoDatePicker

SizedBox(
	height: 200, //放在SizedBox里面可以限制高度
	child: CupertinoDatePicker(
    mode: CupertinoDatePickerMode.date, //设置只有日期的模式
    initialDateTime: DateTime.now(), //初始时间
    //下面的时间限制必须要有,不然会报错“_CupertinoDatePickerDateTimeState is only meant for dateAndTime mode or time mode”
    maximumYear: 2025,
    minimumYear: 2024,
    minimumDate:
      DateTime.now().add(const Duration(days: -1)), //可选择的最小日期
    maximumDate: DateTime.now().add(const Duration(days: 300)),
    onDateTimeChanged: (date) { //date就是每次选择的日期
      print(date);
    },
	),
),

国际化

在pubspec.yaml里加上flutter_localizations或者intl,只用一个就可以了

dependencies:
  flutter:
    sdk: flutter
  #国际化
  flutter_localizations:
    sdk: flutter
  #或者使用intl
  intl: ^0.17.0

MaterialApp下面添加以下内容:

MaterialApp(
  locale: Locale('zh', 'CH'), //默认是中文
  localizationsDelegates: [
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
   ],
   supportedLocales: [
     const Locale('zh', 'CH'), //支持列表,中文
     const Locale('en', 'US'), //支持列表,英文
   ],
 ......

另外一个CupertinoTimePicker的例子

ElevatedButton(
  onPressed: () async {
  showModalBottomSheet(
    context: context,
    builder: (context) {
    return CupertinoTimerPicker(
      mode: CupertinoTimerPickerMode.hms, //模式可以值选择时和分,或者加秒
      minuteInterval: 1, //最小的分钟间隔
      //设置默认的时间,路由自己设置或者是可以设置为当前数据的时分秒
      initialTimerDuration:
      Duration(hours: 2, minutes: 10, seconds: 54),
      onTimerDurationChanged: (stime) {
        print("$stime");
        setState(() {
                 selectTimeStr2 = "$stime";
                 });
  	},);
	});
},
  child: Text("$timeM2$selectTimeStr2"))

相关推荐

linux实例之设置时区的方式有哪些

linux系统下的时间管理是一个复杂但精细的功能,而时区又是时间管理非常重要的一个辅助功能。时区解决了本地时间和UTC时间的差异,从而确保了linux系统下时间戳和时间的准确性和一致性。比如文件的时间...

Linux set命令用法(linux cp命令的用法)

Linux中的set命令用于设置或显示系统环境变量。1.设置环境变量:-setVAR=value:设置环境变量VAR的值为value。-exportVAR:将已设置的环境变量VAR导出,使其...

python环境怎么搭建?小白看完就会!简简单单

很多小伙伴安装了python不会搭建环境,看完这个你就会了Python可应用于多平台包括Linux和MacOSX。你可以通过终端窗口输入"python"命令来查看本地是否...

Linux环境下如何设置多个交叉编译工具链?

常见的Linux操作系统都可以通过包管理器安装交叉编译工具链,比如Ubuntu环境下使用如下命令安装gcc交叉编译器:sudoapt-getinstallgcc-arm-linux-gnueab...

JMeter环境变量配置技巧与注意事项

通过给JMeter配置环境变量,可以快捷的打开JMeter:打开终端。执行jmeter。配置环境变量的方法如下。Mac和Linux系统在~/.bashrc中加如下内容:export...

C/C++|头文件、源文件分开写的源起及作用

1C/C++编译模式通常,在一个C++程序中,只包含两类文件——.cpp文件和.h文件。其中,.cpp文件被称作C++源文件,里面放的都是C++的源代码;而.h文件则被称...

linux中内部变量,环境变量,用户变量的区别

unixshell的变量分类在Shell中有三种变量:内部变量,环境变量,用户变量。内部变量:系统提供,不用定义,不能修改环境变量:系统提供,不用定义,可以修改,可以利用export将用户变量转为环...

在Linux中输入一行命令后究竟发生了什么?

Linux,这个开源的操作系统巨人,以其强大的命令行界面而闻名。无论你是初学者还是经验丰富的系统管理员,理解在Linux终端输入一条命令并按下回车后发生的事情,都是掌握Linux核心的关键。从表面上看...

Nodejs安装、配置与快速入门(node. js安装)

Nodejs是现代JavaScript语言产生革命性变化的一个主要框架,它使得JavaScript从一门浏览器语言成为可以在服务器端运行、开发各种各样应用的通用语言。在不同的平台下,Nodejs的安装...

Ollama使用指南【超全版】(olaplex使用方法图解)

一、Ollama快速入门Ollama是一个用于在本地运行大型语言模型的工具,下面将介绍如何在不同操作系统上安装和使用Ollama。官网:https://ollama.comGithub:http...

linux移植(linux移植lvgl)

1uboot移植l移植linux之前需要先移植一个bootlader代码,主要用于启动linux内核,lLinux系统包括u-boot、内核、根文件系统(rootfs)l引导程序的主要作用将...

Linux日常小技巧参数优化(linux参数调优)

Linux系统参数优化可以让系统更加稳定、高效、安全,提高系统的性能和使用体验。下面列出一些常见的Linux系统参数优化示例,包括修改默认配置、网络等多方面。1.修改默认配置1.1修改默认编辑器默...

Linux系统编程—条件变量(linux 条件变量开销)

条件变量是用来等待线程而不是上锁的,条件变量通常和互斥锁一起使用。条件变量之所以要和互斥锁一起使用,主要是因为互斥锁的一个明显的特点就是它只有两种状态:锁定和非锁定,而条件变量可以通过允许线程阻塞和等...

面试题-Linux系统优化进阶学习(linux系统的优化)

一.基础必备优化:1.关闭SElinux2.FirewalldCenetOS7Iptables(C6)安全组(阿里云)3.网络管理服务||NetworkManager|network...

嵌入式Linux开发教程:Linux Shell

本章重点介绍Linux的常用操作和命令。在介绍命令之前,先对Linux的Shell进行了简单介绍,然后按照大多数用户的使用习惯,对各种操作和相关命令进行了分类介绍。对相关命令的介绍都力求通俗易懂,都给...

取消回复欢迎 发表评论: