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

avatar_glow 封面
套件詳情v3.0.1

avatar_glow

一個提供頭像發光元件並帶有酷炫背景發光動畫的 Flutter 套件

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
4.2萬
喜歡數
1250
Pub 分數
150

安裝套件

flutter pub add avatar_glow

套件介紹

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

Avatar Glow 是一個 Flutter 套件,透過在頭像周圍添加視覺上吸引人的發光動畫來增強使用者個人檔案。它提供了一個可自訂的 AvatarGlow 小工具,可添加動態背景發光效果,非常適合用於個人檔案圖片或聊天頭像。動畫流暢且反應迅速,在 Android、iOS、Web、macOS、Windows 和 Linux 等所有主要平台皆可運作。非常適合重視視覺反饋與互動性的現代 UI。

適用情境

  • 個人檔案圖片亮點
  • 聊天頭動畫
  • 互動式使用者頭像
  • 入門畫面
  • 遊戲化介面
  • 應用中的視覺反饋

主要特色

  • 平滑發光動畫
  • 可自訂的發光半徑
  • 支援所有 Flutter 平台
  • 與現有小部件的輕鬆整合
  • 可設定的動畫持續時間
  • 對使用者互動做出回應

適合對象

  • 尋求視覺魅力的UI設計師
  • 開發社交或訊息應用的開發者
  • 具有互動式個人資料元素的應用程式
  • 需要微妙動畫的項目
  • 專注於精緻的使用者體驗

使用建議

  • 可能影響低端裝置的效能
  • 發光效果可能不適合極簡設計
  • 需要仔細的色彩對比以確保可讀性
  • 動畫可能會在注重可訪問性的應用程式中造成干擾
  • 不適合靜態或非互動式內容

原始 README

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

Avatar Glow GitHub stars Twitter Follow GitHub last commit Website shields.ioOpen Source Love

An Avatar Glow Flutter Widget with cool background glowing animation.

Live Demo: https://apgapg.github.io/avatar_glow/

PieChart

💻 Installation

In the dependencies: section of your pubspec.yaml, add the following line:

Version

dependencies:
  avatar_glow: <latest version>

To use the latest changes:

  avatar_glow:
    git:
      url: https://github.com/apgapg/avatar_glow
      ref: master

❔ Usage

Import
import 'package:avatar_glow/avatar_glow.dart';

Usage is simple. Avatar Glow is a widget offering different customizable optional parameters with child displayed at its center.

Simple Implementation
AvatarGlow(
 endRadius: 60.0,
 child: Material(     // Replace this child with your own
   elevation: 8.0,
   shape: CircleBorder(),
   child: CircleAvatar(
     backgroundColor: Colors.grey[100],
     child: Image.asset(
       'assets/images/dart.png',
       height: 50,
     ),
     radius: 30.0,
   ),
 ),
),
Full Implementation
AvatarGlow(
  startDelay: const Duration(milliseconds: 1000),
  glowColor: Colors.white,
  glowShape: BoxShape.circle,
  animate: _animate,
  curve: Curves.fastOutSlowIn,
  child: const Material(
    elevation: 8.0,
    shape: CircleBorder(),
    color: Colors.transparent,
    child: CircleAvatar(
      backgroundImage: AssetImage('assets/images/avatar.png'),
      radius: 50.0,
    ),
  ),
),

⭐ My Flutter Packages

  • json_table GitHub stars Create Flutter Json Table from json map directly.
  • pie_chart GitHub stars Flutter Pie Chart with cool animation.
  • search_widget GitHub stars Flutter Search Widget for selecting an option from list.
  • animating_location_pin GitHub stars Flutter Animating Location Pin Widget providing Animating Location Pin Widget which can be used while fetching device location.

⭐ My Flutter Apps

👍 Contribution

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -m 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

所屬分類

原始碼儲存庫

使用此套件的專案