diff --git a/assets/images/correct.svg b/assets/images/correct.svg
new file mode 100644
index 0000000..17b0900
--- /dev/null
+++ b/assets/images/correct.svg
@@ -0,0 +1,17 @@
+
diff --git a/assets/images/wrong.svg b/assets/images/wrong.svg
new file mode 100644
index 0000000..ebf05ff
--- /dev/null
+++ b/assets/images/wrong.svg
@@ -0,0 +1,17 @@
+
diff --git a/lib/common_ui/resources/my_assets.dart b/lib/common_ui/resources/my_assets.dart
index 473d276..f2a20e9 100644
--- a/lib/common_ui/resources/my_assets.dart
+++ b/lib/common_ui/resources/my_assets.dart
@@ -25,4 +25,6 @@ class MyAssets {
static const String bubbleChatRight = 'assets/images/bubble_chat_right.svg';
static const String diamond = 'assets/images/diamond.png';
static const String done = 'assets/images/done.svg';
+ static const String correct = 'assets/images/correct.svg';
+ static const String wrong = 'assets/images/wrong.svg';
}
\ No newline at end of file
diff --git a/lib/core/widgets/answer_box/answer_box.dart b/lib/core/widgets/answer_box/answer_box.dart
index 6c54390..b22198e 100644
--- a/lib/core/widgets/answer_box/answer_box.dart
+++ b/lib/core/widgets/answer_box/answer_box.dart
@@ -33,10 +33,7 @@ class _AnswerBoxState extends State {
left: 0,
right: 0,
bottom: -36,
- child: SizedBox(
- height: 60,
- child: AnswerTextBox(),
- ),
+ child: AnswerTextBox(),
),
],
),
diff --git a/lib/core/widgets/answer_box/styles/picture_box.dart b/lib/core/widgets/answer_box/styles/picture_box.dart
index 7263d0f..1b9ab51 100644
--- a/lib/core/widgets/answer_box/styles/picture_box.dart
+++ b/lib/core/widgets/answer_box/styles/picture_box.dart
@@ -1,5 +1,8 @@
import 'package:flutter/material.dart';
+import 'package:google_fonts/google_fonts.dart';
import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart';
+import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
+import 'package:hadi_hoda_flutter/common_ui/theme/my_theme.dart';
import 'package:hadi_hoda_flutter/core/utils/my_image.dart';
class AnswerPictureBox extends StatelessWidget {
@@ -14,8 +17,53 @@ class AnswerPictureBox extends StatelessWidget {
foregroundPainter: _SvgCustomPainter(selected),
child: ClipPath(
clipper: _SvgCustomClipper(),
- child: MyImage(
- image: MyAssets.backgroundIntro, fit: BoxFit.cover, size: 170),
+ child: Stack(
+ children: [
+ MyImage(
+ image: MyAssets.backgroundIntro,
+ fit: BoxFit.cover,
+ size: 170,
+ ),
+ PositionedDirectional(
+ top: MySpaces.s12,
+ start: MySpaces.s12,
+ child: ClipPath(
+ clipper: _CountClipper(),
+ child: Container(
+ height: MySpaces.s32,
+ width: MySpaces.s32,
+ alignment: Alignment.center,
+ decoration: BoxDecoration(
+ gradient: LinearGradient(
+ begin: Alignment.topCenter,
+ end: Alignment.bottomCenter,
+ colors: [
+ Color(0XFF5732CB),
+ Color(0XFF322386),
+ ],
+ ),
+ ),
+ child: Text(
+ '1',
+ style: GoogleFonts.marhey(
+ fontSize: 17,
+ fontWeight: FontWeight.w600,
+ color: context.primaryColor,
+ ),
+ ),
+ ),
+ ),
+ ),
+ PositionedDirectional(
+ top: MySpaces.s14,
+ end: MySpaces.s12,
+ child: MyImage(
+ image: MyAssets.correct,
+ size: MySpaces.s40,
+ ),
+ ),
+ ],
+ ),
),
);
}
@@ -124,4 +172,38 @@ class _SvgCustomPainter extends CustomPainter {
@override
bool shouldRepaint(CustomPainter oldDelegate) => true;
+}
+
+class _CountClipper extends CustomClipper {
+ @override
+ Path getClip(Size size) {
+ // Original SVG viewBox: width=34, height=33
+ final sx = size.width / 34.0;
+ final sy = size.height / 33.0;
+
+ final p = Path()
+ ..moveTo(33.3479 * sx, 14.8127 * sy)
+ ..cubicTo(
+ 33.3479 * sx, 23.7042 * sy,
+ 27.2015 * sx, 32.9501 * sy,
+ 17.8599 * sx, 32.9501 * sy,
+ )..cubicTo(
+ 8.51818 * sx, 32.9501 * sy,
+ 0.945251 * sx, 25.7421 * sy,
+ 0.945251 * sx, 16.8507 * sy,
+ )..cubicTo(
+ 0.945251 * sx, 7.95917 * sy,
+ 8.51818 * sx, 0.751205 * sy,
+ 17.8599 * sx, 0.751205 * sy,
+ )..cubicTo(
+ 27.2015 * sx, 0.751205 * sy,
+ 33.3479 * sx, 5.92127 * sy,
+ 33.3479 * sx, 14.8127 * sy,
+ )..close();
+
+ return p;
+ }
+
+ @override
+ bool shouldReclip(covariant CustomClipper oldClipper) => false;
}
\ No newline at end of file
diff --git a/lib/core/widgets/answer_box/styles/text_box.dart b/lib/core/widgets/answer_box/styles/text_box.dart
index ed40b1d..c636cfa 100644
--- a/lib/core/widgets/answer_box/styles/text_box.dart
+++ b/lib/core/widgets/answer_box/styles/text_box.dart
@@ -1,39 +1,43 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
+import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
class AnswerTextBox extends StatelessWidget {
const AnswerTextBox({super.key});
@override
Widget build(BuildContext context) {
- return AspectRatio(
- aspectRatio: 480 / 149.0,
- child: Stack(
- alignment: Alignment.center,
- children: [
- Positioned.fill(
- child: CustomPaint(
- painter: _WavyBannerPainter(),
- ),
+ return ClipPath(
+ clipper: _WavyBannerClipper(),
+ child: Container(
+ padding: EdgeInsets.all(MySpaces.s10),
+ decoration: BoxDecoration(
+ gradient: LinearGradient(
+ begin: Alignment.topCenter,
+ end: Alignment.bottomCenter,
+ colors: [
+ Color(0XFFFFFFFF),
+ Color(0XFFCADCFF),
+ ],
),
- Text(
- 'We walk in the yard with a glass of juice',
- textAlign: TextAlign.center,
- style: GoogleFonts.marhey(
- fontSize: 12,
- fontWeight: FontWeight.w600,
- color: Color(0XFF322386)
- ),
- )
- ],
+ ),
+ child: Text(
+ 'We walk in the yard with a glass of juice ',
+ textAlign: TextAlign.center,
+ style: GoogleFonts.marhey(
+ fontSize: 14,
+ fontWeight: FontWeight.w700,
+ color: Color(0XFF322386)
+ ),
+ ),
),
);
}
}
-class _WavyBannerPainter extends CustomPainter {
+class _WavyBannerClipper extends CustomClipper {
@override
- void paint(Canvas canvas, Size size) {
+ Path getClip(Size size) {
final sx = size.width / 480.0;
final sy = size.height / 149.0;
@@ -44,19 +48,9 @@ class _WavyBannerPainter extends CustomPainter {
..cubicTo(488.753 * sx, 118.634 * sy, 483.484 * sx, 26.7097 * sy, 459.365 * sx, 10.3813 * sy)
..cubicTo(435.246 * sx, -5.94701 * sy, 41.0302 * sx, -3.23423 * sy, 14.0623 * sx, 20.0845 * sy)
..close();
-
- final paint = Paint()
- ..style = PaintingStyle.fill
- ..isAntiAlias = true
- ..shader = const LinearGradient(
- begin: Alignment.bottomCenter,
- end: Alignment.topCenter,
- colors: [Color(0xFFCADCFF), Colors.white],
- ).createShader(Offset.zero & size);
-
- canvas.drawPath(path, paint);
+ return path;
}
@override
- bool shouldRepaint(covariant _WavyBannerPainter oldDelegate) => false;
-}
+ bool shouldReclip(covariant CustomClipper oldClipper) => false;
+}
\ No newline at end of file
diff --git a/lib/features/question/presentation/ui/question_page.dart b/lib/features/question/presentation/ui/question_page.dart
index c3ae025..b1ecdf6 100644
--- a/lib/features/question/presentation/ui/question_page.dart
+++ b/lib/features/question/presentation/ui/question_page.dart
@@ -137,8 +137,7 @@ class QuestionPage extends StatelessWidget {
clipBehavior: Clip.none,
alignment: Alignment.center,
children: [
- Positioned.directional(
- textDirection: Directionality.of(context),
+ PositionedDirectional(
start: 0,
top: -10,
child: LeftBlob(),
@@ -147,14 +146,12 @@ class QuestionPage extends StatelessWidget {
padding: const EdgeInsetsDirectional.only(end: 60),
child: MyImage(image: MyAssets.persons),
),
- Positioned.directional(
- textDirection: Directionality.of(context),
+ PositionedDirectional(
start: 210,
top: -20,
child: RightBlob(),
),
- Positioned.directional(
- textDirection: Directionality.of(context),
+ PositionedDirectional(
end: 0,
bottom: 10,
child: RefreshButton(