You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

122 lines
4.9 KiB

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:my_flutter_puzzle/providers.dart';
import 'package:my_flutter_puzzle/utils/extensions/context_extension.dart';
import 'package:palette_generator/palette_generator.dart';
class ImageViewer extends ConsumerWidget {
const ImageViewer({
required this.puzzleSize,
required this.previousImage,
required this.previousPalette,
required this.imageSize,
Key? key,
}) : super(key: key);
final int puzzleSize;
final Image? previousImage;
final PaletteGenerator? previousPalette;
final double imageSize;
@override
Widget build(BuildContext context, WidgetRef ref) {
return Consumer(
builder: (context, ref, child) {
final state = ref.watch(imageSplitterNotifierProvider);
return state.maybeWhen(
() => const SizedBox(),
complete: (image, images, palette) => SizedBox(
width: context.width * 202 / 812,
height: context.width * 202 / 812,
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Image(
image: image.image,
height: imageSize,
width: imageSize,
),
),
),
orElse: () => previousImage != null
? Padding(
padding: const EdgeInsets.only(right: 0.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
// border: Border.all(color: Colors.white, width: 3),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Image(
image: previousImage!.image,
height: imageSize,
width: imageSize,
),
),
),
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: SizedBox(
width: imageSize,
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: 4,
horizontal: 16,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
width: imageSize / 5,
height: imageSize / 5,
decoration: BoxDecoration(
color: previousPalette!.colors.elementAt(0),
shape: BoxShape.circle,
border: Border.all(
color: Colors.white60,
width: 3,
),
),
),
Container(
width: imageSize / 5,
height: imageSize / 5,
decoration: BoxDecoration(
color: previousPalette!.colors.elementAt(1),
shape: BoxShape.circle,
border: Border.all(
color: Colors.white60,
width: 3,
),
),
),
Container(
width: imageSize / 5,
height: imageSize / 5,
decoration: BoxDecoration(
color: previousPalette!.colors.elementAt(2),
shape: BoxShape.circle,
border: Border.all(
color: Colors.white60,
width: 3,
),
),
),
],
),
),
),
),
const SizedBox(height: 16),
],
),
)
: const SizedBox(),
);
},
);
}
}