Flutter渐变文本展示插件gradient_text_widget的使用

Flutter渐变文本展示插件gradient_text_widget的使用

GradientTextWidget 示例

GradientTextWidget(
  "This is a test text for GradientTextWidget widget.",
  showGradient: true,
  enableGradient: true,
// gradientColor: Colors.amberAccent,
// gradientColors: [
//   Color.fromARGB(31, 234, 9, 123),
//   Color.fromARGB(180, 234, 9, 123),
//   Color.fromARGB(255, 234, 9, 123)
// ],
  logicWidth: Get.width - 40.rpx,
  textColor: Color(0xFF000000),
)

开始使用

本项目是一个用于 Flutter 的插件包，包含针对 Android 和/或 iOS 的平台特定实现代码。

示例代码

以下是一个完整的示例，展示了如何在 Flutter 应用中使用 GradientTextWidget 插件：

import 'dart:ui'; // 导入基础库
import 'package:flutter/material.dart'; // 导入 Flutter 基础库
import 'package:flutter/services.dart'; // 导入系统服务库
import 'package:gradient_text_widget/gradient_text_widget.dart'; // 导入渐变文本插件

void main() {
  runApp(MyApp()); // 运行应用
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState(); // 创建状态类
}

class _MyAppState extends State<MyApp> {
  String _platformVersion = 'Unknown'; // 初始化平台版本

  [@override](/user/override)
  void initState() {
    super.initState(); // 初始化状态
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('渐变文本插件示例'), // 设置应用栏标题
        ),
        body: Center(
          child: GradientTextWidget(
            "这是渐变文本插件的示例文本", // 文本内容
            showGradient: true, // 显示渐变效果
            enableGradient: true, // 启用渐变效果
            gradientColors: [
              Color.fromARGB(31, 234, 9, 123), // 定义渐变颜色
              Color.fromARGB(180, 234, 9, 123),
              Color.fromARGB(255, 234, 9, 123)
            ],
            logicWidth: MediaQuery.of(context).size.width - 40, // 宽度计算
            textColor: Color(0xFF111111), // 文本颜色
          ),
        ),
      ),
    );
  }
}

代码解释

1. 导入必要的库:

   import 'dart:ui';
   import 'package:flutter/material.dart';
   import 'package:flutter/services.dart';
   import 'package:gradient_text_widget/gradient_text_widget.dart';
   

2. 定义主应用类:

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

3. 创建状态类并初始化状态:

   class MyApp extends StatefulWidget {
     [@override](/user/override)
     _MyAppState createState() => _MyAppState();
   }
   
   class _MyAppState extends State<MyApp> {
     String _platformVersion = 'Unknown';
   
     [@override](/user/override)
     void initState() {
       super.initState();
     }
   

4. 构建应用界面:

   [@override](/user/override)
   Widget build(BuildContext context) {
     return MaterialApp(
       home: Scaffold(
         appBar: AppBar(
           title: const Text('渐变文本插件示例'),
         ),
         body: Center(
           child: GradientTextWidget(
             "这是渐变文本插件的示例文本",
             showGradient: true,
             enableGradient: true,
             gradientColors: [
               Color.fromARGB(31, 234, 9, 123),
               Color.fromARGB(180, 234, 9, 123),
               Color.fromARGB(255, 234, 9, 123)
             ],
             logicWidth: MediaQuery.of(context).size.width - 40,
             textColor: Color(0xFF111111),
           ),
         ),
       ),
     );
   }