alipay_qr_code_dialog.dart 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter_screenutil/flutter_screenutil.dart';
  3. import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
  4. import 'package:get/get.dart';
  5. import 'package:location/resource/assets.gen.dart';
  6. import 'package:location/resource/colors.gen.dart';
  7. import 'package:location/resource/string.gen.dart';
  8. import 'package:webview_flutter/webview_flutter.dart';
  9. class AlipayQrCodeDialog {
  10. static const String _tag = 'AlipayQrCodeDialog';
  11. static void show(
  12. {required String qrCodeHtml,
  13. required String orderId,
  14. VoidCallback? onDismiss,
  15. VoidCallback? onCloseCallback,
  16. VoidCallback? loadSuccessCallback}) {
  17. SmartDialog.show(
  18. tag: _tag,
  19. onDismiss: onDismiss,
  20. backDismiss: false,
  21. builder: (_) {
  22. return AlipayQrCodeView(
  23. qrCodeHtml: qrCodeHtml,
  24. orderId: orderId,
  25. onCloseCallback: onCloseCallback,
  26. loadSuccessCallback: loadSuccessCallback);
  27. },
  28. clickMaskDismiss: false);
  29. }
  30. static void dismiss() {
  31. SmartDialog.dismiss(tag: _tag);
  32. }
  33. }
  34. class AlipayQrCodeView extends Dialog {
  35. final String qrCodeHtml;
  36. final String orderId;
  37. VoidCallback? loadSuccessCallback;
  38. VoidCallback? onCloseCallback;
  39. final WebViewController webViewController = WebViewController();
  40. AlipayQrCodeView(
  41. {super.key,
  42. required this.qrCodeHtml,
  43. required this.orderId,
  44. this.onCloseCallback,
  45. this.loadSuccessCallback});
  46. @override
  47. Widget build(BuildContext context) {
  48. return IntrinsicHeight(
  49. child: Column(
  50. children: [
  51. Container(
  52. padding: EdgeInsets.all(26.w),
  53. decoration: BoxDecoration(
  54. color: Colors.white,
  55. borderRadius: BorderRadius.circular(10.w),
  56. ),
  57. child: Column(
  58. children: [
  59. SizedBox(
  60. width: 220.w,
  61. height: 220.w,
  62. child: WebViewWidget(
  63. controller: webViewController
  64. ..loadHtmlString(getHtmlTemplate())
  65. ..setJavaScriptMode(JavaScriptMode.unrestricted)
  66. ..setNavigationDelegate(NavigationDelegate(
  67. onPageFinished: (String url) {
  68. // 使用 CSS 放大页面内容
  69. final scaleFactor = Get.width / 45.w;
  70. webViewController.runJavaScript('''
  71. document.body.style.transform = "scale($scaleFactor)";
  72. document.body.style.transformOrigin = "0 0";
  73. document.body.style.touchAction = 'none';
  74. document.documentElement.style.overscrollBehavior = 'none';
  75. ''');
  76. loadSuccessCallback?.call();
  77. loadSuccessCallback = null;
  78. },
  79. )),
  80. ),
  81. ),
  82. SizedBox(height: 16.w),
  83. Text(StringName.alipayQrCodeTips,
  84. style: TextStyle(fontSize: 14.sp, color: ColorName.black90))
  85. ],
  86. ),
  87. ),
  88. SizedBox(height: 20.w),
  89. GestureDetector(
  90. onTap: () {
  91. onCloseCallback?.call();
  92. AlipayQrCodeDialog.dismiss();
  93. },
  94. child: Assets.images.iconMemberRetainClose
  95. .image(width: 32.w, height: 32.w))
  96. ],
  97. ),
  98. );
  99. }
  100. String getHtmlTemplate() {
  101. return '''
  102. <!DOCTYPE html><html lang=\"en\">
  103. <head><meta charset=\"UTF-8\"/>
  104. <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"/>
  105. <title>Alipay QR Code</title>
  106. </head>
  107. <body>$qrCodeHtml</body>
  108. </html>
  109. ''';
  110. }
  111. }