Flutter文本转换插件TransformText的使用

TransformText 是一个用于在文本变化时生成文本动画的 Stateful Widget。它可以帮助你实现一些有趣的文字动画效果。

安装

1. 添加依赖

在你的项目的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  transform_text: ^1.0.0

2. 获取依赖

你可以通过命令行来获取包：

使用 pub：

$ pub get

或者使用 Flutter：

$ flutter pub get

3. 导入库

在你的 Dart 代码中导入 TransformText 库：

import 'package:transform_text/transform_text.dart';

使用方法

首先，你需要创建一个包含 TransformText 的应用。下面是一个简单的示例：

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:transform_text/transform_text.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  Timer? timer;
  String currentTime = "";
  DateFormat f = DateFormat("yyyy-MM-dd h:mm:ss a");
  int counter = 0;
  bool isIncrement = true;
  bool isCheckin = true;

  void toggleCheckin() {
    setState(() {
      isCheckin = !isCheckin;
    });
  }

  void increment() {
    setState(() {
      isIncrement = true;
      counter++;
    });
  }

  void decrement() {
    setState(() {
      isIncrement = false;
      counter--;
    });
  }

  [@override](/user/override)
  void initState() {
    timer = Timer.periodic(const Duration(seconds: 1), (timer) {
      setState(() {
        currentTime = f.format(DateTime.now());
      });
    });
    super.initState();
  }

  [@override](/user/override)
  void dispose() {
    if (timer != null) {
      timer!.cancel();
    }
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("TransformText"),
          backgroundColor: Colors.blue,
        ),
        body: SingleChildScrollView(
          child: Center(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                _buildRow(
                  "TransformTextType.scrollUp",
                  child: TransformText(currentTime),
                ),
                _buildRow(
                  "TransformTextType.scaleIn",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.scaleIn,
                  ),
                ),
                _buildRow(
                  "TransformTextType.scaleOut",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.scaleOut,
                  ),
                ),
                _buildRow(
                  "TransformTextType.scrollDown",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.scrollDown,
                  ),
                ),
                _buildRow(
                  "TransformTextType.fade",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.fade,
                  ),
                ),
                _buildRow(
                  "TransformTextType.fallDown",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.fallDown,
                  ),
                ),
                _buildRow(
                  "TransformTextType.up",
                  child: TransformText(
                    currentTime,
                    type: TransformTextType.up,
                  ),
                ),
                Row(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Column(
                      children: [
                        TransformText(
                          isIncrement ? "Increment" : "Decrement",
                          type: TransformTextType.fallDown,
                        ),
                        Row(
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            TransformText(
                              "$counter",
                              type: !isIncrement
                                  ? TransformTextType.scrollUp
                                  : TransformTextType.scrollDown,
                            ),
                            IconButton(
                              onPressed: decrement,
                              icon: const Icon(Icons.remove),
                            ),
                            IconButton(
                              onPressed: increment,
                              icon: const Icon(Icons.add),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildRow(String label, {required Widget child}) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 16),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Text("$label: "),
          child,
        ],
      ),
    );
  }
}