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

progress_indicators のカバー
パッケージ詳細v1.0.0

progress_indicators

いくつかのクールなプログレスインジケーターとテキストアニメーターのコレクション。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
6430
いいね数
198
Pub ポイント
130

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

flutter pub add progress_indicators

パッケージ概要

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

視覚的に魅力的なプログレスインジケーターとテキストアニメーターのコレクションを提供するFlutterパッケージです。複数のプラットフォームでスムーズでカスタマイズ可能なローディングアニメーションにより、ユーザー体験を向上させるように設計されています。アプリ内でローディング状態を表示したり、コンテンツを更新したり、テキストをアニメーション化するのに最適です。Android、iOS、Web、macOS、Windows、Linuxをサポートしており、デバイス間で一貫したパフォーマンスと外観を確保します。pub addによる簡単な統合により、複雑なセットアップなしに現代的なUI要素を利用できます。

用途

  • ロード画面
  • リフレッシュインジケーター
  • アニメーションテキスト表示
  • オンボーディング体験
  • ゲームの読み込み状態
  • インタラクティブなアプリフィードバック

主な機能

  • 複数のアニメーション付きプログレススタイル
  • テキストアニメーションユーティリティ
  • クロスプラットフォーム互換性
  • 簡単な統合
  • カスタマイズ可能な色とサイズ
  • 軽量でパフォーマンスに優れる

適している対象

  • UI/UXデザイナー
  • モバイルアプリ開発者
  • Webアプリケーション作成者
  • Flutter ビギナー
  • 魅力的なロード画面を必要とするアプリ
  • 動的なコンテンツ更新を含むプロジェクト

注意事項

  • 視覚的な強化に限定
  • 高度な状態管理なし
  • 複雑なアニメーションには適していません
  • 独自のデザインには手動でのスタイリングが必要です
  • Flutter のレンダリングエンジンに依存しています
  • 過剰に使用するとパフォーマンスに影響する可能性があります

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

Flutter progress indicators

With this project, we are aiming to provide some cool, animated progress indicators to Flutter developers.

Currently available

Sample

Here's how it looks like.

Usage

Import package:progress_indicators/progress_indicators.dart and use these avaiable widgets:

  • FadingText
  • JumpingText
  • ScalingText
  • JumpingDots
  • HeartbeatProgressIndicator
  • GlowingProgressIndicator
  • CollectionSlideTranstion
  • CollectionScaleTransition

Example

Widget build(BuildContext context) {
    print(Offset(0.0, -1.0).distanceSquared - Offset(0.0, 0.0).distanceSquared);
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Text('Jumping dots'),
            JumpingDotsProgressIndicator(
              fontSize: 20.0,
            ),
            SizedBox(height: 60.0),
            new Text('Heartbeat'),
            SizedBox(height: 16.0),
            HeartbeatProgressIndicator(
              child: Icon(Icons.home),
            ),
            SizedBox(height: 60.0),
            new Text('Glowing'),
            GlowingProgressIndicator(
              child: Icon(Icons.home),
            ),
            SizedBox(height: 32.0),
            FadingText('Loading...'),
            SizedBox(height: 32.0),
            JumpingText('Loading...'),
            SizedBox(height: 32.0),
            ScalingText('Loading...'),
            SizedBox(height: 32.0),
            CollectionSlideTransition(
              children: <Widget>[
                Icon(Icons.android),
                Icon(Icons.apps),
                Icon(Icons.announcement),
              ],
            ),
            SizedBox(height: 32.0),
            CollectionScaleTransition(
              children: <Widget>[
                Icon(Icons.android),
                Icon(Icons.apps),
                Icon(Icons.announcement),
              ],
            ),
          ],
        ),
      ),
    );
  }

For complete sample, see the this example app.

カテゴリー

ソースリポジトリ

このパッケージを使用しているプロジェクト