From 3e30fd545aa53bdc7f989835b297aae28f658e3c Mon Sep 17 00:00:00 2001 From: WDIPL Date: Tue, 6 Aug 2024 17:11:40 +0530 Subject: [PATCH] common comment tree --- lib/Common/CommonGlassmorphism.dart | 2 - lib/Common/CommonPostUI.dart | 401 ++++++++++++++++++ lib/Common/ReactionIcons.dart | 12 + .../Community_HomePage/Community.dart | 2 +- .../View/PostDetailScreen.dart | 118 +++--- .../Community_HomePage/PostScreen.dart | 1 + lib/main.dart | 2 +- 7 files changed, 473 insertions(+), 65 deletions(-) create mode 100644 lib/Common/CommonPostUI.dart create mode 100644 lib/Common/ReactionIcons.dart diff --git a/lib/Common/CommonGlassmorphism.dart b/lib/Common/CommonGlassmorphism.dart index 1054f77..d049b60 100644 --- a/lib/Common/CommonGlassmorphism.dart +++ b/lib/Common/CommonGlassmorphism.dart @@ -13,8 +13,6 @@ Widget commonGlassContainer({ Color borderColor = const Color(0xff434A53), }) { return - - GlassmorphicContainer( width: width, height: height, diff --git a/lib/Common/CommonPostUI.dart b/lib/Common/CommonPostUI.dart new file mode 100644 index 0000000..32e31e2 --- /dev/null +++ b/lib/Common/CommonPostUI.dart @@ -0,0 +1,401 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_reaction_button/flutter_reaction_button.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:get/get.dart'; +import 'package:regroup/Common/CommonGlassmorphism.dart'; +import 'package:regroup/Common/CommonWidget.dart'; +import 'package:regroup/Main_Screens/Community_HomePage/Community.dart'; +import 'package:regroup/Utils/Common/sized_box.dart'; +import 'package:regroup/Utils/texts.dart'; +import 'package:regroup/resources/routes/route_name.dart'; + +class CommonPostUI extends StatefulWidget { + CommonPostUI( + {super.key, + required this.containerTitle, + required this.mainImg, + required this.profileImg, + required this.title}); + + String profileImg = ""; + String title = ""; + String mainImg = ""; + List containerTitle = []; + + @override + State createState() => _CommonPostUIState(); +} + +class _CommonPostUIState extends State { + @override + Widget build(BuildContext context) { + return postCards( + containerTitle: widget.containerTitle, + profileImg: widget.profileImg, + title: widget.title, + mainImg: widget.mainImg, + ); + } + + Widget postCards({ + required String profileImg, + required String title, + required String mainImg, + required List containerTitle, + }) { + var mainImage = 'assets/images/png/uiw_like-o.png'.obs; + void updateImage(String reaction) { + if (reaction == 'like') { + mainImage.value = 'assets/images/png/f7_hand-thumbsup.png'; + } else if (reaction == 'heart') { + mainImage.value = 'assets/images/png/heart 2.png'; + } else if (reaction == 'party') { + mainImage.value = 'assets/images/png/party-popper 2.png'; + } + } + + return commonGlassUI( + width: double.infinity, + height: 570.h, + borderwidth: 0, + borderRadius: BorderRadius.circular(0), + customWidget: Column( + children: [ + sizedBoxHeight(25.h), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + CircleAvatar( + foregroundImage: AssetImage(profileImg), + radius: 25.r, + ), + sizedBoxWidth(12.w), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + children: [ + text16w400_FCFCFC(title), + const Spacer(), + commonGlassUI( + width: 72.w, + height: 26.h, + borderRadius: BorderRadius.circular(5.r), + borderColor: const Color(0xFFD90B2E), + customWidget: + Center(child: text14400white("Follow")), + borderwidth: 1), + sizedBoxWidth(6.w), + PopupMenuButton( + surfaceTintColor: const Color(0xFF222935), + constraints: + BoxConstraints.tightFor(width: 176.w), + offset: const Offset(0, 50), + color: const Color(0xFF222935), + tooltip: "", + itemBuilder: (BuildContext context) => + [ + PopupMenuItem( + onTap: () {}, + child: Padding( + padding: + EdgeInsets.symmetric(horizontal: 12.w), + child: Row( + children: [ + Text( + 'Report Post', + style: TextStyle( + fontSize: 16.sp, + color: Colors.white, + fontWeight: FontWeight.w800, + fontFamily: "Nunito Sans", + ), + ), + const Spacer(), + Image.asset( + "assets/images/png/Vector (5).png", + height: 15.h, + width: 15.w, + ) + ], + ), + ), + ), + const PopupMenuDivider(), + PopupMenuItem( + onTap: () {}, + child: Padding( + padding: + EdgeInsets.symmetric(horizontal: 12.w), + child: Row( + children: [ + Text( + 'Share post', + style: TextStyle( + fontSize: 16.sp, + color: Colors.white, + fontWeight: FontWeight.w800, + fontFamily: "Nunito Sans", + ), + ), + const Spacer(), + Image.asset( + "assets/images/png/share.png", + height: 20.h, + width: 20.w, + ) + ], + ), + ), + ), + const PopupMenuDivider(), + PopupMenuItem( + onTap: () {}, + child: Padding( + padding: + EdgeInsets.symmetric(horizontal: 12.w), + child: Row( + children: [ + Text( + 'Pin', + style: TextStyle( + fontSize: 16.sp, + color: Colors.white, + fontWeight: FontWeight.w800, + fontFamily: "Nunito Sans", + ), + ), + const Spacer(), + Image.asset( + "assets/images/png/f7_pin-fill (2).png", + height: 25.h, + width: 25.w, + ) + ], + ), + ), + ), + ], + child: Image.asset( + 'assets/images/png/Group 1000004071.png', + width: 16.w, + height: 18.h, + ), + ), + ], + ), + sizedBoxHeight(5.h), + Row( + children: [ + Image.asset( + 'assets/images/png/community 1 (traced).png', + height: 14.w, + width: 14.w, + ), + sizedBoxWidth(7.w), + text12w400_FCFCFC('Active alliance network'), + sizedBoxWidth(7.w), + Icon( + Icons.circle, + color: const Color(0xFFFCFCFC), + size: 4.sp, + ), + sizedBoxWidth(6.w), + text12w400_FCFCFC('1 Hour ago'), + ], + ) + ], + ), + ), + ], + ), + ), + sizedBoxHeight(20.h), + GestureDetector( + onTap: () { + // Get.toNamed(RouteName.postdetailsScreen); + }, + child: SizedBox( + height: 163.h, + width: double.infinity, + child: Image.asset( + mainImg, + fit: BoxFit.cover, + ), + )), + sizedBoxHeight(20.h), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w), + child: Column(children: [ + SizedBox( + height: 30.h, + child: ListView.builder( + scrollDirection: Axis.horizontal, + shrinkWrap: true, + itemCount: containerTitle.length, + itemBuilder: (context, index) { + return Padding( + padding: EdgeInsets.only(right: 12.w), + child: GestureDetector( + onTap: () { + Get.toNamed(RouteName.cyclescreen); + }, + child: containertile(text: containerTitle[index])), + ); + }, + ), + ), + sizedBoxHeight(20.h), + text16w400_FCFCFC( + "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s . . ."), + Row(children: [ + stackReaction(number: '20', containerImages: [ + 'assets/images/png/f7_hand-thumbsup.png', + 'assets/images/png/heart 2.png', + 'assets/images/png/party-popper 2.png' + ]), + const Spacer(), + commonGlassUI( + borderwidth: 0.9, + width: 30.w, + height: 30.h, + borderRadius: BorderRadius.circular(100.r), + customWidget: Center( + child: Image.asset( + 'assets/images/png/Frame 1000004088.png', + height: 13.h, + width: 13.w, + ), + ), + ), + sizedBoxWidth(12.w), + text14w400_FCFCFC('20'), + sizedBoxWidth(20.w), + commonGlassUI( + borderwidth: 0.9, + width: 30.w, + height: 30.h, + borderRadius: BorderRadius.circular(100.r), + customWidget: Center( + child: Image.asset( + 'assets/images/png/Vector (1).png', + height: 12.h, + width: 12.w, + ), + ), + ), + sizedBoxWidth(12.w), + text14w400_FCFCFC('10'), + ]), + sizedBoxHeight(12.h), + commonDivider(), + sizedBoxHeight(12.h), + Row( + mainAxisAlignment: MainAxisAlignment.spaceAround, + children: [ + Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Obx(() { + return ReactionButton( + onReactionChanged: (reaction) { + updateImage(reaction?.value ?? 'like'); + debugPrint('Selected value: ${reaction?.value}'); + }, + reactions: ?>[ + Reaction( + value: 'like', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + icon: _buildReactionsIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + ), + Reaction( + value: 'heart', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/heart 2.png'), + icon: _buildReactionsIcon( + 'assets/images/png/heart 2.png'), + ), + Reaction( + value: 'party', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/party-popper 2.png'), + icon: _buildReactionsIcon( + 'assets/images/png/party-popper 2.png'), + ), + ], + selectedReaction: Reaction( + value: 'like', + icon: _buildReactionsIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + ), + boxColor: Colors.white, + boxElevation: 9, + boxRadius: 30, + itemsSpacing: 8, + itemScale: 0.4, + itemSize: const Size(45, 45), + boxPadding: const EdgeInsets.all(8), + boxAnimationDuration: + const Duration(milliseconds: 200), + itemAnimationDuration: + const Duration(milliseconds: 500), + hoverDuration: const Duration(milliseconds: 700), + // toggle: false, + + child: _buildReactionsIcon(mainImage.value), + ); + }) + ], + ), + Column( + children: [ + Image.asset( + 'assets/images/png/Frame 1000004089.png', + height: 19.h, + width: 19.w, + ), + sizedBoxHeight(8.h), + text11w400_FCFCFC('Save') + ], + ) + ], + ), + sizedBoxHeight(12.h), + commonDivider(), + sizedBoxHeight(12.h), + ]), + ), + ], + )); + } + + Widget _buildReactionsPreviewIcon(String assetPath) { + return Padding( + padding: const EdgeInsets.all(8.0), + child: Image.asset( + assetPath, + height: 40.h, + width: 40.w, + ), + ); + } + + Widget _buildReactionsIcon(String assetPath) { + return Column( + children: [ + Image.asset( + assetPath, + height: 19.h, + width: 19.w, + ), + sizedBoxHeight(8.h), + text11w400_FCFCFC('Like') + ], + ); + } +} diff --git a/lib/Common/ReactionIcons.dart b/lib/Common/ReactionIcons.dart new file mode 100644 index 0000000..c842601 --- /dev/null +++ b/lib/Common/ReactionIcons.dart @@ -0,0 +1,12 @@ +import 'package:flutter/material.dart'; + +class ReactionActions extends StatelessWidget { + const ReactionActions({super.key}); + + @override + Widget build(BuildContext context) { + return const Placeholder(); + } + + +} \ No newline at end of file diff --git a/lib/Main_Screens/Community_HomePage/Community.dart b/lib/Main_Screens/Community_HomePage/Community.dart index 8eeb91b..394bb84 100644 --- a/lib/Main_Screens/Community_HomePage/Community.dart +++ b/lib/Main_Screens/Community_HomePage/Community.dart @@ -137,7 +137,7 @@ class _CommunityScreenState extends State { decoration: BoxDecoration( // shape: BoxShape.rectangle, borderRadius: BorderRadius.circular(30.r), - boxShadow: [ + boxShadow: const [ BoxShadow( color: Color(0x40000000), offset: Offset(0, 6), diff --git a/lib/Main_Screens/Community_HomePage/PostDetailScreen/View/PostDetailScreen.dart b/lib/Main_Screens/Community_HomePage/PostDetailScreen/View/PostDetailScreen.dart index 12faecd..b4eccee 100644 --- a/lib/Main_Screens/Community_HomePage/PostDetailScreen/View/PostDetailScreen.dart +++ b/lib/Main_Screens/Community_HomePage/PostDetailScreen/View/PostDetailScreen.dart @@ -496,7 +496,7 @@ class _PostDetailsScreenState extends State { sizedBoxHeight(20.h), GestureDetector( onTap: () { - Get.toNamed(RouteName.postdetailsScreen); + // Get.toNamed(RouteName.postdetailsScreen); }, child: SizedBox( height: 163.h, @@ -576,67 +576,60 @@ class _PostDetailsScreenState extends State { Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceAround, + Column( + mainAxisAlignment: MainAxisAlignment.center, children: [ - Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Obx(() { - return ReactionButton( - onReactionChanged: (reaction) { - updateImage(reaction?.value ?? 'like'); - debugPrint( - 'Selected value: ${reaction?.value}'); - }, - reactions: ?>[ - Reaction( - value: 'like', - previewIcon: _buildReactionsPreviewIcon( - 'assets/images/png/f7_hand-thumbsup.png'), - icon: _buildReactionsIcon( - 'assets/images/png/f7_hand-thumbsup.png'), - ), - Reaction( - value: 'heart', - previewIcon: _buildReactionsPreviewIcon( - 'assets/images/png/heart 2.png'), - icon: _buildReactionsIcon( - 'assets/images/png/heart 2.png'), - ), - Reaction( - value: 'party', - previewIcon: _buildReactionsPreviewIcon( - 'assets/images/png/party-popper 2.png'), - icon: _buildReactionsIcon( - 'assets/images/png/party-popper 2.png'), - ), - ], - selectedReaction: Reaction( - value: 'like', - icon: _buildReactionsIcon( - 'assets/images/png/f7_hand-thumbsup.png'), - ), - boxColor: Colors.white, - boxElevation: 9, - boxRadius: 30, - itemsSpacing: 8, - itemScale: 0.4, - itemSize: const Size(45, 45), - boxPadding: const EdgeInsets.all(8), - boxAnimationDuration: - const Duration(milliseconds: 200), - itemAnimationDuration: - const Duration(milliseconds: 500), - hoverDuration: - const Duration(milliseconds: 700), - // toggle: false, + Obx(() { + return ReactionButton( + onReactionChanged: (reaction) { + updateImage(reaction?.value ?? 'like'); + debugPrint('Selected value: ${reaction?.value}'); + }, + reactions: ?>[ + Reaction( + value: 'like', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + icon: _buildReactionsIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + ), + Reaction( + value: 'heart', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/heart 2.png'), + icon: _buildReactionsIcon( + 'assets/images/png/heart 2.png'), + ), + Reaction( + value: 'party', + previewIcon: _buildReactionsPreviewIcon( + 'assets/images/png/party-popper 2.png'), + icon: _buildReactionsIcon( + 'assets/images/png/party-popper 2.png'), + ), + ], + selectedReaction: Reaction( + value: 'like', + icon: _buildReactionsIcon( + 'assets/images/png/f7_hand-thumbsup.png'), + ), + boxColor: Colors.white, + boxElevation: 9, + boxRadius: 30, + itemsSpacing: 8, + itemScale: 0.4, + itemSize: const Size(45, 45), + boxPadding: const EdgeInsets.all(8), + boxAnimationDuration: + const Duration(milliseconds: 200), + itemAnimationDuration: + const Duration(milliseconds: 500), + hoverDuration: const Duration(milliseconds: 700), + // toggle: false, - child: _buildReactionsIcon(mainImage.value), - ); - }) - ], - ), + child: _buildReactionsIcon(mainImage.value), + ); + }) ], ), Column( @@ -666,7 +659,7 @@ class _PostDetailsScreenState extends State { borderwidth: 0.9, width: 100.w, height: 30.h, - borderRadius: BorderRadius.circular( 30.r), + borderRadius: BorderRadius.circular(30.r), borderColor: const Color(0xFFD90B2E), customWidget: Padding( padding: EdgeInsets.symmetric(horizontal: 10.w), @@ -698,4 +691,7 @@ class _PostDetailsScreenState extends State { ], ); } + } + + diff --git a/lib/Main_Screens/Community_HomePage/PostScreen.dart b/lib/Main_Screens/Community_HomePage/PostScreen.dart index 0d983f2..5be5c47 100644 --- a/lib/Main_Screens/Community_HomePage/PostScreen.dart +++ b/lib/Main_Screens/Community_HomePage/PostScreen.dart @@ -822,6 +822,7 @@ class _PostScreenState extends State { ); }); } + } class CustomDropDownCheckBoxPostNew extends StatefulWidget { diff --git a/lib/main.dart b/lib/main.dart index 7f36095..0498ee0 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -133,5 +133,5 @@ class _MyAppState extends State with WidgetsBindingObserver { ), designSize: const Size(390, 844), ); - } + } }