feat(step): Cancel the required title and content fields and modify t…

…hem to Widget type Tencent#324
Jzow · Dec 30, 2024 · c22d95f · c22d95f
1 parent b0c7ffa
commit c22d95f
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 61 deletions.
diff --git a/tdesign-component/lib/src/components/steps/td_steps.dart b/tdesign-component/lib/src/components/steps/td_steps.dart
@@ -7,18 +7,18 @@ import '../../../tdesign_flutter.dart';
 class TDStepsItemData {
 
   TDStepsItemData({
-    required this.title,
-    required this.content,
+    this.title,
+    this.content,
     this.successIcon,
     this.errorIcon,
     this.customContent,
   });
 
   /// 标题
-  final String title;
+  final Widget? title;
 
   /// 内容
-  final String content;
+  final Widget? content;
 
   /// 成功图标
   final IconData? successIcon;
@@ -80,23 +80,23 @@ class _TDStepsState extends State<TDSteps> {
   Widget build(BuildContext context) {
     /// 当前激活的step索引
     final currentActiveIndex = widget.activeIndex < 0 ? 0 :
-      (widget.activeIndex >= widget.steps.length ? widget.steps.length - 1 : widget.activeIndex);
+    (widget.activeIndex >= widget.steps.length ? widget.steps.length - 1 : widget.activeIndex);
     return widget.direction == TDStepsDirection.horizontal ?
-      TDStepsHorizontal(
+    TDStepsHorizontal(
         steps: widget.steps,
         activeIndex: currentActiveIndex,
         status: widget.status,
         simple: widget.simple,
         readOnly: widget.readOnly
-      ):
-      TDStepsVertical(
-        steps: widget.steps,
-        activeIndex: currentActiveIndex,
-        status: widget.status,
-        simple: widget.simple,
-        readOnly: widget.readOnly,
-        verticalSelect: widget.verticalSelect,
-      );
+    ):
+    TDStepsVertical(
+      steps: widget.steps,
+      activeIndex: currentActiveIndex,
+      status: widget.status,
+      simple: widget.simple,
+      readOnly: widget.readOnly,
+      verticalSelect: widget.verticalSelect,
+    );
   }
 
-}
+}
diff --git a/tdesign-component/lib/src/components/steps/td_steps_horizontal_item.dart b/tdesign-component/lib/src/components/steps/td_steps_horizontal_item.dart
@@ -10,6 +10,7 @@ class TDStepsHorizontalItem extends StatelessWidget {
   final TDStepsStatus status;
   final bool simple;
   final bool readOnly;
+
   const TDStepsHorizontalItem({
     super.key,
     required this.data,
@@ -23,6 +24,10 @@ class TDStepsHorizontalItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    /// 默认标题
+    Widget defaultTitle = Text('Step ${index + 1}', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold));
+    /// 默认内容
+    Widget defaultContent = Text('This is the content of step ${index + 1}.');
     /// 步骤条数字背景色
     var stepsNumberBgColor = TDTheme.of(context).brandNormalColor;
     /// 步骤条数字颜色
@@ -175,30 +180,14 @@ class TDStepsHorizontalItem extends StatelessWidget {
         Container(
           margin: const EdgeInsets.only(top: 8),
           alignment: Alignment.center,
-          child: TDText(
-            data.title,
-            style: TextStyle(
-              fontWeight: (activeIndex == index && !readOnly)  ? FontWeight.w600 : FontWeight.w400,
-              color: stepsTitleColor,
-              fontSize: 14,
-            ),
-          ),
+          child: data.title ?? defaultTitle, // 使用默认title
         ),
         Container(
           margin: const EdgeInsets.only(top: 4),
           alignment: Alignment.center,
-          child: TDText(
-            data.content,
-            style: TextStyle(
-              fontWeight: FontWeight.w400,
-              color: TDTheme.of(context).fontGyColor3,
-              fontSize: 12,
-            ),
-          ),
+          child: data.content ?? defaultContent, // 使用默认content
         ),
       ],
     );
   }
-
-}
-
+}
diff --git a/tdesign-component/lib/src/components/steps/td_steps_vertical_item.dart b/tdesign-component/lib/src/components/steps/td_steps_vertical_item.dart
@@ -11,6 +11,7 @@ class TDStepsVerticalItem extends StatelessWidget {
   final bool simple;
   final bool readOnly;
   final bool verticalSelect;
+
   const TDStepsVerticalItem({
     super.key,
     required this.data,
@@ -25,6 +26,10 @@ class TDStepsVerticalItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    /// 默认标题
+    Widget defaultTitle = Text('Step ${index + 1}', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold));
+    /// 默认内容
+    Widget defaultContent = Text('This is the content of step ${index + 1}.');
     /// 步骤条数字背景色
     var stepsNumberBgColor = TDTheme.of(context).brandNormalColor;
     /// 步骤条数字颜色
@@ -195,33 +200,18 @@ class TDStepsVerticalItem extends StatelessWidget {
                     child: Row(
                       mainAxisAlignment: MainAxisAlignment.spaceBetween,
                       children: [
-                        TDText(
-                          data.title,
-                          style: TextStyle(
-                            fontWeight: (activeIndex == index && !readOnly) ? FontWeight.w600 : FontWeight.w400,
-                            color: stepsTitleColor,
-                            fontSize: 14,
-                            height: 1.2,
-                          ),
-                        ),
-                        verticalSelect ? Icon(TDIcons.chevron_right, color: TDTheme.of(context).fontGyColor1, size: 16,): Container(),
+                        data.title ?? defaultTitle, // 使用默认title
+                        verticalSelect ? Icon(TDIcons.chevron_right, color: TDTheme.of(context).fontGyColor1, size: 16,) : Container(),
                       ],
                     ),
                   ),
                   Column(
-                    mainAxisAlignment: MainAxisAlignment.start,
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: [
-                      TDText(
-                        data.content,
-                        style: TextStyle(
-                          fontWeight: FontWeight.w400,
-                          color: TDTheme.of(context).fontGyColor3,
-                          fontSize: 12,
-                        ),
-                      ),
-                      customContent,
-                    ]
+                      mainAxisAlignment: MainAxisAlignment.start,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        data.content ?? defaultContent, // 使用默认content
+                        customContent,
+                      ]
                   ),
                 ],
               ),
@@ -231,6 +221,4 @@ class TDStepsVerticalItem extends StatelessWidget {
       ),
     );
   }
-
-}
-
+}