Flutter输入字段的格式化和模式匹配插件muskey的使用

Muskey 是一个轻量级的 Flutter 插件，主要用于输入字段的格式化和模式匹配。它支持多种掩码（masks）、智能光标定位以及灵活的自定义配置。以下是该插件的一些主要特性和示例代码。

快速入门

假设你需要在登录或注册页面中对电话号码进行格式化，Muskey 可以帮助你实现这一需求：

TextField(
  inputFormatters: [
    MuskeyFormatter.countryPhoneMasks(
      allowOverflowingInputs: true,
    ),
  ],
)

这段代码会自动根据用户输入的内容动态切换不同的电话号码格式，并保持良好的用户体验。

自定义功能

掩码（Masks）

你可以为信用卡号创建自定义格式：

TextField(
  inputFormatters: [
    MuskeyFormatter(
      masks: ['#### #### #### ####'],
      overflow: OverflowBehavior.forbidden(),
    ),
  ],
)

通配符和装饰器（Wildcards and Decorators）

你可以指定哪些符号在掩码中作为通配符或装饰符：

TextField(
  inputFormatters: [
    MuskeyFormatter(
      masks: ['%^##-####-####-####'],
      decorators: ['-'],
      wildcards: {
        '%': RegExp('[4-6]'),
        '^': RegExp('[1-2]')
      },
      overflow: OverflowBehavior.forbidden(),
    ),
  ],
)

这将确保输入的第一个数字是4、5或6，第二个数字是1或2。

字符转换（Character Transforms）

你可以定义字符转换规则，在输入时应用这些规则：

TextField(
  inputFormatters: [
    MuskeyFormatter(
      masks: ['@@@@@'],
      wildcards: {'@': RegExp('[a-zA-Z]')},
      transforms: {'@': (s) => s.toUpperCase()},
      overflow: OverflowBehavior.forbidden(),
    ),
  ],
)

溢出处理（Overflow）

你可以控制是否允许超出掩码长度的输入：

MuskeyFormatter(
  masks: [
    "+49 (####) ###-####",
    "+49 (###) ###-####",
    "+49 (###) ##-####",
    "+49 (###) ##-###",
    "+49 (###) ##-##",
    "+49-###-###",
  ],
  overflow: OverflowBehavior(
    allowed: overflowAllowed,
    overflowOn: RegExp('[0-9]'),
  ),
)

自动填充（Autofill）

你可以启用自动填充功能，以便快速填充预定义值：

MuskeyFormatter(
  masks: ["+380 (##) ###-##-##"],
  allowAutofill: true,
);

示例 Demo

以下是一个完整的示例项目，展示了如何使用 Muskey 进行多种输入格式化：

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Muskey Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  [@override](/user/override)
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final muskey = MuskeyFormatter(
    masks: ['#### #### #### ####'],
    overflow: OverflowBehavior.forbidden(),
  );

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Muskey Demo'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: <Widget>[
            TextField(
              inputFormatters: [muskey],
              keyboardType: TextInputType.number,
              decoration: InputDecoration(
                labelText: 'Credit Card Number',
              ),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: muskey.info.isValid ? () {} : null,
              child: Text('Submit'),
            ),
          ],
        ),
      ),
    );
  }
}