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

iconify_design 封面
套件詳情v1.0.2

iconify_design

一個 Flutter 套件,可讓您輕鬆使用來自 iconify.design API 的圖標。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
1260
喜歡數
22
Pub 分數
160

安裝套件

flutter pub add iconify_design

套件介紹

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

Iconify Design 是一個 Flutter 套件,可簡化將 iconify.design API 的圖示整合至 Flutter 應用程式中的過程。它讓開發者能輕鬆搜尋、載入並顯示跨多個平台的數千個可縮放向量圖示。此套件支援動態圖示取得、主題感知呈現以及高效快取,以達成最佳效能。僅需最少設定,即可在不增加應用程式大小的情況下提升 UI 設計彈性。

適用情境

  • 在跨平台應用中整合可擴展圖示
  • 透過按需圖示減少資源包大小
  • 透過龐大的圖示庫增強使用者介面
  • 支援深色/淺色模式圖標變體
  • 建構響應式且可存取的介面

主要特色

  • 與 iconify.design API 的直接整合
  • 動態圖示載入與快取
  • 跨平台支援(Android、iOS、Web、macOS、Windows、Linux)
  • 輕量且模組化的設計
  • 自動主題圖示切換
  • 可搜尋的圖示目錄

適合對象

  • 尋求大型圖示庫的開發者
  • 需要可縮放矢量圖形的專案
  • 針對多個平台的應用程式
  • 希望靈活管理圖示的UI設計師
  • 重視效能與可維護性的團隊

使用建議

  • 需要互聯網連接以取得初始圖示
  • 如果一次載入大量圖示,可能會影響啟動時間
  • 依賴外部API的可用性
  • 與本地資產相比,自定義選項有限
  • 在慢速網絡上取得圖示時可能出現延遲

原始 README

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

Iconify Design

A Flutter package that allows you to use icons from the Iconify.design API with ease. This package provides a widget called IconifyIcon that takes an icon string and optionally allows you to specify the size, color, placeholder, and error widget of the icon.

iconify-design

Installation

Add the following to your pubspec.yaml file:

dependencies:
  iconify_design: ^1.0.2

Then run:

flutter pub get
Usage
import 'package:iconify_design/iconify_design.dart';
import 'package:flutter/material.dart';
Example

Here is an example of how to use the IconifyIcon widget:

import 'package:flutter/material.dart';
import 'package:iconify_design/iconify_design.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Iconify Flutter Example'),
        ),
        body: Center(
          child: IconifyIcon(
            icon: 'mdi:home',
            size: 48.0,
            color: Colors.blue,
            placeholder: CircularProgressIndicator(),
            errorWidget: Icon(
              Icons.error_outline,
              color: Colors.red,
            ),
          ),
        ),
      ),
    );
  }
}
Parameters

The IconifyIcon widget has the following parameters:

  1. icon: The icon string (e.g., 'mdi:home', 'iconoir:fill-color-solid', etc.).
  2. size (optional): The size of the icon. Default is 24.0.
  3. color (optional): The color of the icon. Default is Black. Passing null also falls back to Black.
  4. placeholder (optional): The widget to display while the icon is loading. Default is a small circular progress indicator.
  5. errorWidget (optional): The widget to display when the icon cannot be loaded. Default is an empty widget.
Custom Placeholder and Error Widget

You can customize the loading and error states:

IconifyIcon(
  icon: 'mdi:home',
  placeholder: const SizedBox(
    width: 24,
    height: 24,
    child: CircularProgressIndicator(strokeWidth: 2),
  ),
  errorWidget: const Icon(
    Icons.error_outline,
    color: Colors.red,
  ),
)
Contribution

Feel free to open issues or submit pull requests to help improve this package.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Support

Don't forget to support (if you can).

"Buy Me A Coffee"

Maintainers

所屬分類

依賴

依賴清單 4 項

原始碼儲存庫

使用此套件的專案

暫無相關資料。