mc_gallery/lib/features/home/views/image_carousel/image_carousel_view.dart

89 lines
3.2 KiB
Dart

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:mc_gallery/features/core/data/constants/const_colors.dart';
import 'package:mc_gallery/features/core/data/constants/const_text.dart';
import '/features/core/widgets/gap.dart';
import '/features/core/widgets/mcg_scaffold.dart';
import '/features/core/widgets/view_model_builder.dart';
import '/features/home/views/image_carousel/image_carousel_view_model.dart';
class ImageCarouselViewArguments {
const ImageCarouselViewArguments({required this.imageIndexKey});
final int imageIndexKey;
}
class ImageCarouselView extends StatelessWidget {
const ImageCarouselView({
required this.imageCarouselViewArguments,
super.key,
});
final ImageCarouselViewArguments imageCarouselViewArguments;
@override
Widget build(BuildContext context) {
return ViewModelBuilder<ImageCarouselViewModel>(
viewModelBuilder: () => ImageCarouselViewModel.locate,
argumentBuilder: () => imageCarouselViewArguments,
builder: (context, final model) => McgScaffold(
appBar: AppBar(
title: Text(model.strings.imageCarousel),
),
body: Column(
children: [
Expanded(
child: Card(
elevation: 8,
child: Stack(
fit: StackFit.expand,
children: [
Hero(
tag: model.currentImageKey,
child: CachedNetworkImage(
imageUrl: model.currentImageUrl,
cacheKey: model.currentImageKey,
fit: BoxFit.fill,
progressIndicatorBuilder: (_, __, final progress) =>
CircularProgressIndicator(
value: model.downloadProgressValue(progress: progress),
),
),
),
Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Icon(
Icons.chevron_left,
color: model.hasPreviousImage ? ConstColours.white : ConstColours.black,
),
Text(
model.currentImageName,
style: ConstText.imageOverlayTextStyle(context),
),
Icon(
Icons.chevron_right,
color: model.hasNextImage ? ConstColours.white : ConstColours.black,
),
],
),
),
],
),
),
),
const Gap(24),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: MarkdownBody(data: model.strings.imageDetails),
),
const Gap(16),
],
),
),
);
}
}