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

time_picker_spinner 표지
패키지 상세v1.0.2

time_picker_spinner

기본적인 매터리얼 시간 선택기 대신 스피너를 사용하는 시간 선택기입니다. 이 위젯은 12시간 또는 24시간 형식과 사용자 정의 간격 모드와 함께 작동하며, 이 패키지는 아랍어 및 영어로의 로컬라이제이션을 허용합니다.

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
2천
좋아요
9
Pub 점수
130

패키지 설치

flutter pub add time_picker_spinner

패키지 개요

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

기본 Material 시간 선택기 대신 스피너 위젯을 사용하는 Flutter 패키지입니다. 12시간 및 24시간 형식을 지원하며, 사용자 정의 가능한 시간 간격과 아랍어(ar) 및 영어(en)에 대한 로컬라이제이션을 제공합니다. 여러 플랫폼에서 일관된 비-Material 디자인의 시간 선택 기능이 필요한 앱에 적합합니다. 가볍고 폼 또는 설정 화면에 쉽게 통합되어 전통적인 시간 선택기가 필요할 때 유용합니다.

사용 사례

  • 양식 내 사용자 지정 시간 입력
  • 로컬 시간 선택
  • 비물질적 UI 디자인
  • 시간 간격 사용자 정의
  • 크로스 플랫폼 시간 선택기
  • 시간 입력이 있는 설정

주요 기능

  • 스피너 기반의 시간 선택
  • 12/24 시간 형식 지원
  • 사용자 정의 간격 옵션
  • 아랍어 및 영어 로컬라이제이션
  • 모든 주요 플랫폼에서 작동합니다
  • 경량이며 통합이 쉬움

적합한 대상

  • 대체 시간 선택기 찾는 개발자
  • 현지 시간 입력이 필요한 앱
  • 디자이너들이 Material 컴포넌트를 피함
  • 다중 플랫폼 애플리케이션
  • 폼 중심 사용자 인터페이스

고려 사항

  • 기본 시간 선택에 제한됨
  • 내장된 검증 없음
  • 시간 로직을 수동으로 처리해야 합니다
  • 복잡한 시간 연산에 적합하지 않습니다
  • 외부 로컬라이제이션 설정에 의존

원본 README

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

time_picker_spinner

Time Picker with spinner instead of a default material time picker. This widget works with 12 or 24 hour format and custom interval mode, and this package allow localization ar and en.

Pub Version

Demo gif

image

Installation

  1. Add this to your package's pubspec.yaml file:
dependencies:
  time_picker_spinner: any
  1. Get the package using your IDE's GUI or via command line with
$ pub get
  1. Import the time_picker_spinner.dart file in your app
import 'package:time_picker_spinner/time_picker_spinner.dart';

Features

  • This widget works with 12.
  • This widget works with 24.
  • allow localization ar and en.

Usage

EN
en short en long

image | image

TimePickerSpinner(
              locale: const Locale('en', ''),
              time: dateTime,
              is24HourMode: false,
              isShowSeconds: true,
              itemHeight: 80,
              normalTextStyle: const TextStyle(
                fontSize: 24,
              ),
              highlightedTextStyle:
                  const TextStyle(fontSize: 24, color: Colors.blue),
              isForce2Digits: true,
              onTimeChange: (time) {
                setState(() {
                  dateTime = time;
                });
              },
            )
Ar
ar short ar long

image | image

TimePickerSpinner(
              locale: const Locale('ar', ''),
              time: dateTime,
              is24HourMode: false,
              isShowSeconds: true,
              itemHeight: 80,
              normalTextStyle: const TextStyle(
                fontSize: 24,
              ),
              highlightedTextStyle:
                  const TextStyle(fontSize: 24, color: Colors.blue),
              isForce2Digits: true,
              onTimeChange: (time) {
                setState(() {
                  dateTime = time;
                });
              },
            )

Props

props types defaultValues
time DateTime Current Time [ DateTime.now() ]
minutesInterval int 1
secondsInterval int 1
is24HourMode bool true
isShowSeconds bool false
isShowSeconds bool false
highlightedTextStyle TextStyle false
normalTextStyle TextStyle false
itemHeight double 60.0
itemWidth double 45.0
spacing double 20.0
alignment AlignmentGeometry Alignment.centerRight
isForce2Digits bool false
onTimeChange TimePickerCallback
locale bool en

카테고리

소스 저장소

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

아직 데이터가 없습니다.