搜尋套件、儲存庫與 APP 分類

loading_indicator 封面
套件詳情v4.0.2

loading_indicator

一個用純 Dart 編寫的載入動畫集合。開箱即用,無需額外依賴。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
7.2萬
喜歡數
695
Pub 分數
160

安裝套件

flutter pub add loading_indicator

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

一個輕量級的 Flutter 套件,提供多種完全以 Dart 編寫的載入動畫。它提供流暢且可自訂的載入指示器,無需額外依賴。適用於跨多個平台應用程式中顯示載入狀態,支援 Android、iOS、Web、macOS、Windows 與 Linux。套件易於整合與使用,非常適合在非同步作業期間提升使用者體驗。

適用情境

  • 在表單中顯示加載狀態
  • 顯示資料獲取過程中的進度
  • 增強頁面過渡期間的使用者介面
  • 在背景任務中提供視覺反饋
  • 建立自訂載入畫面

主要特色

  • 純 Dart 實現
  • 無額外依賴
  • 跨平台支援
  • 多種動畫樣式
  • 容易自訂
  • 輕量級大小

適合對象

  • 簡單的加載UI
  • 針對多個平台的應用
  • 開發人員避免使用外部程式庫
  • 移動和網頁應用的使用者介面增強
  • 快速整合到現有專案中

使用建議

  • 僅限基本加載動畫
  • 除了顏色和尺寸之外,沒有高級自定義選項
  • 動畫在低階設備上的效能可能較差
  • 不適合複雜的加載邏輯
  • 缺少內建的錯誤或成功狀態

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

LoadingIndicator

pub package GitHub top language

A collection of out of the box loading animations written in pure dart, no extra dependency, inspired by loaders.css and NVActivityIndicatorView.

Demo

Now, you can click this site to preview.3D effect will be invalid in web.

Animation types

Type Type Type Type
1. ballPulse 2. ballGridPulse 3. ballClipRotate 4. squareSpin
5. ballClipRotatePulse 6. ballClipRotateMultiple 7. ballPulseRise 8. ballRotate
9. cubeTransition 10. ballZigZag 11. ballZigZagDeflect 12. ballTrianglePath
13. ballTrianglePathColored 14.ballTrianglePathColoredFilled 15. ballScale 16. lineScale
17. lineScaleParty 18. ballScaleMultiple 19. ballPulseSync 20. ballBeat
21. lineScalePulseOut 22. lineScalePulseOutRapid 23. ballScaleRipple 24. ballScaleRippleMultiple
25. ballSpinFadeLoader 26. lineSpinFadeLoader 27. triangleSkewSpin 28. pacman
29. ballGridBeat 30. semiCircleSpin 31. ballRotateChase 32. orbit
33. audioEqualizer 34. circleStrokeSpin

Installing

Install the latest version from pub

Preparing a release

Use the release helper from the latest master checkout to calculate the next version from the existing stable tags and update the root pubspec.yaml and CHANGELOG.md:

./scripts/prepare_release.sh --dry-run
./scripts/prepare_release.sh patch

patch, minor, and major are supported, as well as an explicit version such as 4.0.2. The helper refreshes tags from origin and ignores local tags that no longer exist remotely. It accepts a release tag that is either in the current history or fully represented by cherry-picked commits, and refuses to continue when the latest tag cannot be matched to the current history. For an automatic patch, it asks GitHub for notes before changing files and copies the returned Markdown into the dated changelog entry. A real patch run (not --dry-run) requires a clean master matching origin/master, updates only the root pubspec.yaml and CHANGELOG.md, commits them, pushes master, creates and pushes the next version tag, and invokes gh release create with the generated notes. It does not modify example/pubspec.yaml. gh must be installed and authenticated. The existing tag-triggered workflow safely skips release creation when the script has already created it. minor, major, and explicit versions update the local root pubspec.yaml and CHANGELOG.md with a placeholder, then print the release-notes command.

Usage

Simple but powerful parameters

LoadingIndicator(
  indicatorType: Indicator.ballPulse, // Required: animation type
  colors: const [Colors.white],        // Optional: color collection
  strokeWidth: 2,                      // Optional: stroke and line width
  backgroundColor: Colors.black,       // Optional: widget background
  pathBackgroundColor: Colors.black,   // Optional: stroke background
)

strokeWidth controls the bar width of lineScale, lineScaleParty, lineScalePulseOut, lineScalePulseOutRapid, and lineSpinFadeLoader. When omitted, these indicators keep their original size-derived bar width.

Without a controller, every indicator plays continuously. To control playback, create and dispose a LoadingIndicatorController with your widget:

late final LoadingIndicatorController _controller;

@override
void initState() {
  super.initState();
  _controller = LoadingIndicatorController();
}

@override
void dispose() {
  _controller.dispose();
  super.dispose();
}

@override
Widget build(BuildContext context) {
  return LoadingIndicator(
    indicatorType: Indicator.ballScaleMultiple,
    controller: _controller,
  );
}

The controller works with all 34 animation types:

_controller.pause(); // Freeze the current frame immediately.

await _controller.pauseAt(0.5); // Pause the next time progress reaches 50%.

await _controller.pauseAt(
  1.0,
  behavior: LoadingIndicatorPauseBehavior.jumpToTarget,
); // Advance the complete animation group to the target and pause now.

_controller.resume();

progress is the normalized position (0.0 to 1.0) of an indicator's reference animation track: 0.0 is the start of a loop and 1.0 is its final frame before reset. pauseAt completes only after the indicator has paused. Replacing a pending command or disposing the controller completes that Future with LoadingIndicatorCommandCanceled. One controller can be attached to only one LoadingIndicator at a time; the last command sent while detached is applied on the next attachment.

Migrating from 3.x

Version 4.0 removes the pause widget parameter. Replace it with a controller:

// 3.x
LoadingIndicator(indicatorType: Indicator.ballPulse, pause: isPaused);

// 4.0
LoadingIndicator(
  indicatorType: Indicator.ballPulse,
  controller: controller,
);

void setPaused(bool isPaused) {
  isPaused ? controller.pause() : controller.resume();
}

中文版

License

Copyright 2019 Tino Guo.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

所屬分類

依賴

依賴清單 2 項

原始碼儲存庫

使用此套件的專案