Flutter功能扩展插件mint_flutter_extensions的使用

通过减少样板代码，使用易于使用的扩展功能加速您的Flutter开发流程。

安装

在终端中运行以下命令以安装插件：

flutter pub add mint_flutter_extensions

或者，在pubspec.yaml文件中添加依赖项：

dependencies:
  mint_flutter_extensions: ^0.0.2 # 使用pub.dev上的最新版本

开始使用

在Dart代码中导入扩展功能：

import 'package:mint_flutter_extensions/mint_flutter_extensions.dart';

使用方法

颜色

从BuildContext获取colorScheme，使用以下代码：

context.colorScheme

获取主颜色，使用以下代码：

context.primaryColor

可用的颜色包括：

• primaryColor
• onPrimaryColor
• primaryContainerColor
• onPrimaryContainerColor
• secondaryColor
• onSecondaryColor
• secondaryContainerColor
• onSecondaryContainerColor
• tertiaryColor
• onTertiaryColor
• tertiaryContainerColor
• onTertiaryContainerColor
• errorColor
• onErrorColor
• errorContainerColor
• onErrorContainerColor
• surfaceColor
• onSurfaceColor

文本样式

从BuildContext获取textTheme，使用以下代码：

context.textTheme

获取H1文本样式，使用以下代码：

context.h1

可用的文本样式包括：

• displayLarge
• displayMedium
• displaySmall
• headlineLarge
• headlineMedium
• headlineSmall
• titleLarge
• titleMedium
• titleSmall
• bodyLarge
• bodyMedium
• bodySmall
• labelLarge
• labelMedium
• labelSmall
• h1
• h2
• h3
• h4
• h5
• h6
• subtitle1
• subtitle2
• body1
• body2
• caption
• button
• overline

文本样式属性

从TextStyle应用粗体样式，使用以下代码：

textStyle.bold

可用的样式包括：

• italic
• bold
• underline
• overline
• lineThrough
• normal
• tint(Color color, [ bool tintDecoration = true, ])

文本主题

将颜色应用于TextTheme，使用以下代码：

textTheme.tint(Colors.red)

将字体家族应用于TextTheme，使用以下代码：

textTheme.fontFamily('MonaspaceKrypton')

示例代码

以下是一个完整的示例代码，展示了如何使用mint_flutter_extensions插件：

import 'package:flutter/material.dart';
import 'package:mint_flutter_extensions/mint_flutter_extensions.dart';

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Mint Flutter Extensions 示例',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.green,
        ),
        textTheme: Typography.englishLike2021
            .fontFamily('MonaspaceKrypton')
            .tint(Colors.black87),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: '主页'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({
    super.key,
    required this.title,
  });

  final String title;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: context.primaryColor,
        title: Text(
          title,
          style: TextStyle(
            color: context.onPrimaryColor,
          ),
        ),
      ),
      body: Container(
        padding: const EdgeInsets.all(20),
        alignment: Alignment.topCenter,
        child: ListView(
          children: [
            Text(
              '这是一段普通文本',
              style: context.body1,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段斜体文本',
              style: context.body1.italic,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段粗体文本',
              style: context.body1.bold,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段下划线文本',
              style: context.body1.underline,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段删除线文本',
              style: context.body1.lineThrough,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段上划线文本',
              style: context.body1.overline,
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段带下划线的着色文本',
              style: context.body1.underline.tint(context.errorColor),
            ),
            const SizedBox(
              height: 20,
            ),
            Text(
              '这是一段带未着色下划线的文本',
              style: context.body1.underline.tint(
                context.primaryColor,
                false,
              ),
            ),
          ],
        ),
      ),
    );
  }
}