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

square_progress_bar 표지
패키지 상세v1.1.1

square_progress_bar

간편하게 사용할 수 있는 사각형 진행률 바입니다. 0.0에서 1.0 사이의 진행률을 제공하기만 하면 됩니다.

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
83
좋아요
29
Pub 점수
150

패키지 설치

flutter pub add square_progress_bar

패키지 개요

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

Flutter 애플리케이션용 간단하고 사용자 정의 가능한 사각형 진행률 바입니다. 0.0에서 1.0 사이의 진행률 값을 수락하여 로딩 또는 완료 상태에 대한 시각적 피드백이 필요한 모든 UI에 쉽게 통합할 수 있습니다. 가볍고 Android, iOS, Web, macOS, Windows, Linux를 포함한 모든 주요 플랫폼을 지원합니다. 양식, 파일 업로드 또는 깔끔하고 현대적인 진행률 표시기가 필요한 모든 상황에 적합합니다.

사용 사례

  • 양식 내 로딩 표시기
  • 파일 업로드 진행률 추적
  • 작업 완료 시각화
  • 대시보드 진행 상황 표시
  • 애니메이션 온보딩 흐름

주요 기능

  • 사각형 디자인
  • 0.0에서 1.0까지의 진행률
  • 크로스 플랫폼 지원
  • 최소 구성
  • 사용자 지정 가능한 색상 및 크기
  • 부드러운 애니메이션

적합한 대상

  • 간단한 진행률 UI
  • 경량 앱
  • 일관된 디자인 시스템
  • 빠른 프로토타이핑
  • 모바일 및 웹 애플리케이션

고려 사항

  • 기본 스타일링을 초과한 사용자 정의는 제한적
  • 내장 레이블 지원 없음
  • 복잡한 진행 워크플로우에 적합하지 않습니다
  • 애니메이션 타이밍 처리를 수동으로 해야 합니다
  • 외부 패키지 업데이트에 의존

원본 README

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

Square progress bar because why not 😎

Build Status

Features

  • Dynamic sizing
  • Animated progress bar
  • Gradient color progress bar
  • Progress bar cap shape customization
  • RTL support
  • ✨Magic✨

alt text

Installation

dependencies:
  square_progress_bar: ^1.1.1

Getting started

Just provide the progress in a range from 0.0 to 1.0 and you are set to go.

Usage

              SquareProgressBar(
                width: 100, // default: max available space
                height: 100, // default: max available space
                progress: _progress, // provide the progress in a range from 0.0 to 1.0
                isAnimation: false, // default: false, animate the progress of the bar
                solidBarColor: Colors.amber, // default: blue, main bar color
                emptyBarColor: Colors.orange.withOpacity(0.2), // default: gray, empty bar color
                strokeWidth: 20, // default: 15, bar width
                barStrokeCap: StrokeCap.round, // default: StrokeCap.round, bar cap shape
                isRtl: false, // default: false, bar start point
                gradientBarColor: const LinearGradient(
                  begin: Alignment.topRight,
                  end: Alignment.bottomLeft,
                  colors: <Color>[Colors.red, Colors.amber],
                  tileMode: TileMode.repeated,
                ), // default: null, if you pass gradient color it will be used instead of solid color for the main bar
                child: Center(
                  child: Text(
                    _percentageLabel,
                    style: const TextStyle(fontWeight: FontWeight.bold),
                  ),
                ),
              )

License

MIT Free Software, Hell Yeah!

카테고리

소스 저장소

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

아직 데이터가 없습니다.