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

feat:更新朋友圈模块

Browse Source
This commit is contained in:
Cxx0822
2025-07-23 23:00:30 +08:00
parent d9f1781277
commit 7da3ec9507
8 changed files with 193 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
lib/views/moment.dart
View File

@@ -28,17 +28,19 @@ class _MomentPage extends State<MomentPage> {
});
}
@override
Widget build(BuildContext context) {
if (momentList.isEmpty) {
return const TDEmpty(type: TDEmptyType.plain, emptyText: '暂无数据');
} else {
return ListView.builder(
return Padding(
padding: EdgeInsets.all(5),
child: ListView.builder(
itemCount: momentList.length,
itemBuilder: (context, index) {
return MomentCard(moment: momentList[index]);
}
},
),
);
}
}

43
lib/views/record.dart
View File

@@ -39,31 +39,28 @@ class _RecordPageState extends State<RecordPage>
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(0),
child: Column(
children: [
TDTabBar(
tabs: tabs,
controller: _tabController,
backgroundColor: Colors.white,
showIndicator: true,
),
Expanded(
child: Padding(
padding: EdgeInsets.all(5),
child: TabBarView(
controller: _tabController,
children: [
RecipeList(),
RecipeCalendar(),
RecipeTimeline(),
],
),
return Column(
children: [
TDTabBar(
tabs: tabs,
controller: _tabController,
backgroundColor: Colors.white,
showIndicator: true,
),
Expanded(
child: Padding(
padding: EdgeInsets.all(5),
child: TabBarView(
controller: _tabController,
children: [
RecipeList(),
RecipeCalendar(),
RecipeTimeline(),
],
),
),
],
),
),
],
);
}
}

87
lib/widgets/common/image_preview.dart Normal file
View File

@@ -0,0 +1,87 @@
import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';
import 'package:photo_view/photo_view_gallery.dart';
class ImagePreviewPage extends StatefulWidget {
final List<String> images;
final int initialIndex;
const ImagePreviewPage({
super.key,
required this.images,
required this.initialIndex,
}) : assert(initialIndex >= 0 && initialIndex < images.length);
@override
State<ImagePreviewPage> createState() => _ImagePreviewPageState();
}
class _ImagePreviewPageState extends State<ImagePreviewPage> {
// 声明 PageController 并初始化初始索引
late PageController _pageController;
// 记录当前显示的图片索引（用于更新页码）
int _currentIndex = 0;
@override
void initState() {
super.initState();
// 初始化控制器，设置初始页面
_pageController = PageController(initialPage: widget.initialIndex);
// 初始化当前索引为初始索引
_currentIndex = widget.initialIndex;
// 监听页面切换事件
_pageController.addListener(() {
// 取当前页面的整数索引（避免滑动过程中的小数）
final currentPage = _pageController.page?.round() ?? 0;
// 只有当索引变化时才更新状态
if (currentPage != _currentIndex) {
setState(() {
_currentIndex = currentPage;
});
}
});
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
appBar: AppBar(
backgroundColor: Colors.black54,
elevation: 0,
leading: IconButton(
icon: const Icon(Icons.close, color: Colors.white),
onPressed: () => Navigator.pop(context),
),
// 显示实时更新的页码（当前索引+1 / 总数量）
title: Text(
'${_currentIndex + 1}/${widget.images.length}',
style: const TextStyle(color: Colors.white),
),
centerTitle: true,
),
body: PhotoViewGallery(
pageOptions: widget.images.map((url) {
return PhotoViewGalleryPageOptions(
imageProvider: NetworkImage(url),
minScale: PhotoViewComputedScale.contained,
maxScale: PhotoViewComputedScale.covered * 2,
// 点击空白处关闭预览
onTapDown: (context, details, controllerValue) {
Navigator.pop(context);
},
);
}).toList(),
pageController: _pageController,
scrollDirection: Axis.horizontal,
),
);
}
}

12
lib/widgets/common/index.dart
View File

@@ -53,16 +53,10 @@ Text buttonText({required String text}) {
Widget errorImageContainer(double height) {
return Container(
height: height,
height: 200,
width: double.infinity,
color: Colors.grey[200],
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.error, color: Colors.red),
const SizedBox(width: 5),
const Text("加载失败", style: TextStyle(color: Colors.red)),
],
),
child: const Icon(Icons.image, color: Colors.grey, size: 30),
);
}

106
lib/widgets/moment/card.dart
View File

@@ -1,6 +1,7 @@
import 'package:flutter/material.dart';
import 'package:food_hub_app/config/app_config.dart';
import 'package:food_hub_app/models/moment.dart';
import 'package:food_hub_app/widgets/common/image_preview.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';
class MomentCard extends StatelessWidget {
@@ -19,7 +20,7 @@ class MomentCard extends StatelessWidget {
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildAvatar(),
_buildAvatar(context),
const SizedBox(width: 12),
Expanded(
child: Column(
@@ -30,7 +31,7 @@ class MomentCard extends StatelessWidget {
_buildContent(),
if (moment.imageList.isNotEmpty) ...[
const SizedBox(height: 8),
_buildPostImages(),
_buildPostImages(context),
],
const SizedBox(height: 10),
_buildTime(),
@@ -46,29 +47,21 @@ class MomentCard extends StatelessWidget {
}
// 构建头像组件
Widget _buildAvatar() {
return TDAvatar(
size: TDAvatarSize.medium,
type: TDAvatarType.normal,
fit: BoxFit.contain,
avatarUrl: '${AppConfig.baseApiUrl}/${moment.avatar}');
// return SizedBox(
// width: 40,
// height: 40,
// child: ClipRRect(
// borderRadius: BorderRadius.circular(25),
// child: Image.network(
// '${AppConfig.baseApiUrl}/${moment.avatar}',
// fit: BoxFit.contain,
// errorBuilder: (context, error, stackTrace) {
// return Container(
// color: Colors.grey[200],
// child: const Icon(Icons.person, color: Colors.grey),
// );
// },
// ),
// ),
// );
Widget _buildAvatar(BuildContext context) {
if (moment.avatar!.isEmpty) {
return TDAvatar(
size: TDAvatarSize.medium,
type: TDAvatarType.customText,
shape: TDAvatarShape.circle,
backgroundColor: Theme.of(context).primaryColor,
text: moment.username?[0]);
} else {
return TDAvatar(
size: TDAvatarSize.medium,
type: TDAvatarType.normal,
fit: BoxFit.contain,
avatarUrl: '${AppConfig.baseApiUrl}/${moment.avatar}');
}
}
// 构建昵称组件
@@ -78,7 +71,6 @@ class MomentCard extends StatelessWidget {
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Colors.black87,
),
);
}
@@ -87,32 +79,35 @@ class MomentCard extends StatelessWidget {
Widget _buildContent() {
return Text(
moment.content,
style: const TextStyle(fontSize: 15, color: Colors.black87, height: 1.3),
style: const TextStyle(fontSize: 15, height: 1.3),
);
}
// 构建朋友圈图片列表（网格布局）
Widget _buildPostImages() {
// 图片数量
Widget _buildPostImages(BuildContext context) {
final imageCount = moment.imageList.length;
// 计算网格布局
// 计算网格列数
int crossAxisCount;
if (imageCount == 1) {
crossAxisCount = 1; // 单张图片
crossAxisCount = 1;
} else if (imageCount == 2 || imageCount == 4) {
crossAxisCount = 2; // 2张或4张图片用2列
crossAxisCount = 2;
} else {
crossAxisCount = 3; // 其他数量用3列
crossAxisCount = 3;
}
// 计算图片尺寸
double itemAspectRatio = 1.0; // 默认正方形
// 计算宽高比
double itemAspectRatio = 1.0;
if (imageCount == 1) {
// 单张图片使用宽屏比例
itemAspectRatio = 1.5;
}
// 生成图片URL列表（用于预览时切换）
final List<String> imageUrls = moment.imageList
.map((path) => '${AppConfig.baseApiUrl}/$path')
.toList();
return GridView.count(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
@@ -121,17 +116,34 @@ class MomentCard extends StatelessWidget {
mainAxisSpacing: 4,
childAspectRatio: itemAspectRatio,
children: List.generate(imageCount, (index) {
return ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Image.network(
'${AppConfig.baseApiUrl}/${moment.imageList[index]}',
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) {
return Container(
color: Colors.grey[200],
child: const Icon(Icons.image, color: Colors.grey, size: 30),
);
},
// 单个图片项：添加点击事件
return GestureDetector(
// 点击图片时，跳转到预览页面
onTap: () {
// 导航到全屏预览页面，传入所有图片URL和当前点击的索引
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ImagePreviewPage(
images: imageUrls,
initialIndex: index,
),
),
);
},
// 原图片组件
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Image.network(
imageUrls[index],
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) {
return Container(
color: Colors.grey[200],
child: const Icon(Icons.image, color: Colors.grey, size: 30),
);
},
),
),
);
}),

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

@@ -1,3 +1,4 @@
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:food_hub_app/config/app_config.dart';