import 'package:flutter/material.dart'; class RecordPage extends StatefulWidget { const RecordPage({super.key}); @override State createState() => _RecordPageState(); } enum ViewType { recipe, daily, timeline } class _RecordPageState extends State { ViewType _selectedViewType = ViewType.recipe; final List recipeList = [ Recipe("韭菜炒鸡蛋", "2025-05-04", "https://cdn.seovx.com/?mom=302"), Recipe("红烧肉", "2025-05-05", "https://cdn.seovx.com/?mom=302"), ]; @override Widget build(BuildContext context) { return Column( children: [ Card( color: Colors.white, margin: const EdgeInsets.all(10), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10), // 卡片圆角 ), shadowColor: Colors.black.withValues(alpha: 0.1), child: Container( padding: const EdgeInsets.all(10), // 内部内容边距 child: Row( children: [ const Text("查看类型:", style: TextStyle(fontWeight: FontWeight.bold)), const SizedBox(width: 8), SegmentedButton( segments: [ ButtonSegment(value: ViewType.recipe, label: Text("菜谱")), ButtonSegment(value: ViewType.daily, label: Text("日历")), ButtonSegment(value: ViewType.timeline, label: Text("时间轴")), ], selected: {_selectedViewType}, onSelectionChanged: (newSelection) { setState(() { _selectedViewType = newSelection.first; }); }, style: ButtonStyle( shape: WidgetStateProperty.all( RoundedRectangleBorder( borderRadius: BorderRadius.circular(8), // 分段按钮圆角 ), ), ), ), ], ), ), ), // 分隔线 const Divider(height: 1), // 内容区域 Expanded( child: _buildContent(), ), ], ); } Widget _buildContent() { switch (_selectedViewType) { case ViewType.recipe: return ListView.builder( itemCount: recipeList.length, itemBuilder: (context, index) { return RecipeCard(recipe: recipeList[index]); } ); case ViewType.daily: return const Center(child: Text("日历视图")); case ViewType.timeline: return const Center(child: Text("时间轴视图")); } } } class Recipe { final String name; final String date; final String imagePath; Recipe(this.name, this.date, this.imagePath); } class RecipeCard extends StatelessWidget { final Recipe recipe; const RecipeCard({super.key, required this.recipe}); @override Widget build(BuildContext context) { return Card( margin: const EdgeInsets.all(10), color: Colors.white, child: Column( children: [ Image.network( recipe.imagePath, height: 200, fit: BoxFit.contain, ), const Divider( height: 1, // 分隔线本身的高度 thickness: 1, // 线条粗细 color: Colors.green, // 线条颜色 indent: 0, // 左侧缩进 endIndent: 0, // 右侧缩进 ), Padding( padding: EdgeInsets.symmetric(vertical: 5, horizontal: 10), child: Column( children: [ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( recipe.name, style: TextStyle( fontSize: 16, fontWeight: FontWeight.bold, ), ), Row( children: [ IconButton( icon: Icon(Icons.edit), onPressed: () {}, ), IconButton( icon: Icon(Icons.book), onPressed: () {}, ), IconButton( icon: Icon(Icons.delete), onPressed: () {}, ), ], ), ], ), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Row( children: [ Icon(Icons.food_bank, color: Colors.grey), SizedBox(width: 4), Text("家常菜", style: TextStyle(color: Colors.grey)), ], ), Row( crossAxisAlignment: CrossAxisAlignment.center, children: [ Icon(Icons.date_range, color: Colors.red[700]), SizedBox(width: 4), Text(recipe.date, style: TextStyle(color: Colors.grey)), ], ), ], ), ], ), ) ], ), ); } }