diff --git a/assets/live/video_play.png b/assets/live/video_play.png new file mode 100644 index 0000000..0ca5609 Binary files /dev/null and b/assets/live/video_play.png differ diff --git a/lib/const/resource.dart b/lib/const/resource.dart index 594c678..44f597e 100644 --- a/lib/const/resource.dart +++ b/lib/const/resource.dart @@ -416,6 +416,9 @@ class R { /// ![preview](file:///Users/akufe/Desktop/recook_temp/assets/live/user.png) static const String ASSETS_LIVE_USER_PNG = 'assets/live/user.png'; + /// ![preview](file:///Users/akufe/Desktop/recook_temp/assets/live/video_play.png) + static const String ASSETS_LIVE_VIDEO_PLAY_PNG = 'assets/live/video_play.png'; + /// ![preview](file:///Users/akufe/Desktop/recook_temp/assets/login_logo.png) static const String ASSETS_LOGIN_LOGO_PNG = 'assets/login_logo.png'; diff --git a/lib/pages/live/live_stream/add_video_page.dart b/lib/pages/live/live_stream/add_video_page.dart new file mode 100644 index 0000000..3690df7 --- /dev/null +++ b/lib/pages/live/live_stream/add_video_page.dart @@ -0,0 +1,15 @@ +import 'package:flutter/material.dart'; + +class AddVideoPage extends StatefulWidget { + AddVideoPage({Key key}) : super(key: key); + + @override + _AddVideoPageState createState() => _AddVideoPageState(); +} + +class _AddVideoPageState extends State { + @override + Widget build(BuildContext context) { + return Scaffold(); + } +} diff --git a/lib/pages/live/live_stream/live_stream_page.dart b/lib/pages/live/live_stream/live_stream_page.dart new file mode 100644 index 0000000..72240cb --- /dev/null +++ b/lib/pages/live/live_stream/live_stream_page.dart @@ -0,0 +1,17 @@ +import 'package:flutter/material.dart'; + +class LiveStreamPage extends StatefulWidget { + LiveStreamPage({Key key}) : super(key: key); + + @override + _LiveStreamPageState createState() => _LiveStreamPageState(); +} + +class _LiveStreamPageState extends State { + @override + Widget build(BuildContext context) { + // return Container( + // child: child, + // ); + } +} diff --git a/lib/pages/live/sub_page/user_home_page.dart b/lib/pages/live/sub_page/user_home_page.dart index 3f8ced6..ec1bbe9 100644 --- a/lib/pages/live/sub_page/user_home_page.dart +++ b/lib/pages/live/sub_page/user_home_page.dart @@ -4,6 +4,7 @@ import 'package:recook/constants/styles.dart'; import 'package:recook/pages/live/sub_page/user_attention_page.dart'; import 'package:recook/pages/live/widget/sliver_bottom_persistent_delegate.dart'; import 'package:recook/pages/live/widget/user_activity_card.dart'; +import 'package:recook/pages/live/widget/user_live_playback_card.dart'; import 'package:recook/utils/custom_route.dart'; import 'package:recook/widgets/custom_image_button.dart'; import 'package:recook/widgets/recook_back_button.dart'; @@ -133,7 +134,7 @@ class _UserHomePageState extends State return UserActivityCard(); }), ListView.builder(itemBuilder: (context, index) { - return Text('test'); + return UserPlaybackCard(); }) ], ), diff --git a/lib/pages/live/widget/user_activity_card.dart b/lib/pages/live/widget/user_activity_card.dart index 4b510c3..34d6f1d 100644 --- a/lib/pages/live/widget/user_activity_card.dart +++ b/lib/pages/live/widget/user_activity_card.dart @@ -1,6 +1,7 @@ import 'package:flutter/material.dart'; import 'package:recook/constants/constants.dart'; import 'package:recook/constants/header.dart'; +import 'package:recook/pages/live/widget/user_base_card.dart'; import 'package:recook/widgets/custom_image_button.dart'; class UserActivityCard extends StatefulWidget { @@ -13,152 +14,119 @@ class UserActivityCard extends StatefulWidget { class _UserActivityCardState extends State { @override Widget build(BuildContext context) { - return Padding( - padding: EdgeInsets.all(rSize(15)), - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - SizedBox( - width: rSize(45), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - Text( - '昨天', - style: TextStyle( - color: Color(0xFF333333), - fontSize: rSP(18), - ), - ), - SizedBox(height: rSize(10)), - Text( - '14:30', - style: TextStyle( - color: Color(0xFF666666), - fontSize: rSP(14), - ), - ), - ], - ), + return UserBaseCard( + date: '昨天', + detailDate: '14:30', + children: [ + SizedBox(height: rSize(35)), + GridView( + gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 3, + crossAxisSpacing: rSize(9), + mainAxisSpacing: rSize(9), ), - Expanded( - child: Column( - mainAxisSize: MainAxisSize.min, - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - SizedBox(height: rSize(35)), - GridView( - gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( - crossAxisCount: 3, - crossAxisSpacing: rSize(9), - mainAxisSpacing: rSize(9), - ), - physics: NeverScrollableScrollPhysics(), - children: [ - Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), - Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), - Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), - ], - shrinkWrap: true, - ), - Padding( - padding: EdgeInsets.symmetric( - vertical: rSize(10), - ), - child: Text( - '''麦饭石不粘锅炒锅具家用平底电磁炉适用燃煤气灶专用炒菜锅 + physics: NeverScrollableScrollPhysics(), + children: [ + Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), + Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), + Image.asset(R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG), + ], + shrinkWrap: true, + ), + Padding( + padding: EdgeInsets.symmetric( + vertical: rSize(10), + ), + child: Text( + '''麦饭石不粘锅炒锅具家用平底电磁炉适用燃煤气灶专用炒菜锅 下单立减20元,凑单满300再减30,正品保证''', - style: TextStyle( - color: Color(0xFF333333), - fontSize: rSP(14), - ), - ), - ), - Container( - color: Color(0xFFF2F4F7), - padding: EdgeInsets.all(12), - child: Row( - children: [ - Image.asset( - R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG, - height: rSize(48), - width: rSize(48), - ), - SizedBox(width: rSize(12)), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - '左家右厨16cm迷煎盘', - maxLines: 1, - style: TextStyle( - color: Color(0xFF333333), - fontSize: rSP(14), - ), - ), - SizedBox(height: rSize(6)), - Text( - '¥199', - maxLines: 1, - style: TextStyle( - color: Color(0xFF333333), - fontSize: rSP(14), - ), - ), - ], - ), - ), - CustomImageButton( - child: Image.asset( - R.ASSETS_HOME_PAGE_ROW_SHARE_ICON_PNG, - width: rSize(18), - height: rSize(18), - ), - onPressed: () {}, - ), - SizedBox(width: rSize(10)), - ], - ), - ), - Row( + style: TextStyle( + color: Color(0xFF333333), + fontSize: rSP(14), + ), + ), + ), + Container( + color: Color(0xFFF2F4F7), + padding: EdgeInsets.all(12), + child: Row( + children: [ + Image.asset( + R.ASSETS_PLACEHOLDER_NEW_1X1_A_PNG, + height: rSize(48), + width: rSize(48), + ), + SizedBox(width: rSize(12)), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ - CustomImageButton( - padding: EdgeInsets.only(top: rSize(10)), - child: Image.asset( - R.ASSETS_LIVE_MORE_PNG, - width: rSize(18), - height: rSize(18), - ), - onPressed: () {}, - ), - Spacer(), - CustomImageButton( - padding: EdgeInsets.only(top: rSize(10)), - child: Image.asset( - R.ASSETS_LIVE_REVIEW_PNG, - width: rSize(18), - height: rSize(18), + Text( + '左家右厨16cm迷煎盘', + maxLines: 1, + style: TextStyle( + color: Color(0xFF333333), + fontSize: rSP(14), ), - onPressed: _showReviewDialog, ), - SizedBox(width: rSize(10)), - CustomImageButton( - padding: EdgeInsets.only(top: rSize(10)), - child: Image.asset( - R.ASSETS_LIVE_LIKE_PNG, - width: rSize(18), - height: rSize(18), + SizedBox(height: rSize(6)), + Text( + '¥199', + maxLines: 1, + style: TextStyle( + color: Color(0xFF333333), + fontSize: rSP(14), ), - onPressed: () {}, ), ], ), - ], - ), + ), + CustomImageButton( + child: Image.asset( + R.ASSETS_HOME_PAGE_ROW_SHARE_ICON_PNG, + width: rSize(18), + height: rSize(18), + ), + onPressed: () {}, + ), + SizedBox(width: rSize(10)), + ], ), - ], - ), + ), + Row( + children: [ + CustomImageButton( + padding: EdgeInsets.only(top: rSize(10)), + child: Image.asset( + R.ASSETS_LIVE_MORE_PNG, + width: rSize(18), + height: rSize(18), + ), + onPressed: () {}, + ), + Spacer(), + CustomImageButton( + padding: EdgeInsets.only(top: rSize(10)), + child: Image.asset( + R.ASSETS_LIVE_REVIEW_PNG, + width: rSize(18), + height: rSize(18), + ), + onPressed: _showReviewDialog, + ), + SizedBox(width: rSize(10)), + CustomImageButton( + padding: EdgeInsets.only(top: rSize(10)), + child: Image.asset( + R.ASSETS_LIVE_LIKE_PNG, + width: rSize(18), + height: rSize(18), + ), + onPressed: () {}, + ), + ], + ), + ], ); } diff --git a/lib/pages/live/widget/user_base_card.dart b/lib/pages/live/widget/user_base_card.dart new file mode 100644 index 0000000..0775b69 --- /dev/null +++ b/lib/pages/live/widget/user_base_card.dart @@ -0,0 +1,62 @@ +import 'package:flutter/material.dart'; +import 'package:recook/constants/constants.dart'; +import 'package:recook/constants/header.dart'; + +class UserBaseCard extends StatefulWidget { + final String date; + final String detailDate; + final List children; + UserBaseCard({ + Key key, + @required this.date, + @required this.detailDate, + @required this.children, + }) : super(key: key); + + @override + _UserBaseCardState createState() => _UserBaseCardState(); +} + +class _UserBaseCardState extends State { + @override + Widget build(BuildContext context) { + return Padding( + padding: EdgeInsets.all(rSize(15)), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox( + width: rSize(45), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + Text( + widget.date, + style: TextStyle( + color: Color(0xFF333333), + fontSize: rSP(18), + ), + ), + SizedBox(height: rSize(10)), + Text( + widget.detailDate, + style: TextStyle( + color: Color(0xFF666666), + fontSize: rSP(14), + ), + ), + ], + ), + ), + Expanded( + child: Column( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.stretch, + children: widget.children, + ), + ), + ], + ), + ); + } +} diff --git a/lib/pages/live/widget/user_live_playback_card.dart b/lib/pages/live/widget/user_live_playback_card.dart new file mode 100644 index 0000000..8604cde --- /dev/null +++ b/lib/pages/live/widget/user_live_playback_card.dart @@ -0,0 +1,88 @@ +import 'package:flutter/material.dart'; +import 'package:recook/constants/header.dart'; +import 'package:recook/pages/live/widget/user_base_card.dart'; + +class UserPlaybackCard extends StatefulWidget { + UserPlaybackCard({Key key}) : super(key: key); + + @override + _UserPlaybackCardState createState() => _UserPlaybackCardState(); +} + +class _UserPlaybackCardState extends State { + @override + Widget build(BuildContext context) { + return UserBaseCard( + date: '今天', + detailDate: '14:30', + children: [ + SizedBox(height: rSize(35)), + Row( + children: [ + Container( + padding: EdgeInsets.only(right: rSize(5)), + decoration: BoxDecoration( + color: Color(0xFF050505).withOpacity(0.18), + borderRadius: BorderRadius.circular(rSize(2)), + ), + height: rSize(20), + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + Image.asset(R.ASSETS_LIVE_ON_STREAM_PNG), + SizedBox(width: rSize(5)), + Text( + '正在直播中', + style: TextStyle( + fontSize: rSP(12), + height: 1, + ), + ), + ], + ), + ) + ], + ), + Padding( + padding: EdgeInsets.symmetric(vertical: rSize(5)), + child: Text( + '一波清仓大福利来袭,请速速收下', + style: TextStyle( + color: Color(0xFF333333), + fontSize: rSP(16), + fontWeight: FontWeight.bold, + ), + ), + ), + Text( + '999人观看 | 24个宝贝', + style: TextStyle( + color: Color(0xFF999999), + fontSize: rSP(12), + ), + ), + SizedBox( + height: rSize(15), + ), + Row( + children: [ + Container( + alignment: Alignment.center, + child: Image.asset( + R.ASSETS_LIVE_VIDEO_PLAY_PNG, + height: rSize(34), + width: rSize(34), + ), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(rSize(4)), + color: Colors.blue, + ), + height: rSize(234), + width: rSize(234), + ) + ], + ), + ], + ); + } +} diff --git a/lib/pages/tabBar/TabbarWidget.dart b/lib/pages/tabBar/TabbarWidget.dart index 28d3b20..16c97cf 100644 --- a/lib/pages/tabBar/TabbarWidget.dart +++ b/lib/pages/tabBar/TabbarWidget.dart @@ -13,6 +13,7 @@ import 'package:recook/constants/styles.dart'; import 'package:recook/manager/user_manager.dart'; import 'package:recook/pages/business/business_page.dart'; import 'package:recook/pages/home/home_page.dart'; +import 'package:recook/pages/live/live_stream/add_video_page.dart'; import 'package:recook/pages/live/pages/discovery_page.dart'; import 'package:recook/pages/live/widget/live_fab_location.dart'; import 'package:recook/pages/shop/widget/normal_shop_page.dart'; @@ -20,6 +21,7 @@ import 'package:recook/pages/shopping_cart/shopping_cart_page.dart'; import 'package:recook/pages/user/user_page.dart'; import 'package:recook/third_party/bugly_helper.dart'; import 'package:recook/utils/app_router.dart'; +import 'package:recook/utils/custom_route.dart'; import 'package:recook/utils/print_util.dart'; import 'package:recook/utils/versionInfo/version_tool.dart'; import 'package:recook/widgets/cache_tab_bar_view.dart'; @@ -97,9 +99,13 @@ class _TabBarWidgetState extends State top: Radius.circular(rSize(15))), ), child: Builder(builder: (context) { - verticalButton(String title, String path) { + verticalButton( + String title, + String path, { + VoidCallback onTap, + }) { return CustomImageButton( - onPressed: () {}, + onPressed: onTap, child: Column( mainAxisSize: MainAxisSize.min, children: [ @@ -134,14 +140,18 @@ class _TabBarWidgetState extends State verticalButton( '直播', R.ASSETS_LIVE_ADD_STREAM_PNG, + onTap: () {}, ), verticalButton( '视频', R.ASSETS_LIVE_ADD_VIDEO_PNG, + onTap: () => CRoute.push( + context, AddVideoPage()), ), verticalButton( '图文', R.ASSETS_LIVE_ADD_IMAGE_PNG, + onTap: () {}, ), ], ),