Files
blog_app/lib/widget/blog.dart
2025-11-23 20:28:45 +08:00

288 lines
7.4 KiB
Dart

import 'package:blog_app/models/blog.dart';
import 'package:blog_app/pages/blog_detail_page.dart';
import 'package:blog_app/pages/category_list_page.dart';
import 'package:flutter/material.dart';
import 'package:flutter_common/utils/date_utils.dart';
import 'package:flutter_common/widget/common_widget.dart';
class BlogLabel {
final String text;
final IconData icon;
final Color color;
BlogLabel(this.text, this.icon, this.color);
}
class BlogCard extends StatelessWidget {
final Blog blog;
const BlogCard({super.key, required this.blog});
Widget _buildBlogLabelItem(String text, IconData icon, Color color) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: color.withAlpha(30),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: color.withAlpha(20), width: 1),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(icon, size: 12, color: color),
SizedBox(width: 4),
Text(
text,
style: TextStyle(
fontSize: 10,
color: color,
fontWeight: FontWeight.w500,
),
),
],
),
);
}
Widget _buildBlogLabel() {
return SizedBox(
width: double.infinity,
child: Wrap(
spacing: 6,
runSpacing: 6,
alignment: WrapAlignment.center,
children: [
if (blog.isGreat)
_buildBlogLabelItem(
'精品',
Icons.workspace_premium,
Colors.deepOrange,
),
if (blog.topValue > 1)
_buildBlogLabelItem('置顶', Icons.push_pin, Colors.red),
_buildBlogLabelItem(blog.category, Icons.folder, Colors.blue),
_buildBlogLabelItem(
formatDateString(blog.createTime),
Icons.calendar_today,
Colors.green,
),
_buildBlogLabelItem(
formatDateString(blog.updateTime),
Icons.calendar_month,
Colors.orange,
),
_buildBlogLabelItem(
'${blog.visitCount}',
Icons.remove_red_eye,
Colors.purple,
),
_buildBlogLabelItem(
'${blog.wordCount}',
Icons.text_fields,
Colors.indigo,
),
_buildBlogLabelItem(
'${blog.readDuration} 分钟',
Icons.access_time,
Colors.brown,
),
],
),
);
}
Widget _buildBlogTitle(BuildContext context) {
return Text(
blog.title,
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Theme.of(context).colorScheme.primary,
),
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
);
}
Widget _buildBlogSummary(BuildContext context) {
final colors = Theme.of(context).colorScheme;
return SizedBox(
width: double.infinity,
child: Text(
blog.summary,
style: TextStyle(color: colors.secondary, height: 1.6),
overflow: TextOverflow.ellipsis,
),
);
}
@override
Widget build(BuildContext context) {
final colors = Theme.of(context).colorScheme;
return CommonCard(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_buildBlogTitle(context),
SizedBox(height: 16),
_buildBlogLabel(),
SizedBox(height: 16),
Container(height: 1, width: 80, color: colors.primary),
SizedBox(height: 16),
_buildBlogSummary(context),
],
),
);
}
}
Widget buildCategoryTitle(BuildContext context, int count) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.primary,
borderRadius: BorderRadius.circular(8),
),
child: Text(
'$count 个分类',
style: const TextStyle(
fontWeight: FontWeight.w500,
color: Colors.white,
),
),
),
],
);
}
Widget buildCategoryCard(BuildContext context, BlogCategory category) {
final colors = Theme.of(context).colorScheme;
return CommonCard(
child: ListTile(
leading: Container(
width: 50,
height: 50,
decoration: BoxDecoration(
color: colors.primary.withAlpha(50),
shape: BoxShape.circle,
),
child: Icon(Icons.folder, color: colors.primary, size: 28),
),
title: Text(
category.name,
style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w600),
),
subtitle: Padding(
padding: const EdgeInsets.only(top: 4.0),
child: Text(
'${category.count} 篇博客',
style: TextStyle(fontSize: 14, color: Colors.grey.shade600),
),
),
trailing: Container(
width: 30,
height: 30,
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.primary.withAlpha(50),
shape: BoxShape.circle,
),
child: Icon(
Icons.arrow_forward,
size: 16,
color: Theme.of(context).colorScheme.primary,
),
),
onTap: () => navigateToBlogList(context, category),
),
);
}
Widget buildListTitle(int count) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'博客列表',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
),
Text(
'$count',
style: TextStyle(color: Colors.grey.shade600, fontSize: 14),
),
],
);
}
Widget buildBlogListItem(BuildContext context, Blog blog, int index) {
final colors = Theme.of(context).colorScheme;
return CommonCard(
child: Padding(
padding: EdgeInsets.all(0),
child: Row(
children: [
Text(
'$index.',
style: TextStyle(
color: colors.onSurface,
fontWeight: FontWeight.w500,
),
),
SizedBox(width: 10),
Text(
formatDateString(blog.createTime),
style: TextStyle(fontSize: 14, color: colors.onSurface),
),
SizedBox(width: 10),
Expanded(
child: Text(
blog.title,
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: colors.primary,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
],
),
),
);
}
void navigatorToBlogDetail(BuildContext context, int blogId) {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => BlogDetailPage(blogId: blogId)),
);
}
void navigateToBlogList(BuildContext context, BlogCategory category) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => CategoryListPage(category: category.name),
),
);
}
Widget buildEmpty() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('暂无数据', style: TextStyle(fontSize: 16, color: Colors.grey)),
],
),
);
}