use_scramble

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

useScramble フックにインスパイアされたランダムテキストアニメーションを可能にする軽量なFlutterパッケージです。テキストが混ざり合い、最終形に落ち着くようなダイナミックなタイプライター風のエフェクトを作成します。ローディングメッセージ、アニメーションヘッドライン、インタラクティブなテキストディスプレイなど、魅力的なUI要素に最適です。パッケージは簡単に統合でき、モバイル、Web、デスクトップを含むすべての主要プラットフォームで動作します。スクランブル速度や文字セットをカスタマイズできるため、さまざまなデザインニーズに対応可能です。

用途

アニメーション付きのウェルカムメッセージ
読み込み状態インジケーター
インタラクティブな見出しエフェクト
動的ラベルアニメーション
オンボーディング画面の活用

主な機能

リアルタイムテキストの乱用
カスタマイズ可能なアニメーション速度
カスタム文字セットをサポートしています
クロスプラットフォーム互換性
最小限のセットアップが必要
デバイス間でのスムーズなパフォーマンス

適している対象

動的なテキストエフェクトを求める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

パッケージ、リポジトリ、アプリカテゴリを検索

パッケージをインストール