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

marquee_widget 封面
套件詳情v1.2.0

marquee_widget

一個可捲動的 Flutter 小部件,支援 RTL 的 Widget 文字和其他小部件。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
4580
喜歡數
68
Pub 分數
140

安裝套件

flutter pub add marquee_widget

套件介紹

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

marquee_widget 是一個 Flutter 套件,可實現水平捲動文字和其他元件,支援從右到左(RTL)佈局。它非常適合在有限空間內顯示長內容,例如標題或通知。該元件能平滑地在螢幕上動畫顯示內容,確保可讀性與視覺吸引力。它可在所有主要平台(包括 Android、iOS、Web、macOS、Windows 和 Linux)上運作,具有高度的多功能性。設計時著重於簡單性,可輕鬆整合至現有的 Flutter 應用中,無需複雜設定。該套件由社群積極維護且開源,允許社群貢獻。

適用情境

  • 在新聞應用中顯示長標題
  • 顯示進行中的通知或警告
  • 在儀表板中動畫顯示滾動文字
  • 支援阿拉伯語和希伯來語等從右到左的語言
  • 在自助服務終端或數位標牌中建立動態使用者介面元素

主要特色

  • 平滑的水平滾動動畫
  • 完整的 RTL 語言支援
  • 跨平台相容性
  • 輕鬆整合至現有的 Flutter 程式碼
  • 可自訂的速度和延遲設定
  • 支援任何 widget,不只限於文字

適合對象

  • 開發多語言應用程式的開發者
  • 需要動畫文字效果的設計師
  • 需要緊湊顯示長篇內容的應用程式
  • 自助服務終端或公共資訊系統
  • 即時資料儀表板

使用建議

  • 可能影響非常長內容的效能
  • 需要仔細調整捲動速度以確保可讀性
  • 不適用於靜態文字顯示
  • 超出基本參數的自定義選項有限
  • 最好少量使用,以避免分散使用者注意力

原始 README

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

marquee_widget

A Flutter widget that scrolls Widget Text and other Widget with supported RTL. Provides many customizationsincluding custom scroll directions and velocities, pausing after every round and specifying custom durations and curves for accelerating and decelerating.

Usage

This is a minimalistic example:

Marquee(
  child:Text( 'This project is a starting point for a Dart package, a library module containing code that can be shared easily across multiple Flutter or Dart projects. '),
)

And here's a piece of code that makes full use of the marquee's customizability:

set Width and Height with Continer()

Marquee(
  child:Text( 'This project is a starting point for a Dart package'),
  scrollAxis: Axis.horizontal,
  textDirection : TextDirection.rtl,
  animationDuration: Duration(seconds: 1),
  backDuration: Duration(milliseconds: 5000),
  pauseDuration: Duration(milliseconds: 2500),
  directionMarguee: DirectionMarguee.oneDirection,

)

Exmpale

GridView.count(
        crossAxisCount: 2,
        childAspectRatio: 0.7,
        children: <Widget>[
          GridTile(
            child: Card(
              child: Column(
                children: <Widget>[
                  Expanded(
                      child: Image.network(
                    "https://i.pinimg.com/564x/9d/a6/36/9da636b9e60ea40b18921b0053b7d486.jpg",
                    fit: BoxFit.fitHeight,
                  )),
                  Marquee(
                      child: Text(
                    "Flutter is a free and open source Google mobile UI ",
                    style: TextStyle(fontSize: 16),
                  )),
                ],
              ),
            ),
          ),
          GridTile(
            child: Card(
              child: Column(
                children: <Widget>[
                  Expanded(
                      child: Image.network(
                    "https://cdn-images-1.medium.com/max/1000/1*upTyVPOfBb0c4o1r57C9_w.png",
                    fit: BoxFit.fitHeight,
                  )),
                  Marquee(
                      child: Text(
                    "Flutter is a free and open source Google mobile UI ",
                    style: TextStyle(fontSize: 16),
                  )),
                ],
              ),
            ),
          ),
          GridTile(
            child: Card(
              child: Column(
                children: <Widget>[
                  Expanded(
                      child: Marquee(
                          child: Container(
                              width: 1000,
                              child: Image.network(
                                "https://i.pinimg.com/564x/9d/a6/36/9da636b9e60ea40b18921b0053b7d486.jpg",
                                fit: BoxFit.fitWidth,
                              )))),
                  Marquee(
                      child: Text(
                    "Flutter is a free and open source Google mobile UI ",
                    style: TextStyle(fontSize: 16),
                  )),
                ],
              ),
            ),
          ),
          GridTile(
            child: Card(
              child: Column(
                children: <Widget>[
                  Marquee(
                      child: Container(width: 1000,
                        child: Column(
                    children: <Widget>[
                        Marquee(
                            child: Container(
                                width: 1000,height: 260,
                                child: Image.network(
                                  "https://cdn-images-1.medium.com/max/1000/1*upTyVPOfBb0c4o1r57C9_w.png",
                                  fit: BoxFit.fitWidth,
                                ))),
                        Text(
                          "Flutter is a free and open source Google mobile UI ",
                          style: TextStyle(fontSize: 16),
                        ),
                    ],
                  ),
                      )),
                ],
              ),
            ),
          ),
        ],
      ),

LICENSE

Copyright (c) 2018 Marcel Garus

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

所屬分類

原始碼儲存庫

使用此套件的專案