diff --git a/lib/Common/CommonBottomNavigationBar.dart b/lib/Common/CommonBottomNavigationBar.dart index 77e29d7..34f5a91 100644 --- a/lib/Common/CommonBottomNavigationBar.dart +++ b/lib/Common/CommonBottomNavigationBar.dart @@ -2,35 +2,30 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:glassmorphism/glassmorphism.dart'; +import 'package:glassmorphism_ui/glassmorphism_ui.dart'; +import 'package:regroup/Common/CommonGlassmorphism.dart'; import 'package:regroup/Common/controller/MainController.dart'; -GlassmorphicContainer bottomnavigationbar(MainController _mainController) { - return GlassmorphicContainer( +GlassContainer bottomnavigationbar(MainController _mainController) { + return GlassContainer( width: double.infinity, - height: 100.h, - borderRadius: 2, + height: 100, + borderRadius: BorderRadius.circular(2), blur: 6, - alignment: Alignment.center, - border: 0, - linearGradient: LinearGradient( - begin: Alignment.topLeft, - end: Alignment.bottomRight, - colors: [ - Colors.white.withOpacity(0.04), - const Color(0xFFFFFFFF).withOpacity(0.05), - ], - stops: const [ - 0.1, - 1, - ]), - borderGradient: const LinearGradient( + opacity: 0.2, + gradient: LinearGradient( begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [ - Colors.transparent, - Colors.transparent, + Color(0xFFFFFFFF).withOpacity(0.4), + const Color(0xFFFFFFFF).withOpacity(0.5), + ], + stops: const [ + 0.1, + 1, ], ), + border: Border.all(color: const Color(0xff434A53)), child: BottomNavigationBar( type: BottomNavigationBarType.fixed, backgroundColor: const Color(0xFFFFFFFF).withOpacity(0), diff --git a/lib/Common/CommonGlassmorphism.dart b/lib/Common/CommonGlassmorphism.dart index f779dd3..0283a55 100644 --- a/lib/Common/CommonGlassmorphism.dart +++ b/lib/Common/CommonGlassmorphism.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:glassmorphism/glassmorphism.dart'; +import 'package:glassmorphism_ui/glassmorphism_ui.dart'; Widget commonGlassContainer({ required double width, @@ -78,3 +79,68 @@ Widget commonGlassContainerblue({ ), child: customWidget); } + +Widget commonGlassUIBlue({ + required double width, + required double height, + required Widget customWidget, + // required double border, + double mainOpacity = 0.05, + Color borderColor = const Color(0xff434A53), + required BorderRadius? borderRadius, +}) { + return GlassContainer( + width: width, + height: height, + borderRadius: borderRadius, + blur: 6, + opacity: mainOpacity, + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFF009DAB).withOpacity(0.48), + Color(0xFF009DAB).withOpacity(0.12), + ], + stops: const [ + 0.1, + 1, + ], + ), + border: Border.all(color: borderColor), + child: customWidget); +} + +Widget commonGlassUI({ + required double width, + required double height, + // required double border, + double mainOpacity = 1, + double opacity1 = 0.04, + double opacity2 = 0.05, + Color borderColor = const Color(0xff434A53), + double borderwidth = 1.0, + required BorderRadius? borderRadius, + required Widget customWidget, +}) { + return GlassContainer( + width: width, + height: height, + borderRadius: borderRadius, + blur: 6, + opacity: mainOpacity, + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFFFFFFFF).withOpacity(opacity1), + const Color(0xFFFFFFFF).withOpacity(opacity2), + ], + stops: const [ + 0.1, + 1, + ], + ), + border: Border.all(color: borderColor, width: borderwidth), + child: customWidget); +} diff --git a/lib/Common/CommonWidget.dart b/lib/Common/CommonWidget.dart index 38e2f2a..9a2bf5c 100644 --- a/lib/Common/CommonWidget.dart +++ b/lib/Common/CommonWidget.dart @@ -312,20 +312,22 @@ Widget stackReaction({ return Positioned( top: 6.h, left: index * 23.w, - child: commonGlassContainer( - width: 30.w, - height: 30.h, - borderradius: 100, - opacity1: 0.05, - opacity2: 0.06, - customWidget: Center( - child: Image.asset( - containerImages[index], - height: 18.h, - width: 18.w, - ), + child: commonGlassUI( + width: 30.w, + height: 30.h, + mainOpacity: 1, + opacity1: 0.05, + opacity2: 0.06, + borderRadius: BorderRadius.circular(100), + + customWidget: Center( + child: Image.asset( + containerImages[index], + height: 18.h, + width: 18.w, ), - border: 1.71)); + ), + )); }), ), ), diff --git a/lib/Feed Module/Main_Screens/Community/Community.dart b/lib/Feed Module/Main_Screens/Community/Community.dart index 30f6234..b250f4e 100644 --- a/lib/Feed Module/Main_Screens/Community/Community.dart +++ b/lib/Feed Module/Main_Screens/Community/Community.dart @@ -175,11 +175,11 @@ Widget feedTab() { mainImg: 'assets/images/png/Rectangle 24.png', containerTitle: ['Cycle', 'Marathon', 'Events', 'Marathon', 'Events']), sizedBoxHeight(20.h), - // announcecardtile( - // profileImg: 'assets/images/png/Ellipse 48.png', - // title: 'Jocelyn Dokidis', - // mainImg: 'assets/images/png/Rectangle 46.png', - // containerTitle: ['Race', 'Swimming', 'Events', 'Marathon', 'Events']), + announcecardtile( + profileImg: 'assets/images/png/Ellipse 48.png', + title: 'Jocelyn Dokidis', + mainImg: 'assets/images/png/Rectangle 46.png', + containerTitle: ['Race', 'Swimming', 'Events', 'Marathon', 'Events']), sizedBoxHeight(20.h), normalcardtile2( profileImg: 'assets/images/png/Ellipse 52.png', @@ -193,29 +193,6 @@ Widget feedTab() { 'Events' ]), sizedBoxHeight(20.h), - normalcardtile2( - profileImg: 'assets/images/png/Ellipse 52.png', - title: 'Ryan Dorwat', - mainImg: 'assets/images/png/Rectangle 25.png', - containerTitle: [ - 'Football', - 'Teams player', - 'Events', - 'Marathon', - 'Events' - ]), - sizedBoxHeight(20.h), - normalcardtile2( - profileImg: 'assets/images/png/Ellipse 52.png', - title: 'Ryan Dorwat', - mainImg: 'assets/images/png/Rectangle 25.png', - containerTitle: [ - 'Football', - 'Teams player', - 'Events', - 'Marathon', - 'Events' - ]), ])); } @@ -236,34 +213,12 @@ Widget normalcardtile2({ } } - return GlassContainer( - height: 570.h, + return commonGlassUI( width: double.infinity, + height: 570.h, + mainOpacity: 1, borderRadius: BorderRadius.circular(1), - blur: 6, - opacity: 0.04, - gradient: LinearGradient( - begin: Alignment.topLeft, - end: Alignment.bottomRight, - colors: [ - Color(0xFFFFFFFF).withOpacity(0.4), - const Color(0xFFFFFFFF).withOpacity(0.5), - ], - stops: const [ - 0.1, - 1, - ], - ), - border: Border.all(color: Color(0xff434A53)), - // borderGradient: LinearGradient( - // begin: Alignment.topLeft, - // end: Alignment.bottomRight, - // colors: [ - // borderColor, - // borderColor, - // ], - // ), - child: Column( + customWidget: Column( children: [ sizedBoxHeight(25.h), Padding( @@ -438,45 +393,25 @@ Widget normalcardtile2({ text16w400_FCFCFC( "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s . . ."), Row(children: [ - // InkWell( - // onTap: () { - // Get.toNamed(RouteName.reactionview); - // }, - // child: stackReaction(number: '20', containerImages: [ - // 'assets/images/png/f7_hand-thumbsup.png', - // 'assets/images/png/heart 2.png', - // 'assets/images/png/party-popper 2.png' - // ]), - // ), + InkWell( + onTap: () { + Get.toNamed(RouteName.reactionview); + }, + child: 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(), - GlassContainer( - height: 30.h, + commonGlassUI( width: 30.w, - opacity: 0.2, + height: 30.h, borderRadius: BorderRadius.circular(100), - blur: 6, - gradient: LinearGradient( - begin: Alignment.topLeft, - end: Alignment.bottomRight, - colors: [ - Color(0xFFFFFFFF).withOpacity(0.5), - const Color(0xFFFFFFFF).withOpacity(0.6), - ], - stops: const [ - 0.1, - 1, - ], - ), - border: Border.all(color: Color(0xff434A53)), - // borderGradient: LinearGradient( - // begin: Alignment.topLeft, - // end: Alignment.bottomRight, - // colors: [ - // borderColor, - // borderColor, - // ], - // ), - child: Center( + mainOpacity: 0.4, + opacity1: 0.5, + opacity2: 0.6, + customWidget: Center( child: Image.asset( 'assets/images/png/Frame 1000004088.png', height: 13.h, @@ -487,34 +422,14 @@ Widget normalcardtile2({ sizedBoxWidth(12.w), text14w400_FCFCFC('20'), sizedBoxWidth(20.w), - GlassContainer( - height: 30.h, + commonGlassUI( width: 30.w, + height: 30.h, borderRadius: BorderRadius.circular(100), - blur: 6, - opacity: 0.2, - gradient: LinearGradient( - begin: Alignment.topLeft, - end: Alignment.bottomRight, - colors: [ - Color(0xFFFFFFFF).withOpacity(0.5), - const Color(0xFFFFFFFF).withOpacity(0.6), - ], - stops: const [ - 0.1, - 1, - ], - ), - border: Border.all(color: Color(0xff434A53)), - // borderGradient: LinearGradient( - // begin: Alignment.topLeft, - // end: Alignment.bottomRight, - // colors: [ - // borderColor, - // borderColor, - // ], - // ), - child: Center( + mainOpacity: 0.4, + opacity1: 0.5, + opacity2: 0.6, + customWidget: Center( child: Image.asset( 'assets/images/png/Vector (1).png', height: 12.h, @@ -627,356 +542,6 @@ Widget normalcardtile2({ )); } -Widget announcecardtile({ - 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'; - } - } - -// MediaQuery.of(context).size.height - return commonGlassContainerblue( - width: double.infinity, - height: 610.h, - border: 0, - borderradius: 1, - customWidget: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - sizedBoxHeight(25.h), - Padding( - padding: EdgeInsets.only(left: 16.w), - child: text16w700_FCFCFC("#Announcement"), - ), - 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), - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - text16w400_FCFCFC(title), - 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'), - ], - ) - ], - ), - const Spacer(), - 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, - ), - ), - sizedBoxWidth(5.w) - ], - ), - ), - sizedBoxHeight(20.h), - GestureDetector( - onTap: () { - // Get.toNamed(RouteName.postdetailsScreen); - }, - child: Container( - 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: [ - InkWell( - onTap: () { - // Get.toNamed(RouteName.reactionview); - }, - child: 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(), - commonGlassContainer( - border: 0.43, - width: 30.w, - height: 30.h, - opacity1: 0.05, - opacity2: 0.06, - borderradius: 100, - 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), - commonGlassContainer( - border: 0.43, - width: 30.w, - height: 30.h, - borderradius: 100, - opacity1: 0.05, - opacity2: 0.06, - 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), - ); - }) - ], - ), - GestureDetector( - onTap: () { - // Get.toNamed(RouteName.postdetailsScreen); - }, - child: Column( - children: [ - Image.asset( - 'assets/images/png/Frame 1000004088.png', - height: 19.h, - width: 19.w, - ), - sizedBoxHeight(8.h), - text11w400_FCFCFC('Comment') - ], - ), - ), - 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 normalcardtile({ required String profileImg, required String title, @@ -1323,6 +888,356 @@ Widget normalcardtile({ )); } +Widget announcecardtile({ + 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'; + } + } + +// MediaQuery.of(context).size.height + return commonGlassUIBlue( + width: double.infinity, + height: 610.h, + mainOpacity: 1, + borderRadius: BorderRadius.circular(1), + customWidget: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + sizedBoxHeight(25.h), + Padding( + padding: EdgeInsets.only(left: 16.w), + child: text16w700_FCFCFC("#Announcement"), + ), + 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), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + text16w400_FCFCFC(title), + 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'), + ], + ) + ], + ), + const Spacer(), + 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, + ), + ), + sizedBoxWidth(5.w) + ], + ), + ), + sizedBoxHeight(20.h), + GestureDetector( + onTap: () { + // Get.toNamed(RouteName.postdetailsScreen); + }, + child: Container( + 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: [ + InkWell( + onTap: () { + // Get.toNamed(RouteName.reactionview); + }, + child: 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(), + commonGlassContainer( + border: 0.43, + width: 30.w, + height: 30.h, + opacity1: 0.05, + opacity2: 0.06, + borderradius: 100, + 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), + commonGlassContainer( + border: 0.43, + width: 30.w, + height: 30.h, + borderradius: 100, + opacity1: 0.05, + opacity2: 0.06, + 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), + ); + }) + ], + ), + GestureDetector( + onTap: () { + // Get.toNamed(RouteName.postdetailsScreen); + }, + child: Column( + children: [ + Image.asset( + 'assets/images/png/Frame 1000004088.png', + height: 19.h, + width: 19.w, + ), + sizedBoxHeight(8.h), + text11w400_FCFCFC('Comment') + ], + ), + ), + 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), @@ -1362,34 +1277,15 @@ Widget containertile({required String text}) { } Widget containertile2({required String text}) { - return GlassContainer( - height: 30.h, + return commonGlassUI( width: 130.w, - // opacity: 0.2, - borderRadius: BorderRadius.circular(30), - blur: 6, - gradient: LinearGradient( - begin: Alignment.topLeft, - end: Alignment.bottomRight, - colors: [ - Color(0xFFFFFFFF).withOpacity(0.5), - const Color(0xFFFFFFFF).withOpacity(0.6), - ], - stops: const [ - 0.1, - 1, - ], - ), - border: Border.all(color: Color(0xFFD90B2E)), - // borderGradient: LinearGradient( - // begin: Alignment.topLeft, - // end: Alignment.bottomRight, - // colors: [ - // borderColor, - // borderColor, - // ], - // ), - child: Padding( + height: 30.h, + // mainOpacity: 0.2, + opacity1: 0.5, + opacity2: 0.6, + borderColor: const Color(0xFFD90B2E), + borderRadius: BorderRadius.circular(30.r), + customWidget: Padding( padding: EdgeInsets.symmetric(horizontal: 10.w), child: Center(child: text14w400_FCFCFC(text)), )); @@ -1400,7 +1296,7 @@ Widget popularTab() { child: Column( children: [ sizedBoxHeight(20.h), - normalcardtile( + normalcardtile2( profileImg: 'assets/images/png/Ellipse 43.png', title: 'Edward Hackket', mainImg: 'assets/images/png/Rectangle 24.png', @@ -1412,31 +1308,7 @@ Widget popularTab() { 'Events' ]), sizedBoxHeight(20.h), - normalcardtile( - profileImg: 'assets/images/png/Ellipse 52.png', - title: 'Edward Hackket', - mainImg: 'assets/images/png/Rectangle 25.png', - containerTitle: [ - 'Football', - 'Teams player', - 'Events', - 'Marathon', - 'Events' - ]), - sizedBoxHeight(20.h), - normalcardtile( - profileImg: 'assets/images/png/Ellipse 52.png', - title: 'Edward Hackket', - mainImg: 'assets/images/png/Rectangle 25.png', - containerTitle: [ - 'Football', - 'Teams player', - 'Events', - 'Marathon', - 'Events' - ]), - sizedBoxHeight(20.h), - normalcardtile( + normalcardtile2( profileImg: 'assets/images/png/Ellipse 52.png', title: 'Edward Hackket', mainImg: 'assets/images/png/Rectangle 25.png', @@ -1457,7 +1329,7 @@ Widget latestTab() { return SingleChildScrollView( child: Column(children: [ sizedBoxHeight(16.h), - normalcardtile( + normalcardtile2( profileImg: 'assets/images/png/Ellipse 43.png', title: 'Edward Hackket', mainImg: 'assets/images/png/Rectangle 24.png', @@ -1469,7 +1341,7 @@ Widget latestTab() { mainImg: 'assets/images/png/Rectangle 46.png', containerTitle: ['Race', 'Swimming', 'Events', 'Marathon', 'Events']), sizedBoxHeight(20.h), - normalcardtile( + normalcardtile2( profileImg: 'assets/images/png/Ellipse 52.png', title: 'Ryan Dorwat', mainImg: 'assets/images/png/Rectangle 25.png', diff --git a/lib/Feed Module/Main_Screens/ProfileTab/ProfileTab.dart b/lib/Feed Module/Main_Screens/ProfileTab/ProfileTab.dart index 368c7a7..59700f6 100644 --- a/lib/Feed Module/Main_Screens/ProfileTab/ProfileTab.dart +++ b/lib/Feed Module/Main_Screens/ProfileTab/ProfileTab.dart @@ -67,7 +67,8 @@ class _ProfileTabState extends State { Container( decoration: const BoxDecoration( image: DecorationImage( - image: AssetImage("assets/images/png/Ellipse 1496.png"), fit: BoxFit.fill)), + image: AssetImage("assets/images/png/Ellipse 1496.png"), + fit: BoxFit.fill)), ), SafeArea( child: SingleChildScrollView( @@ -232,16 +233,18 @@ class _ProfileTabState extends State { onTap: () { Get.toNamed(RouteName.shareProfile); }, - child: commonGlassContainer( + child: commonGlassUI( width: 170.w, height: 40.h, + opacity1: 0.05, opacity2: 0.07, - borderradius: 30.r, + borderRadius: BorderRadius.circular(30.r), + mainOpacity: 1, customWidget: Center( child: text16w400_FCFCFC("Share profile"), ), - border: 1, + // border: 1, ), ) ], @@ -254,19 +257,20 @@ class _ProfileTabState extends State { sizedBoxHeight(25.h), Row( children: [ - commonGlassContainer( + commonGlassUI( width: 25.w, height: 25.h, opacity1: 0.24, opacity2: 0.24, - borderradius: 100, + mainOpacity: 1, + borderRadius: BorderRadius.circular(100), customWidget: Center( child: Image.asset( "assets/images/png/Group 58645.png", height: 12.h, width: 12.w, )), - border: 0.5), + borderwidth: 0.5), sizedBoxWidth(12.w), text14400whiteblur( "Elm street london, United Kingdom"), @@ -275,75 +279,78 @@ class _ProfileTabState extends State { sizedBoxHeight(20.h), Row( children: [ - commonGlassContainer( - width: 25.w, - height: 25.h, - opacity1: 0.24, - opacity2: 0.24, - borderradius: 100, - customWidget: Center( - child: Image.asset( - "assets/images/png/Vector (4).png", - height: 12.h, - width: 12.w, - )), - border: 0.5), + commonGlassUI( + width: 25.w, + height: 25.h, + opacity1: 0.24, + opacity2: 0.24, + mainOpacity: 1, + borderRadius: BorderRadius.circular(100), + borderwidth: 0.5, + customWidget: Center( + child: Image.asset( + "assets/images/png/Vector (4).png", + height: 12.h, + width: 12.w, + )), + ), sizedBoxWidth(12.w), text14400whiteblur("Rowing, Football, Swimming"), ], ), sizedBoxHeight(30.h), - commonGlassContainer( - width: double.infinity, - height: 135.h, - borderradius: 10, - customWidget: Padding( - padding: EdgeInsets.symmetric( - vertical: 12.h, horizontal: 16.w), - child: Column( - children: [ - Row( - children: [ - text16w700white("Badges"), - Spacer(), - GestureDetector( - onTap: () { - Get.toNamed(RouteName.badges); - }, - child: text12400white("View more")) - ], - ), - sizedBoxHeight(8.h), - Row( - mainAxisAlignment: - MainAxisAlignment.spaceBetween, - children: [ - Image.asset( - "assets/images/png/Frame 1000004056.png", - height: 70.h, - width: 74.w, - ), - Image.asset( - "assets/images/png/Frame 1000004056.png", - height: 70.h, - width: 74.w, - ), - Image.asset( - "assets/images/png/Frame 1000004056.png", - height: 70.h, - width: 74.w, - ), - Image.asset( - "assets/images/png/Frame 1000004056.png", - height: 70.h, - width: 74.w, - ), - ], - ), - ], - ), + commonGlassUI( + width: double.infinity, + height: 135.h, + borderRadius: BorderRadius.circular(10), + customWidget: Padding( + padding: EdgeInsets.symmetric( + vertical: 12.h, horizontal: 16.w), + child: Column( + children: [ + Row( + children: [ + text16w700white("Badges"), + Spacer(), + GestureDetector( + onTap: () { + Get.toNamed(RouteName.badges); + }, + child: text12400white("View more")) + ], + ), + sizedBoxHeight(8.h), + Row( + mainAxisAlignment: + MainAxisAlignment.spaceBetween, + children: [ + Image.asset( + "assets/images/png/Frame 1000004056.png", + height: 70.h, + width: 74.w, + ), + Image.asset( + "assets/images/png/Frame 1000004056.png", + height: 70.h, + width: 74.w, + ), + Image.asset( + "assets/images/png/Frame 1000004056.png", + height: 70.h, + width: 74.w, + ), + Image.asset( + "assets/images/png/Frame 1000004056.png", + height: 70.h, + width: 74.w, + ), + ], + ), + ], ), - border: 1), + ), + // border: 1 + ), sizedBoxHeight(40.h), ], ), @@ -429,13 +436,13 @@ class _ProfileTabState extends State { Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - commonGlassContainer( - border: 0.5, + commonGlassUI( width: 40.w, height: 40.h, - borderradius: 100, opacity1: 0.5, opacity2: 0.4, + borderwidth: 0.5, + borderRadius: BorderRadius.circular(100.r), customWidget: Center( child: Image.asset( 'assets/images/png/ph_arrow-up-thin.png', @@ -507,36 +514,37 @@ class _ProfileTabState extends State { Expanded( child: Column( children: [ - commonGlassContainer( - width: double.infinity, - height: 145.h, - borderradius: 10.r, - customWidget: Padding( - padding: EdgeInsets.symmetric(horizontal: 16.w), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - children: [ - CircleAvatar( - radius: 10.r, - backgroundImage: AssetImage(imagePath), - ), - sizedBoxWidth(8.w), - text14700white(title) - ], - ), - sizedBoxHeight(10.h), - text12700white("Team captain"), - sizedBoxHeight(8.h), - text12400white("April 2023 - May 2024"), - sizedBoxHeight(10.h), - text10400whiteblur( - "Lorem Ipsum is simply dummy text of the printing and typesetting industry.") - ], - ), + commonGlassUI( + width: double.infinity, + height: 145.h, + borderRadius: BorderRadius.circular(10.r), + customWidget: Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + children: [ + CircleAvatar( + radius: 10.r, + backgroundImage: AssetImage(imagePath), + ), + sizedBoxWidth(8.w), + text14700white(title) + ], + ), + sizedBoxHeight(10.h), + text12700white("Team captain"), + sizedBoxHeight(8.h), + text12400white("April 2023 - May 2024"), + sizedBoxHeight(10.h), + text10400whiteblur( + "Lorem Ipsum is simply dummy text of the printing and typesetting industry.") + ], ), - border: 1), + ), + // border: 1 + ), ], ), ), @@ -741,13 +749,13 @@ class _ProfileTabState extends State { 'assets/images/png/party-popper 2.png' ]), Spacer(), - commonGlassContainer( - border: 0.43, + commonGlassUI( width: 30.w, height: 30.h, opacity1: 0.05, opacity2: 0.06, - borderradius: 100, + borderwidth: 0.43, + borderRadius: BorderRadius.circular(100), customWidget: Center( child: Image.asset( 'assets/images/png/Frame 1000004088.png', @@ -759,13 +767,13 @@ class _ProfileTabState extends State { sizedBoxWidth(12.w), text14w400_FCFCFC('20'), sizedBoxWidth(20.w), - commonGlassContainer( - border: 0.43, + commonGlassUI( width: 30.w, height: 30.h, - borderradius: 100, opacity1: 0.05, opacity2: 0.06, + borderwidth: 0.43, + borderRadius: BorderRadius.circular(100), customWidget: Center( child: Image.asset( 'assets/images/png/Vector (1).png', @@ -896,12 +904,12 @@ class _ProfileTabState extends State { } Widget containertile({required String text}) { - return commonGlassContainer( - border: 0.9, + return commonGlassUI( width: 100.w, height: 30.h, - borderradius: 30.r, borderColor: Color(0xFFD90B2E), + borderwidth: 0.9, + borderRadius: BorderRadius.circular(30.r), customWidget: Padding( padding: EdgeInsets.symmetric(horizontal: 10.w), child: Center(child: text14w400_FCFCFC(text)), diff --git a/lib/main.dart b/lib/main.dart index e9a7217..4ebc27f 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -19,17 +19,16 @@ Future main() async { SystemChrome.setPreferredOrientations([ DeviceOrientation.portraitUp, ]).then( - (value) =>runApp(MyApp()) /* runApp(StatsFl( + (value) => + // runApp(MyApp()) + runApp(StatsFl( align: Alignment.center, width: 200, height: 100, - child: const MyApp())), */ + child: const MyApp())), ); } -// runApp( -// StatsFl( -// align: Alignment.center, width: 200, height: 100, child: const MyApp()))); class MyApp extends StatefulWidget { const MyApp({super.key});