import 'dart:io'; import 'package:dotted_border/dotted_border.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:get/get.dart'; import 'package:regroup/Common/CommonButton.dart'; import 'package:regroup/Common/CommonGlassmorphism.dart'; import 'package:regroup/Utils/Common/CommonAppbar.dart'; import 'package:regroup/Utils/Common/CommonDropdown.dart'; import 'package:regroup/Utils/Common/CustomTextformfield.dart'; import 'package:regroup/Utils/Common/ImageUpload.dart'; import 'package:regroup/Utils/Common/sized_box.dart'; import 'package:regroup/Utils/texts.dart'; import 'package:regroup/resources/routes/route_name.dart'; import 'package:remove_emoji_input_formatter/remove_emoji_input_formatter.dart'; class PostScreen extends StatefulWidget { const PostScreen({super.key}); @override State createState() => _PostScreenState(); } class _PostScreenState extends State { List bannerPath = []; bool isbannerAdded = false; var selectedContainerIndices = {}.obs; void toggleSelectedIndex(int index) { if (selectedContainerIndices.contains(index)) { selectedContainerIndices.remove(index); } else { selectedContainerIndices.add(index); } } @override Widget build(BuildContext context) { return Scaffold( backgroundColor: const Color(0xFF222935), extendBody: true, resizeToAvoidBottomInset: false, appBar: const CommonAppbar( titleTxt: "Create a post", ), body: Stack(children: [ Container( decoration: const BoxDecoration( image: DecorationImage( image: AssetImage("assets/images/png/Ellipse 1496.png"), fit: BoxFit.fill)), ), Padding( padding: EdgeInsets.symmetric(horizontal: 16.w), child: SingleChildScrollView( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ sizedBoxHeight(20.h), text16w400_FCFCFC("Caption"), sizedBoxHeight(18.h), CustomTextFormField2( maxlines: 3, ), sizedBoxHeight(25.h), text16w400_FCFCFC("Media"), sizedBoxHeight(18.h), GestureDetector( onTap: () { ImageUploadBottomSheet().showModal( context, false, (result) { var file = File(result); bannerPath.add(file); isbannerAdded = true; setState(() {}); }, ); }, child: DottedBorder( strokeWidth: 1, dashPattern: const [7, 4], borderType: BorderType.RRect, radius: Radius.circular(14.r), color: const Color(0xFF434A53), child: commonGlassUI( width: double.infinity, height: 130.h, borderRadius: BorderRadius.circular(10.r), borderColor: Colors.transparent, customWidget: bannerPath.isNotEmpty && isbannerAdded ? Stack(children: [ Image.file( bannerPath[0]!, fit: BoxFit.cover, width: double.infinity, ), Positioned( right: 5, bottom: 5, child: GestureDetector( onTap: () { bannerPath.clear(); isbannerAdded = false; setState(() {}); }, child: Container( width: 27, height: 27, decoration: ShapeDecoration( color: const Color(0xFF7E7E7E), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( 5)), ), child: const Icon( Icons.delete_outline_outlined, color: Colors.white, ))), ), ]) : Padding( padding: EdgeInsets.symmetric(vertical: 16.h), child: Column( children: [ Image.asset( "assets/images/png/bi_download.png", height: 36.h, width: 36.w, ), sizedBoxHeight(10.h), text14w400_FCFCFC("Upload image"), sizedBoxHeight(8.h), text8w400_8A8A8A( "Allowed file extensions: jpg, png, gif Max file size: 10 MB"), ], ), )), ), ), sizedBoxHeight(25.h), text16w400_FCFCFC("Tags"), sizedBoxHeight(18.h), CustomDropDownTag1( header: "Enter tags", title: "Enter tags", listData: const [ "#Race", "#Swimming", "#Cycle", "#Swimming", "#Race" ], rowData: const [ "23,233 Recently use tags", "15,123 Recently use tags", "15,123 Recently use tags", "15,123 Available tags", "15,123 Available tags" ], onItemSelected: (p0) {}, leadingImage: const SizedBox()), // CustomTextFormField( // suffixIcon: Container( // height: 20.h, // width: 20.w, // child: Center( // child: Image.asset( // "assets/images/png/Frame 58575.png", // height: 20.h, // width: 20.w, // fit: BoxFit.cover, // ), // ), // )), sizedBoxHeight(25.h), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ containerTile(text: "# Race", index: 0), containerTile(text: "# Swimming", index: 1), containerTile(text: "# Cycle", index: 2), ], ), sizedBoxHeight(16.h), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ containerTile(text: "# Race", index: 3), containerTile(text: "# Swimming", index: 4), containerTile(text: "# Cycle", index: 5), ], ), sizedBoxHeight(30.h), text16w400_FCFCFC("CTA Title"), sizedBoxHeight(18.h), CustomTextFormField( // validationMessage: "Enter a CTA Title", validator: (val) { if (val == null || val.isEmpty) { return 'Enter a CTA Title'; } return null; }, inputFormatters: [ LengthLimitingTextInputFormatter(20), RemoveEmojiInputFormatter() ], ), sizedBoxHeight(25.h), text16w400_FCFCFC("Post as"), sizedBoxHeight(18.h), CustomDropDownRadio( header: "", title: "", listData: const ['Individual', 'Anonymous'], onItemSelected: (p0) {}, leadingImage: const SizedBox()), // CommonDropdownradioBtn( // hint: '', items: ['Individual', 'Anonymous']), sizedBoxHeight(25.h), text16w400_FCFCFC("Post in"), sizedBoxHeight(18.h), CustomDropDownCheckBox( header: "", title: "", listData: const [ 'Active alliance network', 'Fitfam federation', 'The athletic town', 'Football fever' ], onItemSelected: (p0) {}, images: const [ 'assets/images/png/Rectangle 65.png', 'assets/images/png/Rectangle 66.png', 'assets/images/png/Rectangle 60.png', 'assets/images/png/Rectangle 68.png' ], leadingImage: const SizedBox()), // CommonDropdownCheckbox( // hint: '', // items: [ // 'Active alliance network', // 'Fitfam federation', // 'The athletic town', // 'Football fever' // ], // images: [ // 'assets/images/png/Rectangle 65.png', // 'assets/images/png/Rectangle 66.png', // 'assets/images/png/Rectangle 60.png', // 'assets/images/png/Rectangle 68.png' // ], // ), sizedBoxHeight(40.h), CommonBtn( text: 'Submit post', onTap: () { successBottomsheet(); }, ), sizedBoxHeight(150.h), ]), ), ), ])); } void successBottomsheet() { Get.bottomSheet(Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular(14.r), color: const Color(0xFF222935)), child: Padding( padding: EdgeInsets.symmetric(horizontal: 30.w), child: Column(mainAxisSize: MainAxisSize.min, children: [ sizedBoxHeight(20.h), Image.asset( 'assets/images/png/Frame 1000004082.png', width: 199.w, height: 158.h, ), sizedBoxHeight(20.h), text18w500Center_FCFCFC( 'Your post has been succesfully uploaded'), sizedBoxHeight(20.h), InkWell( onTap: () { Get.toNamed(RouteName.mainscreen); }, child: Container( height: 35.h, width: 216.w, decoration: BoxDecoration( border: Border.all(color: const Color(0xFF434A53), width: 1), gradient: const LinearGradient( begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [ Color.fromRGBO(255, 255, 255, 0.054), Color.fromRGBO(255, 255, 255, 0.072), ], stops: [0.0233, 1.0], transform: GradientRotation(271.14 * (3.141592653589793 / 180)), // Converting degrees to radians ), borderRadius: BorderRadius.circular(30.r), ), child: Center(child: text14w400_FCFCFC('Check out')), ), ), sizedBoxHeight(40.h) ])))); } Widget containerTile({ required String text, required int index, }) { return Obx(() { return GestureDetector( onTap: () { toggleSelectedIndex(index); }, child: Container( height: 35, decoration: BoxDecoration( color: selectedContainerIndices.contains(index) ? const Color(0xFFD90B2E).withOpacity(0.4) : const Color(0xFFFFFFFF).withOpacity(0.2), borderRadius: BorderRadius.circular(30), border: Border.all(color: const Color(0xFFD90B2E), width: 1)), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 20), child: Center(child: text14w400_FCFCFC(text)), ), ), ); }); } }