Animated Text Kit

一个 Flutter 包，其中包含一些酷炫漂亮的文本动画集合。

安装

1. 依赖它

将此添加到您的包的 pubspec.yaml 文件中

dependencies:
  animated_text_kit: ^1.1.0

2. 安装它

您可以从命令行安装包

使用 pub

$ pub get

使用 Flutter

$ flutter packages get

3. 导入它

现在，在您的 Dart 代码中，您可以使用

import 'package:animated_text_kit/animated_text_kit.dart';

用法

您可以通过在每个AnimatedTextKit类中设置duration来覆盖每个动画的duration。例如

FadeAnimatedTextKit(
  duration: Duration(milliseconds: 5000),
  text: ["do IT!", "do it RIGHT!!", "do it RIGHT NOW!!!"],
  textStyle: TextStyle(fontSize: 32.0, fontWeight: FontWeight.bold),
);

旋转

Row(
  mainAxisSize: MainAxisSize.min,
  children: <Widget>[
    SizedBox(width: 20.0, height: 100.0),
    Text(
      "Be",
      style: TextStyle(fontSize: 43.0),
    ),
    SizedBox(width: 20.0, height: 100.0),
    RotateAnimatedTextKit(
      onTap: () {
        print("Tap Event");
      },
      text: ["AWESOME", "OPTIMISTIC", "DIFFERENT"],
      textStyle: TextStyle(fontSize: 40.0, fontFamily: "Horizon"),
    ),
  ],
);

注意：您可以通过为RotateAnimatedTextKit类设置transitionHeight参数的值来覆盖过渡高度。

淡入淡出

SizedBox(
  width: 250.0,
  child: FadeAnimatedTextKit(
    onTap: () {
        print("Tap Event");
      },
    text: [
      "do IT!",
      "do it RIGHT!!",
      "do it RIGHT NOW!!!"
    ],
    textStyle: TextStyle(
        fontSize: 32.0, 
        fontWeight: FontWeight.bold
    ),
  ),
);

打字机

SizedBox(
  width: 250.0,
  child: TyperAnimatedTextKit(
    onTap: () {
        print("Tap Event");
      },
    text: [
      "It is not enough to do your best,",
      "you must know what to do,",
      "and then do your best",
      "- W.Edwards Deming",
    ],
    textStyle: TextStyle(
        fontSize: 30.0,
        fontFamily: "Bobbers"
    ),
  ),
);

打字机

SizedBox(
  width: 250.0,
  child: TypewriterAnimatedTextKit(
    onTap: () {
        print("Tap Event");
      },
    text: [
      "Discipline is the best tool",
      "Design first, then code",
      "Do not patch bugs out, rewrite them",
      "Do not test bugs out, design them out",
    ],
    textStyle: TextStyle(
        fontSize: 30.0,
        fontFamily: "Agne"
    ),
  ),
);

缩放

SizedBox(
  width: 250.0,
  child: ScaleAnimatedTextKit(
    onTap: () {
        print("Tap Event");
      },
    text: [
      "Think",
      "Build",
      "Ship"
      ],
    textStyle: TextStyle(
        fontSize: 70.0,
        fontFamily: "Canterbury"
    ),
  ),
);

彩色化

SizedBox(
  width: 250.0,
  child: ColorizeAnimatedTextKit(
    onTap: () {
        print("Tap Event");
      },
    text: [
      "Larry Page",
      "Bill Gates",
      "Steve Jobs",
    ],
    textStyle: TextStyle(
        fontSize: 50.0, 
        fontFamily: "Horizon"
    ),
    colors: [
      Colors.purple,
      Colors.blue,
      Colors.yellow,
      Colors.red,
    ],
  ),
);

注意： colors列表应至少包含两个值，并且ColorizeAnimationTextKit可用于Flutter >=0.5.7，可在dev频道中使用。

错误或请求

如果您遇到任何问题，请随时在GitHub上打开一个错误报告。如果您觉得该库缺少某个功能，请在GitHub上提交一个功能请求，我会进行处理。也欢迎提交Pull Request。

GitHub

https://github.com/aagarwal1012/Animated-Text-Kit