搜索插件、代码仓与 APP 分类

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.

所属分类

源码仓库

使用此插件的项目