Flutter Cupertino Date Picker 使用教程

Flutter Cupertino Date Picker 使用教程

flutter-cupertino-date-picker项目地址:https://gitcode.com/gh_mirrors/flu/flutter-cupertino-date-picker

1. 项目的目录结构及介绍

flutter-cupertino-date-picker/
├── lib/
│   ├── date_picker.dart
│   ├── date_picker_bottom_sheet.dart
│   ├── date_picker_dialog.dart
│   ├── date_picker_theme.dart
│   ├── i18n/
│   │   ├── date_picker_i18n.dart
│   │   ├── en.dart
│   │   ├── zh.dart
│   └── main.dart
├── example/
│   ├── lib/
│   │   ├── main.dart
│   └── pubspec.yaml
├── pubspec.yaml
└── README.md

• lib/：包含项目的主要代码文件。
  • date_picker.dart：日期选择器的主要实现文件。
  • date_picker_bottom_sheet.dart：底部弹出的日期选择器实现文件。
  • date_picker_dialog.dart：对话框形式的日期选择器实现文件。
  • date_picker_theme.dart：日期选择器的主题配置文件。
  • i18n/：国际化相关文件。
    • date_picker_i18n.dart：国际化配置文件。
    • en.dart：英文本地化文件。
    • zh.dart：中文本地化文件。
  • main.dart：示例应用的入口文件。
• example/：示例应用的代码。
  • lib/：示例应用的主要代码文件。
    • main.dart：示例应用的入口文件。
  • pubspec.yaml：示例应用的依赖配置文件。
• pubspec.yaml：项目的依赖配置文件。
• README.md：项目的说明文档。

2. 项目的启动文件介绍

项目的启动文件位于 example/lib/main.dart。这个文件是示例应用的入口文件，展示了如何使用 flutter-cupertino-date-picker 插件。

import 'package:flutter/material.dart';
import 'package:flutter_cupertino_date_picker/flutter_cupertino_date_picker.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Cupertino Date Picker Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  DateTime _dateTime = DateTime.now();

  void _showDatePicker() {
    DatePicker.showDatePicker(
      context,
      initialDateTime: _dateTime,
      minDateTime: DateTime(2000),
      maxDateTime: DateTime(2100),
      dateFormat: 'yyyy-MM-dd',
      locale: DateTimePickerLocale.zh_cn,
      onConfirm: (date) {
        setState(() {
          _dateTime = date;
        });
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Cupertino Date Picker Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Selected Date:',
              style: TextStyle(fontSize: 18),
            ),
            Text(
              '${_dateTime.toString().substring(0, 10)}',
              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
            ),
            SizedBox(height: 20),
            RaisedButton(
              onPressed: _showDatePicker,
              child: Text('Show Date Picker'),
            ),
          ],
        ),
      ),
    );
  }
}

flutter-cupertino-date-picker项目地址:https://gitcode.com/gh_mirrors/flu/flutter-cupertino-date-picker