Mguy13
/
mc_gallery
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added swiping

This commit is contained in:
Mehul Ahal 2022-12-22 12:17:08 +01:00
parent 2ff4d44d25
commit 5aa6a58299
7 changed files with 101 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
lib/features/home/api/unsplash_images_api.dart
View File

@ -25,7 +25,7 @@ class UnsplashImagesApi with LoggingService implements ImagesApi {
return ImageModel( return ImageModel(
imageIndex: imageIndex, imageIndex: imageIndex,
uri: imageUri, uri: imageUri,
imageName: '${Strings.current.image} $imageIndex: size=$imageSide', imageName: '${Strings.current.image} ${imageIndex + 1}: size=$imageSide',
); );
}); });
} on Exception catch (ex, stackTrace) { } on Exception catch (ex, stackTrace) {

3
lib/features/home/services/images_service.dart
View File

@ -36,6 +36,9 @@ class ImagesService {
int get firstAvailableImageIndex => 0; int get firstAvailableImageIndex => 0;
int get lastAvailableImageIndex => _imageModels.length - 1; int get lastAvailableImageIndex => _imageModels.length - 1;
int get numberOfImages => _imageModels.length;
ImageModel imageModelAt({required int index}) => _imageModels.elementAt(index);
static ImagesService get locate => Locator.locate(); static ImagesService get locate => Locator.locate();
} }

15
lib/features/home/views/gallery/gallery_view.dart
View File

@ -46,15 +46,12 @@ class GalleryView extends StatelessWidget {
context, context,
imageModel: imageModel, imageModel: imageModel,
), ),
child: Hero( child: CachedNetworkImage(
tag: imageModel.imageIndex.toString(), imageUrl: imageModel.uri.toString(),
child: CachedNetworkImage( cacheKey: imageModel.imageIndex.toString(),
imageUrl: imageModel.uri.toString(), progressIndicatorBuilder: (_, __, final progress) =>
cacheKey: imageModel.imageIndex.toString(), CircularProgressIndicator(
progressIndicatorBuilder: (_, __, final progress) => value: model.downloadProgressValue(progress: progress),
CircularProgressIndicator(
value: model.downloadProgressValue(progress: progress),
),
), ),
), ),
), ),

88
lib/features/home/views/image_carousel/image_carousel_view.dart
View File

@ -1,9 +1,12 @@
import 'package:auto_size_text/auto_size_text.dart';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart'; import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:mc_gallery/features/core/data/constants/const_colors.dart'; import 'package:mc_gallery/features/home/data/models/image_model.dart';
import 'package:mc_gallery/features/core/data/constants/const_text.dart';
import '/features/core/data/constants/const_colors.dart';
import '/features/core/data/constants/const_text.dart';
import '/features/core/widgets/gap.dart'; import '/features/core/widgets/gap.dart';
import '/features/core/widgets/mcg_scaffold.dart'; import '/features/core/widgets/mcg_scaffold.dart';
import '/features/core/widgets/view_model_builder.dart'; import '/features/core/widgets/view_model_builder.dart';
@ -28,6 +31,7 @@ class ImageCarouselView extends StatelessWidget {
viewModelBuilder: () => ImageCarouselViewModel.locate, viewModelBuilder: () => ImageCarouselViewModel.locate,
argumentBuilder: () => imageCarouselViewArguments, argumentBuilder: () => imageCarouselViewArguments,
builder: (context, final model) => McgScaffold( builder: (context, final model) => McgScaffold(
bodyBuilderWaiter: model.isInitialised,
appBar: AppBar( appBar: AppBar(
title: Text(model.strings.imageCarousel), title: Text(model.strings.imageCarousel),
), ),
@ -36,41 +40,59 @@ class ImageCarouselView extends StatelessWidget {
Expanded( Expanded(
child: Card( child: Card(
elevation: 8, elevation: 8,
child: Stack( child: CarouselSlider.builder(
fit: StackFit.expand, itemCount: model.numberOfImages,
children: [ options: CarouselOptions(
Hero( enlargeFactor: 1,
tag: model.currentImageKey, enlargeCenterPage: true,
child: CachedNetworkImage( enlargeStrategy: CenterPageEnlargeStrategy.scale,
imageUrl: model.currentImageUrl, disableCenter: true,
cacheKey: model.currentImageKey, aspectRatio: 1,
fit: BoxFit.fill, initialPage: model.currentImageIndex,
progressIndicatorBuilder: (_, __, final progress) => enableInfiniteScroll: false,
CircularProgressIndicator( onPageChanged: (final index, _) => model.swipedTo(newIndex: index),
value: model.downloadProgressValue(progress: progress), ),
itemBuilder: (context, _, __) => Stack(
fit: StackFit.expand,
children: [
ValueListenableBuilder<ImageModel>(
valueListenable: model.currentImageModelListenable,
builder: (context, _, __) => CachedNetworkImage(
imageUrl: model.currentImageUrl,
cacheKey: model.currentImageKey,
fit: BoxFit.fill,
progressIndicatorBuilder: (_, __, final progress) =>
CircularProgressIndicator(
value: model.downloadProgressValue(progress: progress),
),
), ),
), ),
), Center(
Center( child: ValueListenableBuilder<ImageModel>(
child: Row( valueListenable: model.currentImageModelListenable,
mainAxisAlignment: MainAxisAlignment.spaceBetween, builder: (context, _, __) => Row(
children: [ mainAxisAlignment: MainAxisAlignment.spaceBetween,
Icon( children: [
Icons.chevron_left, Icon(
color: model.hasPreviousImage ? ConstColours.white : ConstColours.black, Icons.chevron_left,
color: model.hasPreviousImage
? ConstColours.white
: ConstColours.black,
),
AutoSizeText(
model.currentImageName,
style: ConstText.imageOverlayTextStyle(context),
),
Icon(
Icons.chevron_right,
color: model.hasNextImage ? ConstColours.white : ConstColours.black,
),
],
), ),
Text( ),
model.currentImageName,
style: ConstText.imageOverlayTextStyle(context),
),
Icon(
Icons.chevron_right,
color: model.hasNextImage ? ConstColours.white : ConstColours.black,
),
],
), ),
), ],
], ),
), ),
), ),
), ),

25
lib/features/home/views/image_carousel/image_carousel_view_model.dart
View File

@ -22,13 +22,14 @@ class ImageCarouselViewModel extends BaseViewModel {
final NavigationService _navigationService; final NavigationService _navigationService;
final LoggingService _loggingService; final LoggingService _loggingService;
late final ValueNotifier<ImageModel> _currentImageModel; late final ValueNotifier<ImageModel> _currentImageModelNotifier;
ValueListenable<ImageModel> get currentImageModel => _currentImageModel; ValueListenable<ImageModel> get currentImageModelListenable => _currentImageModelNotifier;
@override @override
Future<void> initialise(bool Function() mounted, [arguments]) async { Future<void> initialise(bool Function() mounted, [arguments]) async {
_currentImageModel = ValueNotifier(_imagesService.imageModels _currentImageModelNotifier = ValueNotifier(_imagesService.imageModels
.elementAt((arguments! as ImageCarouselViewArguments).imageIndexKey)); .elementAt((arguments! as ImageCarouselViewArguments).imageIndexKey));
_loggingService.info('Initialized with image: ${_currentImageModelNotifier.value.imageIndex}');
super.initialise(mounted, arguments); super.initialise(mounted, arguments);
} }
@ -38,17 +39,25 @@ class ImageCarouselViewModel extends BaseViewModel {
super.dispose(); super.dispose();
} }
String get currentImageUrl => currentImageModel.value.uri.toString(); void swipedTo({required int newIndex}) {
String get currentImageKey => currentImageModel.value.imageIndex.toString(); _currentImageModelNotifier.value = _imagesService.imageModelAt(index: newIndex);
String get currentImageName => currentImageModel.value.imageName; _loggingService.info('Swiped to image: ${_currentImageModelNotifier.value.imageIndex}');
}
String get currentImageUrl => currentImageModelListenable.value.uri.toString();
String get currentImageKey => currentImageModelListenable.value.imageIndex.toString();
String get currentImageName => currentImageModelListenable.value.imageName;
int get currentImageIndex => currentImageModelListenable.value.imageIndex;
int get numberOfImages => _imagesService.numberOfImages;
double? downloadProgressValue({required DownloadProgress progress}) => double? downloadProgressValue({required DownloadProgress progress}) =>
progress.totalSize != null ? progress.downloaded / progress.totalSize! : null; progress.totalSize != null ? progress.downloaded / progress.totalSize! : null;
bool get hasPreviousImage => bool get hasPreviousImage =>
currentImageModel.value.imageIndex > _imagesService.firstAvailableImageIndex; currentImageModelListenable.value.imageIndex > _imagesService.firstAvailableImageIndex;
bool get hasNextImage => bool get hasNextImage =>
currentImageModel.value.imageIndex < _imagesService.lastAvailableImageIndex; currentImageModelListenable.value.imageIndex < _imagesService.lastAvailableImageIndex;
static ImageCarouselViewModel get locate => Locator.locate(); static ImageCarouselViewModel get locate => Locator.locate();
} }

18
pubspec.lock
View File

@ -43,6 +43,13 @@ packages:
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "2.9.0" version: "2.9.0"
auto_size_text:
dependency: "direct main"
description:
name: auto_size_text
url: "https://pub.dartlang.org"
source: hosted
version: "3.0.0"
boolean_selector: boolean_selector:
dependency: transitive dependency: transitive
description: description:
@ -71,6 +78,13 @@ packages:
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "1.0.2" version: "1.0.2"
carousel_slider:
dependency: "direct main"
description:
name: carousel_slider
url: "https://pub.dartlang.org"
source: hosted
version: "4.2.1"
characters: characters:
dependency: transitive dependency: transitive
description: description:
@ -545,7 +559,7 @@ packages:
name: talker name: talker
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "2.1.0+1" version: "2.2.0"
talker_dio_logger: talker_dio_logger:
dependency: "direct main" dependency: "direct main"
description: description:
@ -559,7 +573,7 @@ packages:
name: talker_logger name: talker_logger
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "2.1.0" version: "2.2.0"
term_glyph: term_glyph:
dependency: transitive dependency: transitive
description: description:

4
pubspec.yaml
View File

@ -32,9 +32,11 @@ dependencies:
# Util frontend # Util frontend
flutter_markdown: ^0.6.13 flutter_markdown: ^0.6.13
auto_size_text: ^3.0.0
carousel_slider: ^4.2.1
# Logging # Logging
talker: ^2.1.0+1 talker: ^2.2.0
talker_dio_logger: ^1.0.0 talker_dio_logger: ^1.0.0
# Assets # Assets