// ignore_for_file: deprecated_member_use import 'package:before_after/before_after.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:go_router/go_router.dart'; import 'package:hoshan/core/gen/assets.gen.dart'; import 'package:hoshan/core/routes/route_generator.dart'; import 'package:hoshan/core/services/api/dio_service.dart'; import 'package:hoshan/data/model/chat_args.dart'; import 'package:hoshan/ui/screens/gmedia/cubit/single_media_cubit.dart'; import 'package:hoshan/ui/theme/colors.dart'; import 'package:hoshan/ui/theme/cubit/theme_mode_cubit.dart'; import 'package:hoshan/ui/theme/responsive.dart'; import 'package:hoshan/ui/theme/text.dart'; import 'package:hoshan/ui/widgets/components/button/loading_button.dart'; import 'package:hoshan/ui/widgets/components/image/network_image.dart'; import 'package:hoshan/ui/widgets/components/snackbar/snackbar_manager.dart'; class GeneratePhotoPage extends StatefulWidget { const GeneratePhotoPage({super.key}); @override State createState() => _GeneratePhotoPageState(); } class _GeneratePhotoPageState extends State with TickerProviderStateMixin { @override Widget build(BuildContext context) { return BlocConsumer( listener: (context, state) { if (state is SingleMediaFail) { context.pop(); SnackBarManager(context).show( message: 'خطا در برقراری ارتباط با سرور لطفا لحظاتی دیگر امتحان کنید', status: SnackBarStatus.error); } }, builder: (context, state) { if (state is SingleMediaFail) { return const SizedBox.shrink(); } if (state is SingleMediaSuccess) { final TabController tabController = TabController( length: state.medias.categories?.length ?? 0, vsync: this); return DefaultTabController( length: state.medias.categories?.length ?? 0, child: Scaffold( body: Responsive(context).maxWidthInDesktop( child: (contxet, mw) => Scaffold( appBar: AppBar( toolbarHeight: 0, backgroundColor: context.read().isDark() ? null : AppColors.primaryColor[50], bottom: TabBar( controller: tabController, dividerColor: Colors.transparent, tabs: List.generate( state.medias.categories?.length ?? 0, (index) { return Tab( height: 80, child: AnimatedBuilder( animation: tabController, builder: (context, _) { return Column( children: [ if (state .medias.categories?[index].icon != null) Expanded( child: SvgPicture.network( DioService.baseURL + state.medias.categories![index] .icon!, color: tabController.index == index ? Theme.of(context) .colorScheme .primary : AppColors.gray[context .read() .isDark() ? 400 : 800], ), ), Text( state.medias.categories?[index].name ?? '', style: AppTextStyles.body4.copyWith( fontWeight: tabController.index == index ? FontWeight.bold : FontWeight.normal, color: tabController.index == index ? Theme.of(context) .colorScheme .primary : AppColors.gray[context .read() .isDark() ? 400 : 800]), ), const SizedBox( height: 8, ), ], ); }), ); }, ), ), ), body: TabBarView( controller: tabController, physics: const NeverScrollableScrollPhysics(), children: List.generate( state.medias.categories!.length, (index) { switch (index) { case 1: final category = state.medias.categories![index]; return MasonryGridView.builder( itemCount: category.bots?.length, physics: const BouncingScrollPhysics(), padding: const EdgeInsets.symmetric( vertical: 16, horizontal: 16), gridDelegate: const SliverSimpleGridDelegateWithFixedCrossAxisCount( crossAxisCount: 2), itemBuilder: (context, index) { final bot = category.bots?[index]; ValueNotifier changeAB = ValueNotifier(0.5); return Padding( // color: Colors.amberAccent, padding: const EdgeInsets.all(8), child: Column( children: [ Stack( children: [ AspectRatio( aspectRatio: 3 / 4, child: SizedBox( height: MediaQuery.sizeOf(context) .height * 0.3, child: Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular( 16), color: Theme.of(context) .colorScheme .surface), child: ValueListenableBuilder( valueListenable: changeAB, builder: (context, val, _) { return BeforeAfter( value: val, onValueChanged: (value) { changeAB.value = value; }, trackWidth: 3, thumbWidth: 18, after: ImageNetwork( radius: 16, url: bot?.image2 ?? '', // url: a, fit: BoxFit.cover, width: double.infinity, height: double.infinity, ), before: ImageNetwork( radius: 16, url: bot?.image ?? '', // url: b, fit: BoxFit.cover, width: double.infinity, height: double.infinity, ), ); }), ), ), ), Positioned( right: 8, bottom: 12, child: Container( padding: const EdgeInsets.symmetric( vertical: 4, horizontal: 8), decoration: BoxDecoration( color: Theme.of(context) .colorScheme .secondary .withAlpha(180), borderRadius: BorderRadius.circular(8)), child: Row( children: [ Padding( padding: const EdgeInsets.only( top: 2.0), child: Text( bot!.cost == 0 || bot.cost == null ? 'رایگان' : '${bot.cost}', style: AppTextStyles.body6 .copyWith( color: Colors.white), ), ), Assets.icon.outline.coin.svg( color: Colors.white, width: 16, height: 16), ], ), ), ) ], ), const SizedBox( height: 4, ), LoadingButton( onPressed: () { context.go(Routes.photoToPhoto, extra: ChatArgs( bot: bot, )); }, width: double.infinity, child: Text( bot.name ?? '', maxLines: 1, overflow: TextOverflow.ellipsis, style: AppTextStyles.body4 .copyWith(color: Colors.white), )) ], ), ); }, ); case 0: final category = state.medias.categories![index]; return MasonryGridView.builder( itemCount: category.bots?.length, physics: const BouncingScrollPhysics(), padding: const EdgeInsets.symmetric( vertical: 16, horizontal: 16), gridDelegate: const SliverSimpleGridDelegateWithFixedCrossAxisCount( crossAxisCount: 2), itemBuilder: (context, index) { final bot = category.bots?[index]; return Padding( // color: Colors.amberAccent, padding: const EdgeInsets.all(8), child: InkWell( onTap: () { context.go(Routes.photoToPhoto, extra: ChatArgs(bot: bot!)); }, child: Container( constraints: BoxConstraints( maxHeight: MediaQuery.sizeOf(context) .height * 0.3), decoration: BoxDecoration( color: Theme.of(context) .colorScheme .surface, borderRadius: BorderRadius.circular(16)), child: Stack( children: [ ImageNetwork( radius: 16, url: bot?.image ?? '', fit: BoxFit.cover, ), Positioned.fill( child: Container( padding: const EdgeInsets.all(8), decoration: BoxDecoration( borderRadius: BorderRadius.circular(16), gradient: LinearGradient( begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [ Theme.of(context) .colorScheme .surface .withAlpha(40), AppColors .primaryColor[600] .withAlpha(180) ])), child: Column( crossAxisAlignment: CrossAxisAlignment.end, mainAxisAlignment: MainAxisAlignment.end, children: [ Text( bot?.name ?? '', style: AppTextStyles.body4 .copyWith( color: Colors.white, fontWeight: FontWeight.bold), textDirection: TextDirection.rtl, maxLines: 2, overflow: TextOverflow.ellipsis, ), Row( mainAxisAlignment: MainAxisAlignment.end, children: [ Padding( padding: const EdgeInsets.only( top: 4.0), child: Text( bot?.cost?.toString() ?? '', style: AppTextStyles .body4 .copyWith( color: Colors .white), ), ), const SizedBox( width: 4, ), Assets.icon.outline.coin .svg( color: Colors.white, width: 18, height: 18) ], ) ], ), )) ], ), ), ), ); }, ); default: return const SizedBox.shrink(); } }, ), ), ), ), ), ); } return const Scaffold( body: Center( child: CircularProgressIndicator(), ), ); }, ); } }