403 lines
22 KiB
Dart
403 lines
22 KiB
Dart
// 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<GeneratePhotoPage> createState() => _GeneratePhotoPageState();
|
|
}
|
|
|
|
class _GeneratePhotoPageState extends State<GeneratePhotoPage>
|
|
with TickerProviderStateMixin {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return BlocConsumer<SingleMediaCubit, SingleMediaState>(
|
|
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<ThemeModeCubit>().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<ThemeModeCubit>()
|
|
.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<ThemeModeCubit>()
|
|
.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<double> 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(),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|