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

flutter_picker 표지
패키지 상세v2.1.0

flutter_picker

Flutter 플러그인 피커. NumberPicker, DateTimePicker, ArrayPicker 및 기본 연결 피커를 포함합니다. 다양한 필요 조건을 충족시키기 위해 유연한 매개변수를 제공합니다.

30일 다운로드
4.5천
좋아요
441
Pub 점수
70

패키지 설치

flutter pub add flutter_picker

패키지 개요

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

Flutter Picker는 숫자 선택기, 날짜/시간 선택기, 배열 선택기 및 기본 연결 선택기 등을 포함한 다양한 선택기 컴포넌트를 제공하는 유연한 플러터 플러그인입니다. 외관과 동작을 사용자 정의할 수 있는 유연한 구성 옵션을 제공하여 다양한 폼 입력 및 선택 워크플로우에 적합합니다. 통합이 쉬우며, 다양한 사용 사례에서 동적 데이터 바인딩과 부드러운 사용자 인터랙션을 지원합니다.

사용 사례

  • 숫자 선택이 있는 폼 입력
  • 양식 내 날짜 및 시간 선택기
  • 사용자 정의 배열 기반 옵션 선택
  • 계층적 선택을 위한 연결 드롭다운
  • 모바일 우선 데이터 입력 인터페이스

주요 기능

  • 여러 종류의 피커 유형이 포함되어 있습니다
  • 고도로 사용자 지정 가능한 매개변수
  • 피커 간 연결 지원
  • 부드러운 스크롤 및 애니메이션
  • 기존 양식과의 간편한 통합

적합한 대상

  • 데이터 입력 폼을 구축하는 개발자
  • 날짜/시간 선택이 필요한 앱
  • 계층적 드롭다운이 필요한 프로젝트
  • UI 중심 모바일 애플리케이션
  • 재사용 가능한 피커 컴포넌트를 찾는 팀

고려 사항

  • 플랫폼별 제한 사항에 대해 언급되지 않음
  • 상태 관리를 수동으로 처리해야 합니다
  • 기본 설정 외에 문서가 제한적
  • 매우 큰 데이터 세트에 최적화되지 않음
  • 사용자 정의 테마를 위해 추가적인 스타일링이 필요할 수 있습니다

원본 README

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

flutter_picker

pub package GitHub GitHub stars

Flutter plugin picker. Include NumberPicker, DateTimePicker, ArrayPicker, and default linkage Picker. Provide flexible parameters to meet various needs. At the same time, you can extend more functions through custom adapters.

Supported Platforms

  • Android
  • IOS
  • Windows
  • MacOS
  • Linux
  • Web

image

How to Use

# add this line to your dependencies
flutter_picker:
  git:
    url: https://github.com/yangyxd/flutter_picker.git
import 'package:flutter_picker/flutter_picker.dart';

    showPicker(BuildContext context) {
      Picker picker = new Picker(
        adapter: PickerDataAdapter<String>(pickerdata: new JsonDecoder().convert(PickerData)),
        changeToFirst: true,
        textAlign: TextAlign.left,
        columnPadding: const EdgeInsets.all(8.0),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        }
      );
      picker.show(_scaffoldKey.currentState);
    }

    showPickerModal(BuildContext context) {
      new Picker(
        adapter: PickerDataAdapter<String>(pickerdata: new JsonDecoder().convert(PickerData)),
        changeToFirst: true,
        hideHeader: false,
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.adapter.text);
        }
      ).showModal(this.context); //_scaffoldKey.currentState);
    }

    showPickerIcons(BuildContext context) {
      new Picker(
        adapter: PickerDataAdapter(data: [
          new PickerItem(text: Icon(Icons.add), value: Icons.add, children: [
            new PickerItem(text: Icon(Icons.more)),
            new PickerItem(text: Icon(Icons.aspect_ratio)),
            new PickerItem(text: Icon(Icons.android)),
            new PickerItem(text: Icon(Icons.menu)),
          ]),
          new PickerItem(text: Icon(Icons.title), value: Icons.title, children: [
            new PickerItem(text: Icon(Icons.more_vert)),
            new PickerItem(text: Icon(Icons.ac_unit)),
            new PickerItem(text: Icon(Icons.access_alarm)),
            new PickerItem(text: Icon(Icons.account_balance)),
          ]),
          new PickerItem(text: Icon(Icons.face), value: Icons.face, children: [
            new PickerItem(text: Icon(Icons.add_circle_outline)),
            new PickerItem(text: Icon(Icons.add_a_photo)),
            new PickerItem(text: Icon(Icons.access_time)),
            new PickerItem(text: Icon(Icons.adjust)),
          ]),
          new PickerItem(text: Icon(Icons.linear_scale), value: Icons.linear_scale, children: [
            new PickerItem(text: Icon(Icons.assistant_photo)),
            new PickerItem(text: Icon(Icons.account_balance)),
            new PickerItem(text: Icon(Icons.airline_seat_legroom_extra)),
            new PickerItem(text: Icon(Icons.airport_shuttle)),
            new PickerItem(text: Icon(Icons.settings_bluetooth)),
          ]),
          new PickerItem(text: Icon(Icons.close), value: Icons.close),
        ]),
        title: new Text("Select Icon"),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        }
    ).show(_scaffoldKey.currentState);
  }

  showPickerDialog(BuildContext context) {
    new Picker(
        adapter: PickerDataAdapter<String>(pickerdata: new JsonDecoder().convert(PickerData)),
        hideHeader: true,
        title: new Text("Select Data"),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        }
    ).showDialog(context);
  }

  showPickerArray(BuildContext context) {
    new Picker(
        adapter: PickerDataAdapter<String>(pickerdata: new JsonDecoder().convert(PickerData2), isArray: true),
        hideHeader: true,
        title: new Text("Please Select"),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        }
    ).showDialog(context);
  }

  showPickerNumber(BuildContext context) {
    new Picker(
        adapter: NumberPickerAdapter(data: [
          NumberPickerColumn(begin: 0, end: 999),
          NumberPickerColumn(begin: 100, end: 200),
        ]),
        delimiter: [
          PickerDelimiter(child: Container(
            width: 30.0,
            alignment: Alignment.center,
            child: Icon(Icons.more_vert),
          ))
        ],
        hideHeader: true,
        title: new Text("Please Select"),
        onConfirm: (Picker picker, List value) {
          print(value.toString());
          print(picker.getSelectedValues());
        }
    ).showDialog(context);
  }

PickerData Example

Array

const PickerData2 = '''
[
    [
        1,
        2,
        3,
        4
    ],
    [
        11,
        22,
        33,
        44
    ],
    [
        "aaa",
        "bbb",
        "ccc"
    ]
]
    ''';
Linkage
const PickerData = '''
[
    {
        "a": [
            {
                "a1": [
                    1,
                    2,
                    3,
                    4
                ]
            },
            {
                "a2": [
                    5,
                    6,
                    7,
                    8
                ]
            },
            {
                "a3": [
                    9,
                    10,
                    11,
                    12
                ]
            }
        ]
    },
    {
        "b": [
            {
                "b1": [
                    11,
                    22,
                    33,
                    44
                ]
            },
            {
                "b2": [
                    55,
                    66,
                    77,
                    88
                ]
            },
            {
                "b3": [
                    99,
                    1010,
                    1111,
                    1212
                ]
            }
        ]
    },
    {
        "c": [
            {
                "c1": [
                    "a",
                    "b",
                    "c"
                ]
            },
            {
                "c2": [
                    "aa",
                    "bb",
                    "cc"
                ]
            },
            {
                "c3": [
                    "aaa",
                    "bbb",
                    "ccc"
                ]
            }
        ]
    }
]
    ''';

版本更新说明 (Version Update Notes)

v2.1.2 (2023.08.15)

Flutter Picker插件已经更新以支持最新版本的Flutter。主要更新内容如下:

  1. 兼容性升级:

    • 升级SDK版本支持范围到Flutter 3.x
    • 修复与新版Flutter的兼容性问题
  2. API更新:

    • 替换已弃用的ScaffoldState.showBottomSheet方法为Scaffold.maybeOf
    • 更新ButtonStyle和颜色相关的API,使用colorScheme.primary替代过时的colorScheme.secondary
    • 修复其他过时的API使用
  3. 使用说明:

    • 如果您正在使用此插件,请更新到最新版本以获得更好的兼容性
    • 对于现有代码,无需进行任何改变,API保持向后兼容

The Flutter Picker plugin has been updated to support the latest versions of Flutter. Major updates include:

  1. Compatibility Upgrade:

    • Expanded SDK version support to Flutter 3.x
    • Fixed compatibility issues with newer Flutter versions
  2. API Updates:

    • Replaced deprecated ScaffoldState.showBottomSheet method with Scaffold.maybeOf
    • Updated ButtonStyle and color-related APIs, using colorScheme.primary instead of the deprecated colorScheme.secondary
    • Fixed other deprecated API usages
  3. Usage Notes:

    • If you are using this plugin, please update to the latest version for better compatibility
    • No changes needed for existing code, the API remains backward compatible

카테고리

소스 저장소

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