패키지, 저장소 및 앱 카테고리 검색

패키지 상세v7.0.0

date_field

적응형 Material 및 Cupertino 일시 선택기 사용을 통해 DateTime 값을 선택할 수 있는 폼 필드 위젯입니다. 또한 선택기를 제공하는 전역 함수도 제공합니다.

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
2.2천
좋아요
139
Pub 점수
160

패키지 설치

flutter pub add date_field

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

date_field는 플랫폼에 따라 적응형 피커를 제공하는 Flutter 패키지로, Android 및 웹에서는 Material Design, iOS에서는 Cupertino을 사용하여 DateTime 값을 선택할 수 있는 폼 필드 위젯을 제공합니다. macOS, Windows, Linux 등 모든 주요 플랫폼을 지원합니다. 앱 내 어디서든 쉽게 날짜 및 시간 피커를 호출할 수 있도록 전역 함수를 포함하고 있어 폼과 사용자 워크플로우에의 통합을 간편하게 만듭니다. 플랫폼 간 일관된 UX를 보장하면서도 네이티브 느낌을 유지합니다.

사용 사례

  • 날짜 선택이 필요한 폼 입력
  • 시간 추적 응용 프로그램
  • 이벤트 스케줄링 인터페이스
  • 생년월일을 포함한 사용자 프로필 설정
  • 캘린더 기반 데이터 입력

주요 기능

  • 적응형 Material 및 Cupertino 피커
  • 전역 피커 호출 함수
  • 크로스 플랫폼 지원 (Android, iOS, Web, macOS, Windows, Linux)
  • Form 위젯과의 간편한 통합
  • 사용자 정의 가능한 날짜/시간 형식

적합한 대상

  • 날짜 입력을 사용하여 크로스 플랫폼 앱을 개발하는 개발자
  • 네이티브처럼 보이는 날짜 선택기 필요 앱
  • 시간 관련 데이터를 포함한 폼 중심 애플리케이션
  • 플랫폼별 사용자 인터페이스 일관성을 우선시하는 팀

고려 사항

  • Flutter SDK 2.5 이상이 필요합니다
  • 영어 이외의 로케일에 대해 추가적인 현지화 설정이 필요할 수 있습니다
  • 기본 옵션을 초과한 피커 외관의 사용자 정의가 제한되어 있음
  • 플랫폼 전용 렌더링 동작에 의존합니다

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

Welcome to the Date Field package! 📅

pub package

This package provides two widgets, DateTimeField and DateTimeFormField, which allow users to pick a date and/or time from an input field. You can customize the appearance of the widgets using the decoration argument, and specify whether to ask for a date, a time, or both using the mode parameter. You can further customize the picker by configuring dialog properties.

iOS Android
Date field picker package gif on an iOS device Date field picker package gif on an Android device

Getting Started 🚀

  1. Add date_field package to your dependencies in pubspec.yaml.

    dependencies:
      ...
      date_field: ^6.0.0
    
  2. Run flutter pub get to install the package.

  3. Initialize your systems locale. If not, users might see AM/PM even when they configured their system to use 24h format. Add the following code to your main function:

    import 'package:intl/intl_standalone.dart' if (dart.library.html) 'package:intl/intl_browser.dart';
    
    Future<void> main() async {
      WidgetsFlutterBinding.ensureInitialized();
      await findSystemLocale();
      runApp(const MyApp());
    }
    
  4. Import the package in your Dart code.

    import 'package:date_field/date_field.dart';
    
  5. Use the Widget. Example:

    DateTimeFormField(
      decoration: const InputDecoration(
        labelText: 'Enter Date',
      ),
      firstDate: DateTime.now().add(const Duration(days: 10)),
      lastDate: DateTime.now().add(const Duration(days: 40)),
      initialPickerDateTime: DateTime.now().add(const Duration(days: 20)),
      onChanged: (DateTime? value) {
        selectedDate = value;
      },
    ),
    
  6. To display the adaptive dialog without the field widget, you can directly use the showAdaptiveDateTimePicker.

     final DateTime? result = await showAdaptiveDateTimePicker(
       context: context,
       mode: DateTimeFieldPickerMode.dateAndTime,
     );
    

Note that you can also use the showMaterialDateTimePicker and showCupertinoDateTimePicker functions to show the Material and Cupertino pickers directly.

Features 🎨

  • DateTimeField: A widget that allows users to pick a date and/or time from an input field.
  • DateTimeFormField: A FormField that contains a DateTimeField.
  • showAdaptiveDateTimePicker: A function that shows a date and/or time picker dialog based on the platform, with the ability to customize the dialog properties.
  • showCupertinoDateTimePicker: A function that shows a Cupertino date and/or time picker dialog.
  • showMaterialDateTimePicker: A function that shows a Material date picker dialog.

Migration to 4.0.0 🚀

Version 4.0.0 contains breaking changes. Use dart fix to migrate to the latest version.

Known Issues 🐛

  • The pickers and formatted DateTimes adjust only on iOS and Android to the Device Systems Region. On all other platforms, the pickers adjust to the locale. See 32006

License 📜

This package is released under the MIT license.

Contributing 🤝

Contributions to this package are welcome! If you find a bug or have a feature request, please create an issue on the GitHub repository. If you'd like to contribute code, please create a pull request with your changes.

Before submitting a pull request, please make sure to run the tests and ensure they all pass. Additionally, please follow the existing coding style and make sure your code is well-documented.

Thank you for your contributions!

Maintainers 👷

카테고리

의존성

의존성 목록 3 개

소스 저장소

이 패키지를 사용하는 프로젝트