feat:增加朋友圈组件

2025-07-23 20:03:03 +08:00
parent 5d156d3a02
commit d9f1781277
22 changed files with 393 additions and 6 deletions
--- a/lib/widgets/recipe/card.dart
+++ b/lib/widgets/recipe/card.dart
@@ -0,0 +1,147 @@
+import 'package:flutter/material.dart';
+import 'package:food_hub_app/config/app_config.dart';
+
+import 'package:food_hub_app/models/recipe.dart';
+import 'package:food_hub_app/widgets/common/index.dart';
+import 'package:tdesign_flutter/tdesign_flutter.dart';
+
+class RecipeCard extends StatelessWidget {
+  final Recipe recipe;
+
+  const RecipeCard({super.key, required this.recipe});
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      elevation: 0,
+      color: Colors.white,
+      clipBehavior: Clip.antiAlias,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Image.network(
+            '${AppConfig.baseApiUrl}/${recipe.recordList[0].imageUrl}',
+            height: 200,
+            width: double.infinity,
+            fit: BoxFit.contain,
+            errorBuilder: (context, error, stackTrace) => errorImageContainer(200),
+          ),
+          Divider(
+            height: 1,
+            thickness: 1,
+            color: Theme.of(context).primaryColor,
+            indent: 0,
+            endIndent: 0,
+          ),
+          Padding(
+            padding: const EdgeInsets.all(10),
+            child: _buildRecipeContent(context),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildRecipeContent(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Row(
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          children: [
+            Expanded(
+              child: Text(
+                recipe.name,
+                style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
+                maxLines: 1, // 限制单行，避免挤压按钮
+                overflow: TextOverflow.ellipsis,
+              ),
+            ),
+            Row(
+              children: [
+                TDButton(
+                  icon: Icons.edit,
+                  size: TDButtonSize.small,
+                  type: TDButtonType.fill,
+                  shape: TDButtonShape.circle,
+                  theme: TDButtonTheme.primary,
+                  onTap: () => {},
+                ),
+                SizedBox(width: 10),
+                TDButton(
+                  icon: Icons.book,
+                  size: TDButtonSize.small,
+                  type: TDButtonType.fill,
+                  shape: TDButtonShape.circle,
+                  theme: TDButtonTheme.primary,
+                  onTap: () => {},
+                ),
+              ],
+            ),
+          ],
+        ),
+        const SizedBox(height: 5),
+        Row(
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: [
+            Row(
+              children: [
+                _buildIconText(
+                  icon: Icons.food_bank,
+                  text: recipe.category,
+                  color: Theme.of(context).primaryColor,
+                ),
+                const SizedBox(width: 12),
+                _buildIconText(
+                  icon: Icons.thumb_up_alt_outlined,
+                  text: recipe.likeCount.toString(),
+                  color: Colors.red,
+                ),
+                const SizedBox(width: 12),
+                _buildIconText(
+                  icon: Icons.star_outline,
+                  text: recipe.favouriteCount.toString(),
+                  color: Colors.blue,
+                ),
+                const SizedBox(width: 12),
+                _buildIconText(
+                  icon: Icons.comment_outlined,
+                  text: recipe.commentCount.toString(),
+                  color: Colors.deepOrange,
+                ),
+              ],
+            ),
+            Row(
+              children: [
+                _buildIconText(
+                  icon: Icons.date_range,
+                  text: recipe.recordList[0].date,
+                  color: Colors.red,
+                ),
+              ],
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+
+  // 通用图标文本组件
+  Widget _buildIconText({
+    required IconData icon,
+    required String text,
+    Color color = Colors.grey, // 默认灰色
+    double iconSize = 16,
+    double textSize = 16,
+    double spacing = 2, // 图标与文本间距
+  }) {
+    return Row(
+      children: [
+        Icon(icon, size: iconSize, color: color),
+        SizedBox(width: spacing),
+        Text(text, style: TextStyle(fontSize: textSize, color: color)),
+      ],
+    );
+  }
+}