From 2fb53231e0acd9db782fe7edfee9bb4c6e87d2c1 Mon Sep 17 00:00:00 2001 From: AmirrezaChegini Date: Wed, 24 Dec 2025 01:37:27 +0330 Subject: [PATCH] caches gifs --- .../widgets/answer_box/styles/image_box.dart | 118 ++++++++++++++++++ .../ui/screens/question_screen.dart | 10 +- 2 files changed, 120 insertions(+), 8 deletions(-) create mode 100644 lib/core/widgets/answer_box/styles/image_box.dart diff --git a/lib/core/widgets/answer_box/styles/image_box.dart b/lib/core/widgets/answer_box/styles/image_box.dart new file mode 100644 index 0000000..3a6589e --- /dev/null +++ b/lib/core/widgets/answer_box/styles/image_box.dart @@ -0,0 +1,118 @@ +import 'dart:io'; + +import 'package:flutter/material.dart'; +import 'package:hadi_hoda_flutter/core/utils/screen_size.dart'; + +class ImageBox extends StatelessWidget { + const ImageBox({ + super.key, + required this.image, + }); + + final String image; + + @override + Widget build(BuildContext context) { + return CustomPaint( + painter: _CustomShapePainter(), + child: ClipPath( + clipper: _CustomShapeClipper(), + child: Stack( + alignment: Alignment.center, + children: [ + AspectRatio( + aspectRatio: 1, + child: AnimatedSwitcher( + duration: const Duration(milliseconds: 150), + reverseDuration: const Duration(milliseconds: 150), + switchInCurve: Curves.linear, + switchOutCurve: Curves.linear, + child: Image( + width: context.widthScreen, + height: context.heightScreen, + image: FileImage(File(image)), + fit: BoxFit.cover, + ), + transitionBuilder: (child, animation) => + FadeTransition( + opacity: animation, + child: child, + ), + ), + ), + ], + ), + ), + ); + } +} + +class _CustomShapePainter extends CustomPainter { + @override + void paint(Canvas canvas, Size size) { + final Paint strokePaint = Paint() + ..color = const Color(0XFFF2F7FF) + ..style = PaintingStyle.stroke + ..strokeWidth = 4; + + final Path path = _CustomShapeClipper().getClip(size); + canvas.drawPath(path, strokePaint); + } + + @override + bool shouldRepaint(covariant CustomPainter oldDelegate) { + return this != oldDelegate; + } +} + +class _CustomShapeClipper extends CustomClipper { + @override + Path getClip(Size size) { + // Original SVG dimensions to calculate the scaling factors. + const double originalWidth = 193.0; + const double originalHeight = 189.0; + + // Scaling factors to make the path responsive. + final double scaleX = size.width / originalWidth; + final double scaleY = size.height / originalHeight; + + // The path is defined using the scaled coordinates from the SVG. + final Path path = Path() + ..moveTo(148.483 * scaleX, 4.10254 * scaleY) + ..cubicTo(131.624 * scaleX, 1.93333 * scaleY, 111.221 * scaleX, 1.00169 * scaleY, 91.2451 * scaleX, 1.2666 * scaleY) + ..cubicTo(71.2667 * scaleX, 1.53156 * scaleY, 51.7626 * scaleX, 2.99274 * scaleY, 36.6973 * scaleX, 5.59668 * scaleY) + ..cubicTo(29.1597 * scaleX, 6.8995 * scaleY, 22.7796 * scaleX, 8.48114 * scaleY, 18.0205 * scaleX, 10.3203 * scaleY) + ..cubicTo(15.641 * scaleX, 11.2399 * scaleY, 13.7026 * scaleX, 12.2101 * scaleY, 12.2383 * scaleX, 13.2188 * scaleY) + ..cubicTo(10.7653 * scaleX, 14.2333 * scaleY, 9.84633 * scaleX, 15.2359 * scaleY, 9.3916 * scaleX, 16.1904 * scaleY) + ..cubicTo(8.252 * scaleX, 18.5828 * scaleY, 7.18153 * scaleX, 22.466 * scaleY, 6.2207 * scaleX, 27.5654 * scaleY) + ..cubicTo(5.26481 * scaleX, 32.6387 * scaleY, 4.43215 * scaleX, 38.8273 * scaleY, 3.73535 * scaleX, 45.7744 * scaleY) + ..cubicTo(2.34189 * scaleX, 59.6675 * scaleY, 1.49647 * scaleX, 76.5363 * scaleY, 1.27832 * scaleX, 93.4678 * scaleY) + ..cubicTo(1.06017 * scaleX, 110.4 * scaleY, 1.47057 * scaleX, 127.372 * scaleY, 2.58301 * scaleX, 141.473 * scaleY) + ..cubicTo(3.13928 * scaleX, 148.524 * scaleY, 3.86921 * scaleX, 154.841 * scaleY, 4.78125 * scaleX, 160.068 * scaleY) + ..cubicTo(5.69748 * scaleX, 165.32 * scaleY, 6.78334 * scaleX, 169.385 * scaleY, 8.01367 * scaleX, 171.984 * scaleY) + ..cubicTo(8.53417 * scaleX, 173.084 * scaleY, 9.59654 * scaleX, 174.216 * scaleY, 11.2891 * scaleX, 175.343 * scaleY) + ..cubicTo(12.9722 * scaleX, 176.463 * scaleY, 15.1988 * scaleX, 177.524 * scaleY, 17.9219 * scaleX, 178.515 * scaleY) + ..cubicTo(23.3679 * scaleX, 180.496 * scaleY, 30.6491 * scaleX, 182.138 * scaleY, 39.1807 * scaleX, 183.437 * scaleY) + ..cubicTo(56.2336 * scaleX, 186.032 * scaleY, 78.0934 * scaleX, 187.222 * scaleY, 99.8242 * scaleX, 187.064 * scaleY) + ..cubicTo(121.556 * scaleX, 186.906 * scaleY, 143.101 * scaleX, 185.4 * scaleY, 159.525 * scaleX, 182.622 * scaleY) + ..cubicTo(167.745 * scaleX, 181.232 * scaleY, 174.627 * scaleX, 179.531 * scaleY, 179.594 * scaleX, 177.548 * scaleY) + ..cubicTo(182.079 * scaleX, 176.556 * scaleY, 184.034 * scaleX, 175.512 * scaleY, 185.429 * scaleX, 174.437 * scaleY) + ..cubicTo(186.83 * scaleX, 173.355 * scaleY, 187.568 * scaleX, 172.319 * scaleY, 187.812 * scaleX, 171.361 * scaleY) + ..lineTo(187.812 * scaleX, 171.361 * scaleY) // In SVG, this was H (horizontal line), equivalent to lineTo in Flutter + ..cubicTo(189.156 * scaleX, 166.074 * scaleY, 190.148 * scaleX, 155.525 * scaleY, 190.773 * scaleX, 142.157 * scaleY) + ..cubicTo(191.396 * scaleX, 128.832 * scaleY, 191.651 * scaleX, 112.822 * scaleY, 191.552 * scaleX, 96.6875 * scaleY) + ..cubicTo(191.453 * scaleX, 80.5539 * scaleY, 191.001 * scaleX, 64.3091 * scaleY, 190.213 * scaleX, 50.5156 * scaleY) + ..cubicTo(189.423 * scaleX, 36.6928 * scaleY, 188.299 * scaleX, 25.4153 * scaleY, 186.876 * scaleX, 19.167 * scaleY) + ..cubicTo(186.404 * scaleX, 17.0929 * scaleY, 185.566 * scaleX, 15.3424 * scaleY, 184.087 * scaleX, 14.1582 * scaleY) + ..cubicTo(181.343 * scaleX, 11.9613 * scaleY, 176.72 * scaleX, 9.98089 * scaleY, 170.561 * scaleX, 8.27539 * scaleY) + ..cubicTo(164.434 * scaleX, 6.579 * scaleY, 156.914 * scaleX, 5.18731 * scaleY, 148.483 * scaleX, 4.10254 * scaleY) + ..close(); // Closes the path to form a complete shape. + + return path; + } + + @override + bool shouldReclip(covariant CustomClipper oldClipper) { + return this != oldClipper; + } +} \ No newline at end of file diff --git a/lib/features/question/presentation/ui/screens/question_screen.dart b/lib/features/question/presentation/ui/screens/question_screen.dart index 9fc09aa..dd7104b 100644 --- a/lib/features/question/presentation/ui/screens/question_screen.dart +++ b/lib/features/question/presentation/ui/screens/question_screen.dart @@ -1,7 +1,6 @@ import 'package:auto_size_text/auto_size_text.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; -import 'package:gif/gif.dart'; import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart'; import 'package:hadi_hoda_flutter/common_ui/resources/my_colors.dart'; import 'package:hadi_hoda_flutter/common_ui/resources/my_text_style.dart'; @@ -18,7 +17,7 @@ import 'package:hadi_hoda_flutter/core/widgets/animations/globe_animation.dart'; import 'package:hadi_hoda_flutter/core/widgets/animations/slide_anim.dart'; import 'package:hadi_hoda_flutter/core/widgets/animations/slide_up_fade.dart'; import 'package:hadi_hoda_flutter/core/widgets/answer_box/answer_box.dart'; -import 'package:hadi_hoda_flutter/core/widgets/answer_box/styles/picture_box.dart'; +import 'package:hadi_hoda_flutter/core/widgets/answer_box/styles/image_box.dart'; import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart'; import 'package:hadi_hoda_flutter/features/question/domain/entity/answer_entity.dart'; import 'package:hadi_hoda_flutter/features/question/presentation/bloc/question_bloc.dart'; @@ -101,14 +100,9 @@ class _QuestionScreenState extends State _titles(context), 20.0.gapHeight, BlocBuilder( - builder: (context, state) => AnswerPictureBox( + builder: (context, state) => ImageBox( key: Key('${state.currentQuestion?.image}'), - selected: false, - showIndex: false, - correctAnswer: 0, - index: 0, image: state.currentQuestion?.image ?? '', - autostart: Autostart.loop, ), ), ],