amirreza.chegini
/
hade_hoda_flutter
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add: question page

pull/7/head
AmirrezaChegini 2 weeks ago
parent
cf770a8b2e
commit
2dc264bdcb
10 changed files with 233 additions and 3 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      assets/images/bubble_chat_left.svg
  2. 3
      assets/images/bubble_chat_right.svg
  3. 3
      assets/images/home.svg
  4. 3
      assets/images/music.svg
  5. BIN
      assets/images/pattern.png
  6. BIN
      assets/images/persons.png
  7. 6
      lib/common_ui/resources/my_assets.dart
  8. 1
      lib/core/widgets/answer_box/answer_box.dart
  9. 2
      lib/features/intro/presentation/ui/intro_page.dart
  10. 208
      lib/features/question/presentation/ui/question_page.dart

10
assets/images/bubble_chat_left.svg
View File

@ -0,0 +1,10 @@
<svg width="99" height="74" viewBox="0 0 99 74" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_6_220)">
<path d="M49.4006 68.5179C22.3902 68.5179 0.490861 54.2312 0.490861 36.6075C0.490861 18.9839 22.3902 4.6972 49.4006 4.6972C76.411 4.6972 98.3103 18.9839 98.3103 36.6075C98.3103 44.6307 93.7678 51.9701 86.2663 57.5772C86.8593 62.2087 88.8157 67.287 90.9799 71.098C91.4629 71.9459 90.5275 72.8941 89.3109 72.7483C75.5184 71.0616 73.7515 67.7951 70.1872 66.4457C65.5055 67.3801 54.2471 68.5263 49.4006 68.5179Z" fill="#2F2487"/>
</g>
<defs>
<clipPath id="clip0_6_220">
<rect width="97.8194" height="72.957" fill="white" transform="matrix(-1 0 0 1 98.3102 0.213867)"/>
</clipPath>
</defs>
</svg>

3
assets/images/bubble_chat_right.svg
View File

@ -0,0 +1,3 @@
<svg width="98" height="69" viewBox="0 0 98 69" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M48.9351 63.8829C75.9455 63.8829 97.8448 49.5961 97.8448 31.9725C97.8448 14.3489 75.9455 0.0621948 48.9351 0.0621948C21.9247 0.0621948 0.0253601 14.3489 0.0253601 31.9725C0.0253601 39.9957 4.56785 47.3351 12.0694 52.9422C11.4763 57.5737 9.51996 62.652 7.3557 66.463C6.87272 67.3109 7.80812 68.2591 9.02475 68.1132C22.8173 66.4266 24.5841 63.1601 28.1484 61.8107C32.8302 62.745 44.0886 63.8913 48.9351 63.8829Z" fill="#2F2487"/>
</svg>

3
assets/images/home.svg
View File

@ -0,0 +1,3 @@
<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20.2727 11.7991L17.6334 12.2735L16.3568 21.4979H13.1477C13.0442 19.4422 12.5783 14.2765 10.4907 14.4698C8.40321 14.6631 8.07547 19.0556 7.9547 21.4979H5.03916C4.20655 18.4616 3.53248 15.3825 3.02035 12.2735H0.708801C0.708801 12.2735 6.83342 0.571633 9.80082 0.308078C12.7682 0.0445223 20.2727 11.7991 20.2727 11.7991Z" fill="#E4E3F7"/>
</svg>

3
assets/images/music.svg
View File

@ -0,0 +1,3 @@
<svg width="22" height="20" viewBox="0 0 22 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21.6667 2.04697V14.4808C21.6649 15.4104 21.3367 16.3119 20.7357 17.0376C20.1347 17.7634 19.2966 18.2703 18.3587 18.4755C17.4208 18.6806 16.4386 18.5718 15.573 18.1669C14.7074 17.7619 14.0096 17.0849 13.594 16.2465C13.1784 15.4082 13.0696 14.4583 13.2854 13.5523C13.5012 12.6464 14.0288 11.8381 14.7817 11.2599C15.5347 10.6817 16.4685 10.3677 17.4301 10.3695C18.3918 10.3713 19.3243 10.6887 20.0749 11.2697V7.16617L8.9642 9.11536V15.5785C8.9642 16.3901 8.71525 17.1835 8.24882 17.8583C7.7824 18.5331 7.11945 19.0591 6.34382 19.3697C5.56818 19.6803 4.7147 19.7615 3.89129 19.6032C3.06788 19.4449 2.31153 19.054 1.71788 18.4801C1.12424 17.9062 0.71996 17.1751 0.556174 16.379C0.392388 15.583 0.476449 14.7579 0.797727 14.0081C1.11901 13.2583 1.66307 12.6174 2.36112 12.1665C3.05918 11.7156 3.87986 11.4749 4.7194 11.4749C5.69402 11.4768 6.6383 11.8028 7.39363 12.3982V4.79636C7.38186 4.08709 7.62995 3.39665 8.09402 2.84717C8.56943 2.31042 9.22143 1.94818 9.9405 1.82128L19.3852 0.149074C19.8126 0.0731542 20.254 0.138029 20.6388 0.333319C21.0236 0.528608 21.3295 0.843024 21.5076 1.22626C21.6254 1.48376 21.6805 1.76485 21.6667 2.04697Z" fill="#E4E3F7"/>
</svg>

BIN
assets/images/pattern.png
View File

Side by Side

After

Width: 412  |  Height: 412  |  Size: 3.1 KiB

BIN
assets/images/persons.png
View File

Side by Side

After

Width: 108  |  Height: 94  |  Size: 24 KiB

6
lib/common_ui/resources/my_assets.dart
View File

@ -17,4 +17,10 @@ class MyAssets {
static const String language = 'assets/images/language.svg';
static const String newHorizon = 'assets/images/new_horizon.svg';
static const String khadijeLogo = 'assets/images/khadije_logo.png';
static const String home = 'assets/images/home.svg';
static const String music = 'assets/images/music.svg';
static const String pattern = 'assets/images/pattern.png';
static const String persons = 'assets/images/persons.png';
static const String bubbleChatLeft = 'assets/images/bubble_chat_left.svg';
static const String bubbleChatRight = 'assets/images/bubble_chat_right.svg';
}

1
lib/core/widgets/answer_box/answer_box.dart
View File

@ -22,7 +22,6 @@ class _AnswerBoxState extends State<AnswerBox> {
});
},
child: SizedBox(
width: 170,
child: Stack(
alignment: Alignment.bottomCenter,
clipBehavior: Clip.none,

2
lib/features/intro/presentation/ui/intro_page.dart
View File

@ -80,7 +80,7 @@ class IntroPage extends StatelessWidget {
size: checkSize(context: context, mobile: 90, tablet: 160),
),
onTap: () {
context.pushNamed(Routes.questionPage);
context.goNamed(Routes.questionPage);
},
),
MyImage(

208
lib/features/question/presentation/ui/question_page.dart
View File

@ -1,10 +1,216 @@
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/core/utils/my_image.dart';
import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
import 'package:hadi_hoda_flutter/core/widgets/answer_box/answer_box.dart';
class QuestionPage extends StatelessWidget {
const QuestionPage({super.key});
@override
Widget build(BuildContext context) {
return const Scaffold();
return Scaffold(
body: Container(
height: context.heightScreen,
width: context.widthScreen,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0XFF6930DA), Color(0XFF263AA1)],
),
image: DecorationImage(
image: AssetImage(MyAssets.pattern),
scale: 3,
repeat: ImageRepeat.repeat,
colorFilter: ColorFilter.mode(
Colors.black.withValues(alpha: 0.3),
BlendMode.srcIn,
),
),
),
child: SafeArea(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 48,
height: 48,
padding: EdgeInsets.all(12),
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.white.withValues(alpha: 0.3),
Color(0XFF6930DA).withValues(alpha: 0.1),
],
),
border: Border.all(
color: Colors.white.withValues(alpha: 0.3),
),
),
child: MyImage(image: MyAssets.home),
),
Text(
'Toothbrushing etiquette',
style: GoogleFonts.marhey(
fontSize: 14,
fontWeight: FontWeight.w700,
color: Colors.white,
),
),
Container(
width: 48,
height: 48,
padding: EdgeInsets.all(12),
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.white.withValues(alpha: 0.3),
Color(0XFF6930DA).withValues(alpha: 0.1),
],
),
border: Border.all(
color: Colors.white.withValues(alpha: 0.3),
),
),
child: MyImage(image: MyAssets.music),
),
],
),
Column(
children: [
Text(
'Question 1 / 5',
style: GoogleFonts.marhey(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Colors.white.withValues(alpha: 0.5),
shadows: [
Shadow(
offset: Offset(0, 1),
blurRadius: 1,
color: Color(0xFF000000).withValues(alpha: 0.25),
),
],
),
),
Text(
'Heda wants her teeth to be clean. Which of her actions do you think is correct?',
style: GoogleFonts.marhey(
fontSize: 22,
fontWeight: FontWeight.w600,
color: Colors.white,
shadows: [
Shadow(
offset: Offset(0, 1),
blurRadius: 1,
color: Color(0xFF000000).withValues(alpha: 0.25),
),
],
),
),
],
),
Expanded(
child: GridView.builder(
itemCount: 4,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
crossAxisSpacing: 20,
mainAxisSpacing: 30,
),
itemBuilder: (context, index) => AnswerBox(),
),
),
SizedBox(
width: context.widthScreen,
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.center,
children: [
Positioned.directional(
textDirection: Directionality.of(context),
start: 0,
top: -10,
child: Stack(
alignment: Alignment.center,
children: [
MyImage(image: MyAssets.bubbleChatLeft),
Text(
'Your answer\nwas not correct.',
textAlign: TextAlign.center,
style: GoogleFonts.marhey(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Color(0XFFB5AEEE),
),
),
],
),
),
Padding(
padding: const EdgeInsetsDirectional.only(end: 90),
child: MyImage(image: MyAssets.persons),
),
Positioned.directional(
textDirection: Directionality.of(context),
start: 220,
top: -20,
child: Stack(
alignment: Alignment.center,
children: [
MyImage(image: MyAssets.bubbleChatRight),
Text(
'Be more\ncareful.',
textAlign: TextAlign.center,
style: GoogleFonts.marhey(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Color(0XFFB5AEEE),
),
),
],
),
),
Positioned.directional(
textDirection: Directionality.of(context),
end: 0,
bottom: 10,
child: Container(
height: 48,
width: 48,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0XFFA393FF), Color(0XFFC6BCFB)],
),
),
child: Icon(
Icons.refresh,
size: 40,
color: Color(0XFF263AA1),
),
),
),
],
),
),
],
),
),
),
);
}
}
Write Preview
Loading…
Cancel
Save