搜尋分類、套件與程式碼儲存庫

scaled_list 封面
套件詳情v2.0.0

scaled_list

一個水平列表視圖,包含大量修改,包括縮放的當前項目和彎曲的自定義繪製。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
93
喜歡數
140
Pub 分數
150

安裝套件

flutter pub add scaled_list

套件介紹

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

Scaled List 是一個 Flutter 套件,提供水平可捲動的清單,具有視覺震撼的縮放當前項目與自訂曲線繪製效果。透過尺寸縮放與平滑動畫強調活躍項目,提升使用者體驗,非常適合用於幻燈片或封面流介面。此套件支援 Android、iOS、Web、macOS、Windows 與 Linux 多個平台,確保跨裝置行為一致。開發者可自訂外觀與互動,以最少努力實現創意 UI 設計。

適用情境

  • 建立互動式輪播
  • 設計封面流導航
  • 使用視覺焦點構建圖像滑塊
  • 增強產品展示
  • 實現動畫水平列表
  • 在使用者介面中加入動態項目縮放

主要特色

  • 縮放當前項目可視化
  • 自訂弧形畫作支援
  • 平滑的水平滾動
  • 跨平台相容性
  • 可擴展的自定義選項
  • 內建動畫過渡

適合對象

  • 尋求視覺衝擊力的UI設計師
  • 開發媒體畫廊的開發者
  • 需要聚焦項目高亮的應用
  • 互動式產品瀏覽功能
  • 具有幻燈片式導航的專案

使用建議

  • 可能需要在低階設備上進行效能調校
  • 自定繪畫可能會增加複雜性
  • 有限的垂直支援
  • 最適合水平佈局
  • 大型數據集的潛在記憶體使用

原始 README

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

Effective Dart Badge MIT License Badge

Pub.dev

Scaled List

A Horizontal List view With Lots of modification including a scaled current item.

  • Provided with curved custom painting and Dots indictor below it.
  • it makes the widget of item builder responsive to the device screen's width and height.
  • You can also set the relative width, margin width, height of selected and unselected Card to the entire screen

Image Image Image

Usage

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ScaledList(
        itemCount: Data.categories.length,
        itemColor: (index) {
          return kMixedColors[index % kMixedColors.length];
        },
        itemBuilder: (index, selectedIndex) {
          final category = Data.categories[index];
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Container(
                height: selectedIndex == index
                    ? 100
                    : 80,
                child: Image.asset(category.image),
              ),
              SizedBox(height: 15),
              Text(
                category.name,
                style: TextStyle(
                    color: Colors.white,
                    fontSize: selectedIndex == index
                        ? 25
                        : 20),
              )
            ],
          );
        },
      ),
    );
  }

Usage Scenarios

  • When You like to add items in scaled manner and add custom curved painting over each item.

Contributers

Hosain Mohamed Muhammad Alsaied

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。