基于Flutter的豆果美食高仿设计源码

import 'dart:ui'; import 'package:flutter/material.dart'; import 'package:flutter_douban/config/Http_service.dart'; import 'package:flutter_douban/config/app_colors.dart'; import 'package:flutter_douban/main_page/home/detail/views/cook_detail_headerView.dart'; import 'package:flutter_douban/main_page/home/detail/views/nutrition_facts_view.dart'; import 'package:flutter_douban/main_page/home/h5_detail_page/activity_detail_page.dart'; import 'package:flutter_douban/main_page/home/notes/commit_cell.dart'; import 'package:flutter_douban/main_page/home/notes/note_detail_page.dart'; import 'package:flutter_douban/main_page/home/notes/note_list_page.dart'; import 'package:flutter_douban/main_page/home/video/window_video_page.dart'; import 'package:flutter_douban/model/content_model.dart'; import 'package:flutter_douban/model/note_content_model.dart'; import 'package:flutter_douban/model/note_model.dart'; import 'package:flutter_douban/model/recipe_big_model.dart'; import 'package:flutter_douban/tool_views/cached_network_Image.dart'; import 'package:flutter_douban/tool_views/photo_ViewScreen.dart'; import 'package:flutter_douban/tool_views/router.dart'; import 'package:flutter_douban/tool_views/stance_page.dart'; import 'package:sticky_headers/sticky_headers/widget.dart'; import '../../../../main.dart'; import 'cook_detail_navFooter.dart'; import 'cook_detail_navHeader.dart'; const APPBAR_SCROLL = 100; //设置滑动变化的偏移量 class CookDetailPage extends StatefulWidget { final int id; final String? imgUrl; const CookDetailPage({Key? key, required this.id,this.imgUrl}) : super(key: key); @override _CookDetailPageState createState() => _CookDetailPageState(); } class _CookDetailPageState extends State<CookDetailPage> { RecipeBigModel? _model; List<NoteContentModel> _commotList = NoteContentModellList([]).list; List<NoteModel> _noteList = NoteModelList([]).list; /// 滚动控制器 ScrollController? _controller; /// 关闭键盘 FocusNode userFocusNode = FocusNode(); /// 输入框 late TextEditingController _textEditingController; double appBarAlpha = 0; double _offset = 0; /// 作品数量 String _noteCount = ''; /// 请求主体数据 Future _getActiveData() async { try { /// 全部数据 Map<String, dynamic> result = await HttpService.getCookDetailMianData(id: widget.id); Map<String, dynamic> result02 = result['recipe']; if (result02['nutrition_facts'] is List) { } else { result02['nutrition_facts'] = []; } /// 列表 RecipeBigModel model = RecipeBigModel.fromJson(result02); setState(() { _model = model; _getDetailRecomomendData(); }); } catch (e) { print(e); setState(() {}); } finally { setState(() {}); } } /// 请求评论和笔记数据 Future _getDetailRecomomendData() async { try { /// 全部数据 Map<String, dynamic> result = await HttpService.getDetailCommentsData(id: widget.id); NoteContentModellList commotList = NoteContentModellList.fromJson(result['comments']); NoteModelList noteList = NoteModelList.fromJson(result['notes']); setState(() { _commotList = commotList.list; _noteList = noteList.list; _noteCount = result['recommendation_tag']; }); } catch (e) { print(e); setState(() {}); } finally { setState(() {}); } } /// 监听列表偏移 _onScroll(offset) { double alpha = offset / APPBAR_SCROLL; if (alpha < 0) { alpha = 0; } else if (alpha > 1) { alpha = 1; } setState(() { appBarAlpha = alpha; _offset = offset; userFocusNode.unfocus(); }); } @override void initState() { // TODO: implement initState super.initState(); _getActiveData(); _textEditingController = TextEditingController(); _textEditingController.addListener(() { setState(() {}); }); _controller = ScrollController(); } @override void dispose() { super.dispose(); _textEditingController.dispose(); _controller!.dispose(); } @override Widget build(BuildContext context) { if (_model?.title == null) { return StancePage(); // return Container( // height: MediaQuery.of(context).size.width*1.2, // child: CachedImage( // url: widget.imgUrl!, // width: MediaQuery.of(context).size.width, // height: MediaQuery.of(context).size.width*1.2, // ), // ); } /// 高度数组 List<double> _headerList = [0, 40, 40]; /// 头部widget List<Widget> _headerWidgetList = [ _header('食材清单', '加入采购清单'), _header('食材清单', '加入采购清单'), _header('营养分析', '查看详情'), ]; /// 内容widget List<Widget> _contentWidgetList = [ CookDetailHeaderView( model: _model!, ), _cookNameWidget(), _nutritionWidget(), ]; if (_model!.nutrition_facts?.length == 0) { _headerList.removeAt(2); _headerWidgetList.removeAt(2); _contentWidgetList.removeAt(2); } for (int i = 0; i < _model!.cookstep!.length; i++) { _headerList.add(35); _headerWidgetList.add(_cookHeader(i == _model!.cookstep!.length - 1 ? '最后一步' : '步骤 ${i + 1}/${_model!.cookstep!.length}')); _contentWidgetList.add(_cookProcessWidget(i)); } if (_model!.tips!.length > 0) { _headerList.add(40); _headerWidgetList.add( _header('小贴士', ''), ); _contentWidgetList.add(_cookGuideWidget()); } /// 评论数据 if (_commotList.length > 0) { _headerList.add(40); _headerWidgetList.add( _header('热门评论', ''), ); _contentWidgetList.add(_commitWidget()); } /// 大家都在做 if (_noteList.length > 0) { _headerList.add(40); _headerWidgetList.add( _header('大家做的这道菜', ' ' + _noteCount), ); _contentWidgetList.add(_makeWidget()); } /// 传学做 _headerList.add(0); _headerWidgetList.add( _header('', ''), ); _contentWidgetList.add(_studentWidget()); return Scaffold( body: Container( color: Colors.white, child: Stack( children: <Widget>[ MediaQuery.removePadding( removeTop: true, context: context, child: NotificationListener( onNotification: (scrollNotification) { if (scrollNotification is ScrollUpdateNotification && scrollNotification.depth == 0) { //滚动且是列表滚动的时候 _onScroll(scrollNotification.metrics.pixels); } return true; }, child: Container( color: Colors.white, padding: EdgeInsets.only( top: appBarAlpha == 1 ? kToolbarHeight - 5 + MediaQuery.of(context).padding.top : 0, bottom: MediaQuery.of(context).padding.bottom), child: ListView.builder( primary: _controller == null, controller: _controller, itemCount: _headerList.length, itemBuilder: (context, index) { return StickyHeader( // controller: _controller, // Optional header: Container( height: _headerList[index], color: Colors.white, padding: EdgeInsets.symmetric(horizontal: 16.0), alignment: Alignment.centerLeft, child: _headerWidgetList[index], ),