feat: full onboarding + quiz flow (Flutter from scratch)

- splash → intro → 5-step quiz → result screen
- Plus Jakarta Sans typography, indigo brand system
- animated quiz rows, multi-select concerns, progress bar
- Shaynee mascot reveal on result screen only
- flutter_animate for all transitions
This commit is contained in:
mav
2026-05-28 16:20:18 +02:00
parent 74c712dbae
commit 30cee5a486
12 changed files with 1567 additions and 144 deletions

View File

@@ -0,0 +1,66 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import '../theme.dart';
class PrimaryButton extends StatelessWidget {
final String label;
final VoidCallback onTap;
final bool enabled;
final IconData? icon;
const PrimaryButton({
super.key,
required this.label,
required this.onTap,
this.enabled = true,
this.icon,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: enabled ? onTap : null,
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
height: 56,
decoration: BoxDecoration(
gradient: enabled
? const LinearGradient(
colors: [SColors.primary, SColors.gradientBot],
begin: Alignment.centerLeft,
end: Alignment.centerRight,
)
: null,
color: enabled ? null : SColors.border,
borderRadius: BorderRadius.circular(16),
boxShadow: enabled
? [
BoxShadow(
color: SColors.primary.withAlpha(60),
blurRadius: 16,
offset: const Offset(0, 6),
)
]
: [],
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
label,
style: GoogleFonts.plusJakartaSans(
fontSize: 16,
fontWeight: FontWeight.w700,
color: enabled ? Colors.white : SColors.textSecondary,
),
),
if (icon != null) ...[
const SizedBox(width: 8),
Icon(icon, color: enabled ? Colors.white : SColors.textSecondary, size: 18),
],
],
),
),
);
}
}

View File

@@ -0,0 +1,109 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:google_fonts/google_fonts.dart';
import '../theme.dart';
class QuizOptionRow extends StatelessWidget {
final IconData icon;
final String label;
final String sub;
final bool isSelected;
final VoidCallback onTap;
const QuizOptionRow({
super.key,
required this.icon,
required this.label,
required this.isSelected,
required this.onTap,
this.sub = '',
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
HapticFeedback.selectionClick();
onTap();
},
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
curve: Curves.easeOut,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration(
color: isSelected ? SColors.primary.withAlpha(13) : SColors.surface,
borderRadius: BorderRadius.circular(18),
border: Border.all(
color: isSelected ? SColors.primary.withAlpha(128) : SColors.border,
width: 1.5,
),
),
child: Row(
children: [
AnimatedContainer(
duration: const Duration(milliseconds: 200),
width: 52,
height: 52,
decoration: BoxDecoration(
color: isSelected
? SColors.primary.withAlpha(26)
: SColors.skyTint.withAlpha(140),
borderRadius: BorderRadius.circular(14),
),
child: Icon(
icon,
size: 26,
color: isSelected ? SColors.primary : SColors.textSecondary,
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label,
style: GoogleFonts.plusJakartaSans(
fontSize: 16,
fontWeight: FontWeight.w600,
color: isSelected ? SColors.primary : SColors.textPrimary,
),
),
if (sub.isNotEmpty) ...[
const SizedBox(height: 2),
Text(
sub,
style: GoogleFonts.plusJakartaSans(
fontSize: 13,
color: SColors.textSecondary,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
],
),
),
const SizedBox(width: 12),
AnimatedContainer(
duration: const Duration(milliseconds: 200),
width: 22,
height: 22,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: isSelected ? SColors.primary : Colors.transparent,
border: Border.all(
color: isSelected ? SColors.primary : SColors.border,
width: 1.5,
),
),
child: isSelected
? const Icon(Icons.check, size: 13, color: Colors.white)
: null,
),
],
),
),
);
}
}