Enhancement on Signature

main_design2.0
zaid_daoud 2 years ago
parent 9c43eab5db
commit 3c91abf47d

@ -6,7 +6,6 @@ import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart'; import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/new_views/app_style/app_color.dart'; import 'package:test_sa/new_views/app_style/app_color.dart';
import '../../app_style/sizing.dart';
import '../loaders/image_loader.dart'; import '../loaders/image_loader.dart';
class ESignature extends StatefulWidget { class ESignature extends StatefulWidget {
@ -49,115 +48,111 @@ class _ESignatureState extends State<ESignature> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Column( return FormField<String>(onSaved: (_) async {
children: [ widget.onSaved(signature);
if (widget.oldSignature != null || signature != null) }, builder: (FormFieldState<String> state) {
return Column(
children: [
Container( Container(
width: MediaQuery.of(context).size.width, width: MediaQuery.of(context).size.width,
padding: const EdgeInsets.only(bottom: 8), padding: EdgeInsets.symmetric(horizontal: 16.toScreenWidth, vertical: 8.toScreenHeight),
height: 90 * AppStyle.getScaleFactor(context), decoration: BoxDecoration(
child: signature != null ? Image.memory(signature) : ImageLoader(boxFit: BoxFit.contain, url: widget.oldSignature), color: Colors.white,
), borderRadius: _editable ? const BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10)) : BorderRadius.circular(10),
FormField<String>(onSaved: (_) async { boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.05), blurRadius: 10)],
widget.onSaved(signature); ),
}, builder: (FormFieldState<String> state) { child: Column(
return Column( crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
Container( Row(
width: MediaQuery.of(context).size.width, crossAxisAlignment: CrossAxisAlignment.start,
padding: EdgeInsets.symmetric(horizontal: 16.toScreenWidth, vertical: 8.toScreenHeight), mainAxisAlignment: MainAxisAlignment.spaceBetween,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: _editable ? const BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10)) : BorderRadius.circular(10),
boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.05), blurRadius: 10)],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
Row( widget.title.tinyFont(context).paddingOnly(top: 8),
crossAxisAlignment: CrossAxisAlignment.start, (!_editable
mainAxisAlignment: MainAxisAlignment.spaceBetween, ? "edit".toSvgAsset(width: 48).paddingOnly(top: 8)
children: [ : Container(
widget.title.tinyFont(context).paddingOnly(top: 8), width: 48.toScreenWidth,
(!_editable height: 48.toScreenWidth,
? "edit".toSvgAsset(width: 48).paddingOnly(top: 8) decoration: BoxDecoration(borderRadius: BorderRadius.circular(100), border: Border.all(color: AppColor.neutral30)),
: Container( padding: const EdgeInsets.all(11),
width: 48.toScreenWidth, margin: const EdgeInsets.only(top: 8),
height: 48.toScreenWidth, child: "done".toSvgAsset(width: 26),
decoration: BoxDecoration(borderRadius: BorderRadius.circular(100), border: Border.all(color: AppColor.neutral30)), ))
padding: const EdgeInsets.all(11), .onPress(() async {
margin: const EdgeInsets.only(top: 8), if (_editable) {
child: "done".toSvgAsset(width: 26), signature = await _controller.toPngBytes();
)) if (widget.onChange != null) {
.onPress(() async { widget.onChange(signature);
if (_editable) { }
signature = await _controller.toPngBytes(); }
if (widget.onChange != null) { _editable = !_editable;
widget.onChange(signature); setState(() {});
} }),
}
_editable = !_editable;
setState(() {});
}),
],
),
AbsorbPointer(
absorbing: !_editable,
child: Signature(
controller: _controller,
height: 135.toScreenHeight,
width: MediaQuery.of(context).size.width - 64.toScreenWidth,
backgroundColor: Colors.transparent,
),
),
], ],
), ),
(widget.oldSignature != null || signature != null || !_editable)
? Container(
height: 135.toScreenHeight,
width: MediaQuery.of(context).size.width,
padding: const EdgeInsets.only(bottom: 8),
child: signature != null ? Image.memory(signature) : ImageLoader(boxFit: BoxFit.contain, url: widget.oldSignature),
)
: AbsorbPointer(
absorbing: !_editable,
child: Signature(
controller: _controller,
height: 135.toScreenHeight,
width: MediaQuery.of(context).size.width - 64.toScreenWidth,
backgroundColor: Colors.transparent,
),
),
],
),
),
if (_editable)
Container(
decoration: const BoxDecoration(
color: AppColor.neutral30,
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(10), bottomRight: Radius.circular(10)),
), ),
if (_editable) child: Row(
Container( children: [
decoration: const BoxDecoration( "clear".toSvgAsset(width: 14).paddingOnly(start: 16).onPress(() {
color: AppColor.neutral30, _controller.clear();
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(10), bottomRight: Radius.circular(10)), }),
), 35.width,
child: Row( "back".toSvgAsset(width: 17).onPress(() {
children: [ _controller.undo();
"clear".toSvgAsset(width: 14).paddingOnly(start: 16).onPress(() { }),
_controller.clear(); 27.width,
}), "redo".toSvgAsset(width: 17).onPress(() {
35.width, _controller.redo();
"back".toSvgAsset(width: 17).onPress(() { }),
_controller.undo(); // IconButton(
}), // onPressed: () {
27.width, // _unpaint = !_unpaint;
"redo".toSvgAsset(width: 17).onPress(() { // setState(() {});
_controller.redo(); // },
}), // icon: Icon(
// IconButton( // _unpaint ? Icons.draw : Icons.ac_unit,
// onPressed: () { // color: _unpaint ? AColors.orange : null,
// _unpaint = !_unpaint; // )),
// setState(() {}); // const Spacer(),
// }, // IconButton(
// icon: Icon( // onPressed: () async {
// _unpaint ? Icons.draw : Icons.ac_unit, // signature = await _controller.toPngBytes();
// color: _unpaint ? AColors.orange : null, // if (widget.onChange != null) {
// )), // widget.onChange(signature);
// const Spacer(), // }
// IconButton( // setState(() {});
// onPressed: () async { // },
// signature = await _controller.toPngBytes(); // icon: const Icon(Icons.check)),
// if (widget.onChange != null) { ],
// widget.onChange(signature); ).paddingOnly(top: 12, bottom: 12),
// } )
// setState(() {}); ],
// }, );
// icon: const Icon(Icons.check)), });
],
).paddingOnly(top: 12, bottom: 12),
)
],
);
}),
],
);
} }
} }

Loading…
Cancel
Save