【flutter】手动签名并且保存

1、插件

signature: ^2.0.0   #签名

2、测试页面

import 'dart:ui';

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

class Autograph extends StatefulWidget {
  @override
  _AutographState createState() => _AutographState();
}

class _AutographState extends State {
  var _signatureCanvas = Signature(
    height: 300,
    backgroundColor: Colors.lightBlueAccent,
  );

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Builder(
        builder: (context) => Scaffold(
          body: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              //SIGNATURE CANVAS
              _signatureCanvas,
              //OK AND CLEAR BUTTONS
              Container(
                  decoration: const BoxDecoration(
                    color: Colors.black,
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    mainAxisSize: MainAxisSize.max,
                    children: [
                      //SHOW EXPORTED IMAGE IN NEW ROUTE
                      IconButton(
                        icon: const Icon(Icons.check),
                        color: Colors.blue,
                        onPressed: () async {
                          if (_signatureCanvas.isNotEmpty) {
                            var data = await _signatureCanvas.exportBytes();
                            print("::::"+data.toString());
                            Navigator.of(context).push(
                              MaterialPageRoute(
                                builder: (BuildContext context) {
                                  return Scaffold(
                                    appBar: AppBar(),
                                    body: Container(
                                      color: Colors.grey[300],
                                      child: Image.memory(data),
                                    ),
                                  );
                                },
                              ),
                            );
                          }
                        },
                      ),
                      //CLEAR CANVAS
                      IconButton(
                        icon: const Icon(Icons.clear),
                        color: Colors.blue,
                        onPressed: () {
                          setState(() {
                            return _signatureCanvas.clear();
                          });
                        },
                      ),
                    ],
                  )),
            ],
          ),
        ),
      ),
    );
  }
}

你可能感兴趣的:(flutter)