搜索插件、代码仓与 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.

所属分类

源码仓库

使用此插件的项目