[feat]亲密度分析，封装渐变色文字按钮组件

lib/module/intimacy_analyse/intimacy_analyse_upload/dialog/direction/custom_direction_edit_view.dart

@@ -5,6 +5,7 @@ import 'package:keyboard/base/base_view.dart';
 import 'package:keyboard/module/intimacy_analyse/intimacy_analyse_upload/dialog/direction/custom_direction_edit_controller.dart';
 import 'package:keyboard/resource/assets.gen.dart';
 import 'package:keyboard/resource/colors.gen.dart';
+import 'package:keyboard/widget/gradient_btn.dart';
 
 import '../../../../../resource/string.gen.dart';
 
@@ -151,34 +152,13 @@ class CustomDirectionEditView extends BaseView<CustomDirectionEditController> {
 
   /// 保存按钮
   Widget _buildSaveBtn() {
-    return GestureDetector(
-      onTap: () {
-        controller.doOnSave(onSaveCallback);
-      },
-      child: Container(
-        padding: EdgeInsets.symmetric(vertical: 14.h),
-        width: double.maxFinite,
-        decoration: ShapeDecoration(
-          // 渐变背景
-          gradient: LinearGradient(
-            colors: [ColorName.purpleGradient3, ColorName.purpleGradient4],
-            begin: Alignment.centerLeft,
-            end: Alignment.centerRight,
-          ),
-          shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(50.r),
-          ),
-        ),
-        child: Center(
-          child: Text(
-            StringName.save,
-            style: TextStyle(
-              color: ColorName.white,
-              fontSize: 16.sp,
-              fontWeight: FontWeight.w500,
-            ),
-          ),
-        ),
+    return SizedBox(
+      width: double.infinity,
+      child: GradientTextBtn(
+        StringName.save,
+        onPressed: () {
+          controller.doOnSave(onSaveCallback);
+        },
       ),
     );
   }

lib/module/intimacy_analyse/intimacy_analyse_upload/intimacy_analyse_upload_page.dart

@@ -471,7 +471,7 @@ class IntimacyAnalyseUploadPage
   /// 推荐的亲密关系
   Widget _buildRecommendIntimacy() {
     return Container(
-      width: double.maxFinite,
+      width: double.infinity,
       margin: EdgeInsets.only(left: 14.w, right: 14.w),
       // 圆角背景
       decoration: BoxDecoration(

lib/module/intimacy_analyse/screenshot_reply/conversation_analysis/conversation_analysis_view.dart

@@ -9,6 +9,7 @@ import '../../../../data/bean/option_select_item.dart';
 import '../../../../resource/assets.gen.dart';
 import '../../../../resource/colors.gen.dart';
 import '../../../../resource/string.gen.dart';
+import '../../../../widget/gradient_btn.dart';
 import '../../intimacy_analyse_upload/widget/upload_nine_grid.dart';
 import '../../widget/option_select_widget.dart';
 import '../../widget/step/upload_step_card.dart';
@@ -433,36 +434,10 @@ class ConversationAnalysisView
     required String btnText,
     required VoidCallback onPressed,
   }) {
-    return GestureDetector(
-      onTap: () {
-        onPressed();
-      },
-      child: Container(
-        margin: EdgeInsets.symmetric(horizontal: 16.w),
-        padding: EdgeInsets.symmetric(vertical: 14.h),
-        width: double.maxFinite,
-        decoration: ShapeDecoration(
-          // 渐变背景
-          gradient: LinearGradient(
-            colors: [ColorName.purpleGradient3, ColorName.purpleGradient4],
-            begin: Alignment.centerLeft,
-            end: Alignment.centerRight,
-          ),
-          shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(50.r),
-          ),
-        ),
-        child: Center(
-          child: Text(
-            btnText,
-            style: TextStyle(
-              color: ColorName.white,
-              fontSize: 16.sp,
-              fontWeight: FontWeight.w500,
-            ),
-          ),
-        ),
-      ),
+    return Container(
+      margin: EdgeInsets.symmetric(horizontal: 16.w),
+      width: double.infinity,
+      child: GradientTextBtn(btnText, onPressed: onPressed),
     );
   }
 

lib/module/intimacy_analyse/screenshot_reply/scan_image_reply/scan_image_reply_view.dart

@@ -13,6 +13,7 @@ import '../../../../resource/string.gen.dart';
 import '../../../../utils/prefix_util.dart';
 import '../../../../utils/upload/file_data_source_util.dart';
 import '../../../../widget/actionbtn/action_btn.dart';
+import '../../../../widget/gradient_btn.dart';
 import '../../../../widget/gradient_text.dart';
 import '../../image_viewer/image_viewer_page.dart';
 import '../../intimacy_analyse_upload/popup/reply_mode_select_popup.dart';
@@ -468,69 +469,28 @@ class ScanImageReplyView extends BaseView<ScanImageReplyController> {
 
   /// 上传截图按钮
   Widget _buildUploadScreenshotBtn(BuildContext context) {
-    return GestureDetector(
-      onTap: () {
-        controller.clickUploadScreenshotBtn(context);
-      },
-      child: Container(
-        margin: EdgeInsets.symmetric(horizontal: 16.w),
-        padding: EdgeInsets.symmetric(vertical: 14.h),
-        width: double.maxFinite,
-        decoration: ShapeDecoration(
-          // 渐变背景
-          gradient: LinearGradient(
-            colors: [ColorName.purpleGradient3, ColorName.purpleGradient4],
-            begin: Alignment.centerLeft,
-            end: Alignment.centerRight,
-          ),
-          shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(50.r),
-          ),
-        ),
-        child: Center(
-          child: Text(
-            StringName.intimacyUploadScreenshot,
-            style: TextStyle(
-              color: ColorName.white,
-              fontSize: 16.sp,
-              fontWeight: FontWeight.w500,
-            ),
-          ),
-        ),
+    return Container(
+      margin: EdgeInsets.symmetric(horizontal: 16.w),
+      width: double.maxFinite,
+      child: GradientTextBtn(
+        StringName.intimacyUploadScreenshot,
+        onPressed: () {
+          controller.clickUploadScreenshotBtn(context);
+        },
       ),
     );
   }
 
   /// 获取回复按钮
   Widget _buildGetReplayBtn() {
-    return GestureDetector(
-      onTap: () {
-        controller.clickGetReplyBtn();
-      },
-      child: Container(
-        padding: EdgeInsets.symmetric(vertical: 14.h),
-        width: double.maxFinite,
-        decoration: ShapeDecoration(
-          // 渐变背景
-          gradient: LinearGradient(
-            colors: [ColorName.purpleGradient3, ColorName.purpleGradient4],
-            begin: Alignment.centerLeft,
-            end: Alignment.centerRight,
-          ),
-          shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(50.r),
-          ),
-        ),
-        child: Center(
-          child: Text(
-            StringName.intimacyAnalyseGetReply,
-            style: TextStyle(
-              color: ColorName.white,
-              fontSize: 16.sp,
-              fontWeight: FontWeight.w500,
-            ),
-          ),
-        ),
+    return Container(
+      padding: EdgeInsets.symmetric(vertical: 14.h),
+      width: double.maxFinite,
+      child: GradientTextBtn(
+        StringName.intimacyAnalyseGetReply,
+        onPressed: () {
+          controller.clickGetReplyBtn();
+        },
       ),
     );
   }
@@ -609,12 +569,7 @@ class ScanImageReplyView extends BaseView<ScanImageReplyController> {
       // 上传页，显示上传截图按钮
       return Container(
         width: double.maxFinite,
-        margin: EdgeInsets.only(
-          left: 16.w,
-          top: 8.h,
-          right: 16.w,
-          bottom: 20.h,
-        ),
+        margin: EdgeInsets.only(top: 8.h, bottom: 20.h),
         child: _buildUploadScreenshotBtn(context),
       );
     } else {

lib/widget/gradient_btn.dart

@@ -0,0 +1,121 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+import '../resource/colors.gen.dart';
+
+/// 渐变色按钮
+class GradientBtn extends StatelessWidget {
+  /// 纯色颜色
+  final Color? color;
+
+  /// 渐变颜色参数
+  final List<Color> colors;
+
+  /// 渐变方向
+  final AlignmentGeometry begin;
+  final AlignmentGeometry end;
+
+  /// 按钮圆角半径
+  final double radius;
+
+  /// 子组件
+  final Widget child;
+
+  /// 点击回调
+  final VoidCallback onPressed;
+
+  const GradientBtn({
+    super.key,
+    required this.colors,
+    this.color,
+    this.begin = Alignment.centerLeft,
+    this.end = Alignment.centerRight,
+    this.radius = 50,
+    required this.child,
+    required this.onPressed,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    Decoration decoration;
+    // 优先使用纯色，如果没有纯色，则使用渐变色
+    if (color != null) {
+      decoration = BoxDecoration(
+        color: color,
+        borderRadius: BorderRadius.all(Radius.circular(radius)),
+      );
+    } else {
+      // 渐变色
+      decoration = ShapeDecoration(
+        gradient: LinearGradient(colors: colors, begin: begin, end: end),
+        shape: RoundedRectangleBorder(
+          borderRadius: BorderRadius.circular(radius),
+        ),
+      );
+    }
+    return GestureDetector(
+      onTap: () {
+        onPressed();
+      },
+      child: Container(
+        padding: EdgeInsets.symmetric(vertical: 14.h),
+        width: double.maxFinite,
+        // 渐变背景
+        decoration: decoration,
+        child: Center(child: child),
+      ),
+    );
+  }
+}
+
+/// 渐变按钮，中间为文字
+class GradientTextBtn extends StatelessWidget {
+  /// 按钮文字
+  final String text;
+
+  /// 纯色颜色
+  final Color? color;
+
+  /// 渐变颜色参数
+  final List<Color> colors;
+
+  /// 渐变方向
+  final AlignmentGeometry begin;
+  final AlignmentGeometry end;
+
+  /// 按钮圆角半径
+  final double radius;
+
+  /// 点击回调
+  final VoidCallback onPressed;
+
+  const GradientTextBtn(
+    this.text, {
+    super.key,
+    this.color,
+    this.colors = const [ColorName.purpleGradient3, ColorName.purpleGradient4],
+    this.begin = Alignment.centerLeft,
+    this.end = Alignment.centerRight,
+    this.radius = 50,
+    required this.onPressed,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return GradientBtn(
+      color: color,
+      colors: colors,
+      radius: radius,
+      onPressed: onPressed,
+      child: Text(
+        text,
+        style: TextStyle(
+          color: ColorName.white,
+          fontSize: 16.sp,
+          fontWeight: FontWeight.bold,
+        ),
+      ),
+    );
+  }
+}