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

simple_chips_input 표지
패키지 상세v1.2.2

simple_chips_input

칩 생성 및 칩 선택을 위한 2개의 라이브러리를 포함한 가장 사용자 정의 가능한 패키지

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
1.1천
좋아요
51
Pub 점수
150

패키지 설치

flutter pub add simple_chips_input

패키지 개요

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

Simple Chips Input는 두 가지 라이브러리를 제공하는 매우 사용자 정의 가능한 Flutter 패키지로, 칩과 칩 선택을 생성하고 관리하는 데 사용할 수 있습니다. 단일 및 다중 선택을 지원하며, 개발자가 쉽게 상호작용 가능한 태그 유사 컴포넌트를 만들 수 있도록 도와줍니다. 유연성을 고려하여 설계되어 외관, 동작 및 상호작용 패턴을 사용자 정의할 수 있습니다. 양식, 필터 또는 태깅 시스템에 적합하며, 모든 주요 플랫폼에서 동적으로 칩을 생성하고 관리하기 위한 깔끔한 API를 제공합니다.

사용 사례

  • 태그 선택이 있는 폼 입력
  • 필터링 인터페이스
  • 사용자 생성 태그
  • 다이나믹 칩 목록
  • 검색 제안
  • 다중 선택 드롭다운

주요 기능

  • 높은 사용자 정의 가능한 칩 스타일
  • 단일 및 다중 선택 지원
  • 내장된 검증 및 오류 처리
  • 크로스 플랫폼 호환성
  • 텍스트 필드와의 간편한 통합
  • 확장 가능한 이벤트 콜백

적합한 대상

  • 폼 컴포넌트를 구축하는 개발자
  • 유연한 칩 위젯이 필요한 UI 디자이너
  • 태그 기반 입력이 필요한 앱
  • 다중 선택이 필요한 프로젝트
  • 크로스 플랫폼 일관성을 우선시하는 팀

고려 사항

  • Flutter 상태 관리에 대한 이해가 필요합니다
  • 복잡한 검증을 위해 추가적인 로직이 필요할 수 있습니다
  • 사용자 정의 옵션은 코드 복잡성을 증가시킬 수 있습니다
  • 기본 예제 외에 문서가 제한적
  • 매우 큰 데이터 세트에 최적화되지 않음

원본 README

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

simple_chips_input

Features 🚀

The working screen captures might be outdated.
Please refer to the demo: https://simplechipsinput.vercel.app
  • Create chips from user's text input and get the value after form submission.
  • Select chips and get the values of the selection.
  • Select only one chip at a time and get the value (acts as a toggle/radio button).
  • Ability to keep some/all/none pre-selected chips (that can be later changed according to user input).
  • Full customisability of the chips - keeping prefix/suffix icons (that can be changed when a particular chip is selected).
  • Full customisability of the chips design - change the background color, border color, text color, etc of the chips (can be two sets of designs - one for selected chips and one for unselected chips).
  • Much more!

Contents 📚

  • Create chips from user's text input and get the value after form submission. Read the API reference for full documentation.
  • Select pre-defined chips to get the value of selected chips. Read the API reference for full documentation.

Importing the package ⬇️

import 'package:simple_chips_input/simple_chips_input.dart';
import 'package:simple_chips_input/select_chips_input.dart';

Working ⚙️

For example usage, refer pub.dev example
Author

@danger-ahead

카테고리

소스 저장소

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