Flutter自定义签名插件custom_signature的使用

这个包项目提供了一种简单的方式来获取带有自定义UI的签名，并自动旋转到最舒适的横屏模式以便签名。

使用

以下是一个使用 CustomSignature 的示例代码：

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

void main() => runApp(const MyApp());

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Example',
      home: FirstPage(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          child: const Text('To sign'),
          onPressed: () async {
            await Navigator.push(
              context,
              MaterialPageRoute(
                builder: (BuildContext context) => CustomSignature(
                  context: context,
                  title: 'Signature',
                  closeButtonColor: Colors.indigo,
                  icon: Icons.close,
                  enabledButtonColor: Colors.green,
                  disabledButtonColor: Colors.lightGreen.withOpacity(0.5),
                  penColor: Colors.black,
                  titleStyle: const TextStyle(
                    fontWeight: FontWeight.w400,
                    fontSize: 16,
                  ),
                  buttonTextStyle: const TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.w600,
                  ),
                  textColor: Colors.black,
                  deleteButtonText: 'Delete',
                  doneButtonText: 'Done',
                  closeAlert: AlertDialog(
                    content: const Text('Do you want to exit?'),
                    actions: [
                      ElevatedButton(
                        child: const Text('Ok'),
                        onPressed: () {
                          Navigator.pop(context);
                          Navigator.pop(context);
                        },
                      ),
                      MaterialButton(
                        onPressed: () => Navigator.pop(context),
                        child: const Text('No'),
                      ),
                    ],
                  ),
                ),
              ),
            ).then((value) {
              if (value != null) {
                // 显示签名
                showDialog(
                  context: context,
                  builder: (_) {
                    return AlertDialog(
                      actions: [
                        TextButton(
                          onPressed: () => Navigator.pop(context),
                          child: const Text('Close'),
                        )
                      ],
                      title: const Text('Signature'),
                      content: Image.memory(value),
                    );
                  },
                );
              }
            });
          },
        ),
      ),
    );
  }
}

其他信息

建议导航到的屏幕具有配置了首选方向的状态小部件，以恢复默认方向（纵向）。

SystemChrome.setPreferredOrientations([
  DeviceOrientation.portraitUp,
  DeviceOrientation.portraitDown,
]);