From 971f7b9e6826057068eb18842fdec4ae2bb4a9c2 Mon Sep 17 00:00:00 2001 From: Weller <1812208341@qq.com> Date: Wed, 9 Sep 2020 15:05:36 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E8=83=8C=E6=99=AF=E5=9B=BE?= =?UTF-8?q?=E5=88=87=E6=8D=A2=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/pages/main_page/main_page.dart | 35 ++++- .../notifier/main_page_bg_notifier.dart | 10 ++ .../{ => notifier}/main_page_notifier.dart | 1 + lib/register.dart | 3 +- lib/widgets/home_goods/home_goods.dart | 2 +- .../home_slide_banner/home_slide_banner.dart | 37 +++-- .../home_slide_banner_creater.dart | 5 +- lib/widgets/mine_header/mine_header.dart | 2 +- .../others/mine_header_bg_creater.dart | 12 -- lib/widgets/others/mine_header_bg_widget.dart | 133 ++++++++++++------ 10 files changed, 164 insertions(+), 76 deletions(-) create mode 100644 lib/pages/main_page/notifier/main_page_bg_notifier.dart rename lib/pages/main_page/{ => notifier}/main_page_notifier.dart (91%) delete mode 100644 lib/widgets/others/mine_header_bg_creater.dart diff --git a/lib/pages/main_page/main_page.dart b/lib/pages/main_page/main_page.dart index 70eccf4..ef125ec 100644 --- a/lib/pages/main_page/main_page.dart +++ b/lib/pages/main_page/main_page.dart @@ -3,7 +3,9 @@ import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; import 'package:pull_to_refresh/pull_to_refresh.dart'; import 'package:zhiying_base_widget/pages/main_page/main_page_bloc.dart'; -import 'package:zhiying_base_widget/pages/main_page/main_page_notifier.dart'; +import 'package:zhiying_base_widget/pages/main_page/notifier/main_page_bg_notifier.dart'; +import 'package:zhiying_base_widget/pages/main_page/notifier/main_page_notifier.dart'; +import 'package:zhiying_base_widget/widgets/others/mine_header_bg_widget.dart'; import 'package:zhiying_comm/util/base_bloc.dart'; import 'package:zhiying_comm/zhiying_comm.dart'; @@ -24,8 +26,18 @@ class _MainPageState extends State { Widget build(BuildContext context) { return Scaffold( backgroundColor: Color(0xfff9f9f9), - body: ChangeNotifierProvider( - create: (context) => MainPageNotifier(), +// body: ChangeNotifierProvider( +// create: (context) => MainPageNotifier(), +// child: BlocProvider( +// bloc: MainPageBloc(), +// child: _MainPageContainer(widget.data), +// ), +// ), + body: MultiProvider( + providers: [ + ChangeNotifierProvider.value(value: MainPageNotifier()), + ChangeNotifierProvider.value(value: MainPageBgNotifier()), + ], child: BlocProvider( bloc: MainPageBloc(), child: _MainPageContainer(widget.data), @@ -96,9 +108,20 @@ class _MainPageContainerState extends State<_MainPageContainer> { header: WaterDropHeader(), controller: _refreshController, onLoading: _onLoading, - child: CustomScrollView( - controller: _controller, - slivers: _createContent(context), + child: Container( + width: double.infinity, + child: Stack( + fit: StackFit.passthrough, + children: [ + MineHeaderBgWidget( + controller: _controller, + ), + CustomScrollView( + controller: _controller, + slivers: _createContent(context), + ) + ], + ), ), )); }, diff --git a/lib/pages/main_page/notifier/main_page_bg_notifier.dart b/lib/pages/main_page/notifier/main_page_bg_notifier.dart new file mode 100644 index 0000000..334e27f --- /dev/null +++ b/lib/pages/main_page/notifier/main_page_bg_notifier.dart @@ -0,0 +1,10 @@ +import 'package:flutter/material.dart'; + +class MainPageBgNotifier with ChangeNotifier { + Widget toWidget = Container(); + + void switchBg(Widget toWidget) { + this.toWidget = toWidget; + notifyListeners(); + } +} diff --git a/lib/pages/main_page/main_page_notifier.dart b/lib/pages/main_page/notifier/main_page_notifier.dart similarity index 91% rename from lib/pages/main_page/main_page_notifier.dart rename to lib/pages/main_page/notifier/main_page_notifier.dart index dc9d2ae..a4acd78 100644 --- a/lib/pages/main_page/main_page_notifier.dart +++ b/lib/pages/main_page/notifier/main_page_notifier.dart @@ -3,6 +3,7 @@ import 'package:flutter/material.dart'; class MainPageNotifier with ChangeNotifier { bool scrollEnd = false; + // 加载更多数据 void loadMore() { scrollEnd = true; notifyListeners(); diff --git a/lib/register.dart b/lib/register.dart index 77ac3d9..6248770 100644 --- a/lib/register.dart +++ b/lib/register.dart @@ -5,6 +5,7 @@ import 'package:zhiying_base_widget/widgets/home_banner/home_banner_creater.dart import 'package:zhiying_base_widget/widgets/home_goods/home_goods_creater.dart'; import 'package:zhiying_base_widget/widgets/home_quick_entry/home_quick_entry_creater.dart'; import 'package:zhiying_base_widget/widgets/home_slide_banner/home_slide_banner_creater.dart'; +import 'package:zhiying_base_widget/widgets/mine_header/mine_header_creater.dart'; import 'package:zhiying_comm/zhiying_comm.dart'; class BaseWidgetRegister { @@ -38,7 +39,7 @@ class BaseWidgetRegister { WidgetFactory.regist('index_banner_two', HomeBannerCreater()); // ==================== 个人中心 -// WidgetFactory.regist('index_title', MineHeaderCreater()); + WidgetFactory.regist('index_title', MineHeaderCreater()); // WidgetFactory.regist('index_search', MineHeaderBgCreater()); // WidgetFactory.regist('index_search', MineQuickEntryCreater()); } diff --git a/lib/widgets/home_goods/home_goods.dart b/lib/widgets/home_goods/home_goods.dart index ac42ba2..d0369f6 100644 --- a/lib/widgets/home_goods/home_goods.dart +++ b/lib/widgets/home_goods/home_goods.dart @@ -2,7 +2,7 @@ import 'package:event_bus/event_bus.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; -import 'package:zhiying_base_widget/pages/main_page/main_page_notifier.dart'; +import 'package:zhiying_base_widget/pages/main_page/notifier/main_page_notifier.dart'; import 'package:zhiying_base_widget/widgets/home_goods/bloc/home_goods_bloc.dart'; import 'package:zhiying_base_widget/widgets/home_goods/home_goods_creater.dart'; import 'package:zhiying_base_widget/widgets/home_goods/home_goods_item.dart'; diff --git a/lib/widgets/home_slide_banner/home_slide_banner.dart b/lib/widgets/home_slide_banner/home_slide_banner.dart index 6212134..facfab9 100644 --- a/lib/widgets/home_slide_banner/home_slide_banner.dart +++ b/lib/widgets/home_slide_banner/home_slide_banner.dart @@ -1,9 +1,11 @@ import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_swiper/flutter_swiper.dart'; -import 'bloc/bloc.dart'; +import 'package:provider/provider.dart'; +import 'package:zhiying_base_widget/pages/main_page/notifier/main_page_bg_notifier.dart'; import 'package:zhiying_comm/zhiying_comm.dart'; +import 'bloc/bloc.dart'; import 'bloc/home_slide_banner_repository.dart'; import 'home_slide_banner_sk.dart'; import 'model/home_slide_banner_model.dart'; @@ -24,7 +26,9 @@ class _HomeSlideBannerState extends State { @override Widget build(BuildContext context) { return BlocProvider( - create: (_) => HomeSlideBannerBloc(repository: HomeSlideBannerRepository())..add(HomeBannerInitEvent(model: widget?.model)), + create: (_) => + HomeSlideBannerBloc(repository: HomeSlideBannerRepository()) + ..add(HomeBannerInitEvent(model: widget?.model)), child: HomeSlideBannerContainer(), ); } @@ -32,7 +36,8 @@ class _HomeSlideBannerState extends State { class HomeSlideBannerContainer extends StatefulWidget { @override - _HomeSlideBannerContainerState createState() => _HomeSlideBannerContainerState(); + _HomeSlideBannerContainerState createState() => + _HomeSlideBannerContainerState(); } class _HomeSlideBannerContainerState extends State { @@ -77,12 +82,21 @@ class _HomeSlideBannerContainerState extends State { child: Swiper( itemBuilder: (BuildContext context, int index) { return Container( - color: Colors.green, + color: Colors.primaries[index % Colors.primaries.length], ); }, itemCount: datas?.length ?? 0, onTap: (index) => _itemOnClick(datas[index]), pagination: _SwiperCustomPagination(datas?.length ?? 0), + onIndexChanged: (index) { + print('切换下一页'); + Provider.of(context, listen: false) + .switchBg(Container( + width: double.infinity, + height: 200, + color: Colors.primaries[(index + 2) % Colors.primaries.length], + )); + }, ), ); } @@ -94,7 +108,8 @@ class _HomeSlideBannerContainerState extends State { list.add(i); } - return SwiperCustomPagination(builder: (BuildContext context, SwiperPluginConfig config) { + return SwiperCustomPagination( + builder: (BuildContext context, SwiperPluginConfig config) { return Align( alignment: Alignment(0.0, 0.9), child: Row( @@ -103,10 +118,13 @@ class _HomeSlideBannerContainerState extends State { children: list.map((index) { var borderRadius; if (index == 0) { - borderRadius = BorderRadius.only(topLeft: Radius.circular(2), bottomLeft: Radius.circular(2)); + borderRadius = BorderRadius.only( + topLeft: Radius.circular(2), bottomLeft: Radius.circular(2)); } if (index == list.length - 1) { - borderRadius = BorderRadius.only(topRight: Radius.circular(2), bottomRight: Radius.circular(2)); + borderRadius = BorderRadius.only( + topRight: Radius.circular(2), + bottomRight: Radius.circular(2)); } if (index == config.activeIndex) { @@ -117,7 +135,10 @@ class _HomeSlideBannerContainerState extends State { height: 4, width: 25, decoration: BoxDecoration( - borderRadius: borderRadius, color: index == config.activeIndex ? HexColor.fromHex('#FF4242') : HexColor.fromHex('#FFFFFF')), + borderRadius: borderRadius, + color: index == config.activeIndex + ? HexColor.fromHex('#FF4242') + : HexColor.fromHex('#FFFFFF')), ); }).toList(), ), diff --git a/lib/widgets/home_slide_banner/home_slide_banner_creater.dart b/lib/widgets/home_slide_banner/home_slide_banner_creater.dart index 421dba6..d36c552 100644 --- a/lib/widgets/home_slide_banner/home_slide_banner_creater.dart +++ b/lib/widgets/home_slide_banner/home_slide_banner_creater.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:zhiying_comm/zhiying_comm.dart'; + import 'home_slide_banner.dart'; import 'home_slide_banner_sk.dart'; @@ -14,6 +15,8 @@ class HomeSlideBannerCreater extends WidgetCreater { @override List createWidgets(Map model) { - return [HomeSlideBanner(model)]; + return [ + HomeSlideBanner(model), + ]; } } diff --git a/lib/widgets/mine_header/mine_header.dart b/lib/widgets/mine_header/mine_header.dart index 27b0470..39cb919 100644 --- a/lib/widgets/mine_header/mine_header.dart +++ b/lib/widgets/mine_header/mine_header.dart @@ -13,7 +13,7 @@ class MineHeaderDelegate extends SliverPersistentHeaderDelegate { @override Widget build( BuildContext context, double shrinkOffset, bool overlapsContent) { - print('${shrinkOffset.toString()}'); +// print('${shrinkOffset.toString()}'); double percent = shrinkOffset / _height; print('${percent.toString()}'); return MineHeader(Colors.red.withOpacity(percent)); diff --git a/lib/widgets/others/mine_header_bg_creater.dart b/lib/widgets/others/mine_header_bg_creater.dart deleted file mode 100644 index 4814552..0000000 --- a/lib/widgets/others/mine_header_bg_creater.dart +++ /dev/null @@ -1,12 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:zhiying_base_widget/widgets/others/mine_header_bg_widget.dart'; -import 'package:zhiying_comm/zhiying_comm.dart'; - -class MineHeaderBgCreater extends WidgetCreater { - @override - List createWidgets(Map model) { - return [ - MineHeaderBgWidget(), - ]; - } -} diff --git a/lib/widgets/others/mine_header_bg_widget.dart b/lib/widgets/others/mine_header_bg_widget.dart index 9720abb..d91c602 100644 --- a/lib/widgets/others/mine_header_bg_widget.dart +++ b/lib/widgets/others/mine_header_bg_widget.dart @@ -1,70 +1,111 @@ -import 'dart:async'; - -import 'package:cached_network_image/cached_network_image.dart'; import 'package:flutter/material.dart'; +import 'package:provider/provider.dart'; +import 'package:zhiying_base_widget/pages/main_page/notifier/main_page_bg_notifier.dart'; class MineHeaderBgWidget extends StatefulWidget { + final ScrollController controller; + + const MineHeaderBgWidget({Key key, this.controller}) : super(key: key); + @override _MineHeaderBgWidgetState createState() => _MineHeaderBgWidgetState(); } class _MineHeaderBgWidgetState extends State { int zIndex = 0; - -// List list = ['ff0000', '00ff00', '0000ff', 'ffff00']; - List imageUrls = [ - 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599627593136&di=2aa824f43d4945dbeca31d5ccc587567&imgtype=0&src=http%3A%2F%2Ft8.baidu.com%2Fit%2Fu%3D1484500186%2C1503043093%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D853', - 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599627593136&di=c082ab4b39f0bc45e8cad60447db4ae2&imgtype=0&src=http%3A%2F%2Ft8.baidu.com%2Fit%2Fu%3D2247852322%2C986532796%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D853', - 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599627593136&di=b7535e61ed661806647bf1070e74f883&imgtype=0&src=http%3A%2F%2Ft7.baidu.com%2Fit%2Fu%3D3204887199%2C3790688592%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D4610%26h%3D2968', - 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599627593136&di=3b381359676404f5e42f6a663a0139f1&imgtype=0&src=http%3A%2F%2Ft9.baidu.com%2Fit%2Fu%3D3363001160%2C1163944807%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D830', - ]; - Timer timer; - - //setInterval控制当前动画元素的下标,实现动画轮播 - autoPlay() { - var second = const Duration(seconds: 2); - timer = Timer.periodic(second, (t) { - setState(() { - zIndex = (++zIndex) % imageUrls.length; - }); - }); - } + double _offsetY = 0; + double _height = 300; + _MineHeaderBgContainer _content; @override void initState() { super.initState(); - timer = Timer(Duration(seconds: 2), autoPlay); + _content = _MineHeaderBgContainer(); + + if (widget.controller != null) { + widget.controller.addListener(() { + if (widget.controller.offset > _height) { + // 减少重绘 + return; + } + _offsetY = -widget.controller.offset; + if (_offsetY > 0) { + _offsetY = 0; + } + setState(() {}); + }); + } } @override void dispose() { - if (timer != null) timer.cancel(); super.dispose(); } + @override + void didChangeDependencies() { + super.didChangeDependencies(); + print('didChangeDependencies'); + +// if (isNeedLoadMore && _provider != '') { +// print('HomeGoods loadmore...'); +// _bloc.loadMore(_provider); + } + + @override + Widget build(BuildContext context) { + print('mmine_hider_bg_widget build'); + return Transform.translate( + offset: Offset(0, _offsetY), + child: _content, + ); + } + +// @override +// Widget build(BuildContext context) { +// return Container( +// height: 300, +// width: double.infinity, +// child: Stack( +// children: imageUrls +// .asMap() +// .keys +// .map((i) => AnimatedOpacity( +// curve: Curves.easeIn, +// duration: Duration(milliseconds: 1600), +// opacity: i == zIndex ? 1 : 0, +// child: Container( +//// color: Color(int.parse(list[i], radix: 16)) +//// .withAlpha(255), +// child: CachedNetworkImage( +// imageUrl: imageUrls[i], +// fit: BoxFit.fill, +// ), +// height: 300, //100% +// ), +// )) +// .toList(), +// )); +// } +} + +class _MineHeaderBgContainer extends StatefulWidget { + @override + _MineHeaderBgContainerState createState() => _MineHeaderBgContainerState(); +} + +class _MineHeaderBgContainerState extends State<_MineHeaderBgContainer> { @override Widget build(BuildContext context) { - return Container( - height: 300, - width: double.infinity, - child: Stack( - children: imageUrls - .asMap() - .keys - .map((i) => AnimatedOpacity( - curve: Curves.easeIn, - duration: Duration(milliseconds: 1600), - opacity: i == zIndex ? 1 : 0, - child: Container( -// color: Color(int.parse(list[i], radix: 16)) -// .withAlpha(255), - child: CachedNetworkImage( - imageUrl: imageUrls[i], - ), - height: 300, //100% - ), - )) - .toList(), - )); + print('_MineHeaderBgContainerState build'); + return Consumer(builder: (context, model, widget) { + return Stack( + fit: StackFit.passthrough, + overflow: Overflow.clip, + children: [ + model.toWidget ?? Container(), + ], + ); + }); } }