Cxx0822/food_hub_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:重构UI模块

Browse Source
This commit is contained in:
Cxx0822
2025-11-18 11:01:53 +08:00
parent 6bba9a488c
commit 21ff0ad94f
20 changed files with 501 additions and 605 deletions
Download Patch File Download Diff File Expand all files Collapse all files

221
lib/widgets/recipe/card.dart
View File

@@ -1,5 +1,4 @@
import 'package:flutter/material.dart';
import 'package:flutter_carousel_widget/flutter_carousel_widget.dart';
import 'package:food_hub_app/config/app_config.dart';
import 'package:food_hub_app/models/recipe.dart';
@@ -18,150 +17,106 @@ class RecipeCard extends StatelessWidget {
.map((item) => '${AppConfig.baseApiUrl}/${item.imageUrl}')
.toList();
Widget buildCarouselItem(String url) {
return Builder(
builder: (BuildContext context) {
return AspectRatio(
aspectRatio: 2,
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: networkImage(url),
),
);
},
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: [
circleIconButton(
context: context,
icon: Icons.edit,
onPressed: () => {},
),
SizedBox(width: 8),
circleIconButton(
context: context,
icon: Icons.book,
onPressed:
() => Navigator.pushNamed(
context,
'/recipeDetail',
arguments: {'id': recipe.id},
),
),
],
),
],
),
const SizedBox(height: 5),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
children: [
_buildIconText(
icon: Icons.food_bank,
text: recipe.category,
color: Color(0xFF6A5ACD),
),
const SizedBox(width: 12),
_buildIconText(
icon: Icons.thumb_up_alt_outlined,
text: recipe.likeCount.toString(),
color: Color(0xFFDC143C),
),
const SizedBox(width: 12),
_buildIconText(
icon: Icons.star_outline,
text: recipe.favouriteCount.toString(),
color: Color(0xFF20B2AA),
),
const SizedBox(width: 12),
_buildIconText(
icon: Icons.comment_outlined,
text: recipe.commentCount.toString(),
color: Color(0xFFDAC570),
),
],
),
Row(
children: [
_buildIconText(
icon: Icons.date_range,
text: recipe.recordList[0].date,
color: Color(0xFF32CD32),
),
],
),
],
),
],
);
}
Widget buildRecipeCarousel() {
return FlutterCarousel(
// 轮播项
items:
imageUrls.map((url) {
return buildCarouselItem(url);
}).toList(),
// 轮播配置
options: FlutterCarouselOptions(
height: 300,
autoPlay: imageUrls.length > 1,
enableInfiniteScroll: imageUrls.length > 1,
autoPlayInterval: const Duration(seconds: 3),
viewportFraction: 0.9,
showIndicator: true,
),
);
}
return Card(
shape: RoundedRectangleBorder(
side: BorderSide(color: Theme.of(context).primaryColor, width: 1.0),
borderRadius: BorderRadius.circular(10.0),
),
elevation: 0,
color: Colors.white,
clipBehavior: Clip.antiAlias,
return buildCard(
context: context,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
buildRecipeCarousel(),
Divider(
height: 1,
thickness: 1,
color: Theme.of(context).primaryColor,
indent: 0,
endIndent: 0,
),
Padding(
padding: const EdgeInsets.all(10),
child: _buildRecipeContent(context),
AspectRatio(
aspectRatio: 1.5,
child: buildNetworkImage(imageUrls.first),
),
SizedBox(height: 8),
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: [
circleIconButton(
context: context,
icon: Icons.edit,
onPressed: () => {},
),
circleIconButton(
context: context,
icon: Icons.book,
onPressed:
() => Navigator.pushNamed(
context,
'/recipeDetail',
arguments: {'id': recipe.id},
),
),
],
),
],
),
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,