use_scramble

패키지 개요

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

useScramble 훅에서 영감을 받은 무거운 느낌 없는 플러터 패키지로, 임의의 텍스트 애니메이션을 가능하게 합니다. 텍스트가 혼란스럽게 나타났다가 최종 형태로 안정화되는 동적 타자기 효과를 생성합니다. 로딩 메시지, 애니메이션 제목 또는 인터랙티브 텍스트 표시와 같은 매력적인 UI 요소에 적합합니다. 패키지는 간단히 통합할 수 있으며 모바일, 웹, 데스크톱을 포함한 모든 주요 플랫폼에서 작동합니다. 스캐러블 속도 및 문자 세트를 사용자 정의할 수 있어 다양한 디자인 요구 사항에 유연하게 대응할 수 있습니다.

사용 사례

애니메이션 환영 메시지
로딩 상태 표시기
인터랙티브 헤드라인 효과
동적 레이블 애니메이션
온보딩 화면 활용

주요 기능

실시간 텍스트 혼동
사용자 지정 가능한 애니메이션 속도
사용자 정의 문자 세트를 지원합니다
크로스 플랫폼 호환성
최소한의 설정 필요
기기 간 원활한 성능

적합한 대상

동적 텍스트 효과를 원하는 UI 디자이너
인터랙티브 앱을 개발하는 개발자
애니메이션된 온보딩 흐름을 가진 프로젝트
로딩 중 시각적 피드백이 필요한 앱
창의적인 디지털 경험

고려 사항

매우 긴 텍스트와 함께 성능에 영향을 미칠 수 있습니다
개별 문자 타이밍에 대한 제한된 제어
정적 텍스트 표시에 적합하지 않습니다
짧고 강력한 표현에 가장 적합
최적의 시각 효과를 얻기 위해 신중한 조정이 필요합니다

원본 README

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

Lightweight package for random text animations inspired by useScramble

Used by

Board Buddy
- AppStore
- Google Play

Usage

TextScramble(
    text: 'Hello World!',
    speed: Duration(milliseconds: 50),
    chars: '!<>-_\\/[]{}—=+*^?#________',
    correctCharProbability: 0.1, // Correct character probability in [0, 1]
    scrambleCycles: 4, // Number of times to scramble the text
    builder: (context, scrambledText) {
      // Use the builder to define how the text is displayed
      return Text(
        scrambledText,
        textAlign: TextAlign.center, // Text alignment is now within the builder
        style: TextStyle( // Text style is now within the builder
          fontSize: 40,
          color: Colors.green,
          fontFamily: 'JetBrainsMono',
        ),
      );
    },
),

Bugs/Requests

If you encounter any problems feel free to open an issue. If you feel the library is missing a feature, please raise a ticket on Github and I'll look into it. Pull request are also welcome.

Additional information

Medium article link

Created by Gleb | khlebobul@gmail.com

Support the project:

Credits

Inspired by useScramble
Thanks eibaan for the recommendations

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

패키지 설치