Files
shaynee-flutter/lib/screens/onboarding/s13_referral.dart
mav 93042cbb4c feat: complete 20-screen onboarding flow
Full quiz flow s01-s20: splash, intro, value prop, social proof,
name/skin-type/age/concerns/goal quiz with insights, analysing loader,
result with skin score, AM/PM routines, ingredient science, signup, welcome.

Duolingo-style design: flat cards, pressable SButton (Stack trick),
4px progress bar, mascot moods (wave/think/analyze/celebrate),
confetti on result+welcome, personalized content throughout.
2026-05-28 17:11:27 +02:00

102 lines
4.0 KiB
Dart

import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import '../../theme.dart';
import '../../widgets/s_card.dart';
import '../../widgets/s_button.dart';
import '../../widgets/s_progress_bar.dart';
import '../../model/quiz_state.dart';
import '../../router.dart';
import 's14_analysing.dart';
import '_quiz_nav.dart';
class ReferralScreen extends StatefulWidget {
final QuizState state;
const ReferralScreen({super.key, required this.state});
@override
State<ReferralScreen> createState() => _State();
}
class _State extends State<ReferralScreen> {
String _selected = '';
static const _opts = [
(Icons.people_rounded, 'Friend or family', 'They recommended it'),
(Icons.play_circle_rounded, 'TikTok / Instagram', 'Saw it on social media'),
(Icons.search_rounded, 'Google search', 'Found it myself'),
(Icons.star_rounded, 'App Store', 'Featured or reviewed'),
(Icons.more_horiz_rounded, 'Other', 'Somewhere else'),
];
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: SColors.bgSurface,
body: SafeArea(
child: Column(
children: [
QuizNav(step: 6, total: 7, onBack: () => Navigator.of(context).pop()),
const SizedBox(height: 10),
Padding(padding: const EdgeInsets.symmetric(horizontal: 16), child: SProgressBar(value: 6 / 7)),
Expanded(
child: SingleChildScrollView(
padding: const EdgeInsets.fromLTRB(16, 24, 16, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('How did you\nhear about us?', style: SText.headline2(SColors.textHead))
.animate().fadeIn(duration: 350.ms),
const SizedBox(height: 6),
Text("Helps us understand where our community comes from.", style: SText.subtitle(SColors.textSub))
.animate().fadeIn(duration: 350.ms, delay: 80.ms),
const SizedBox(height: 20),
],
),
),
..._opts.asMap().entries.map((e) {
final i = e.key; final (icon, label, sub) = e.value;
return Padding(
padding: const EdgeInsets.only(bottom: 8),
child: SCard(
icon: icon, label: label, sub: sub,
isSelected: _selected == label,
onTap: () => setState(() => _selected = label),
).animate().fadeIn(duration: 280.ms, delay: (100 + i * 55).ms)
.slideX(begin: 0.03, end: 0, duration: 280.ms),
);
}),
],
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(16, 12, 16, 20),
child: Column(
children: [
SButton(
label: 'BUILD MY REPORT',
enabled: _selected.isNotEmpty,
onTap: _selected.isNotEmpty ? () {
widget.state.referral = _selected;
Navigator.of(context).push(slideRoute(AnalysingScreen(state: widget.state)));
} : null,
),
const SizedBox(height: 12),
GestureDetector(
onTap: () => Navigator.of(context).push(slideRoute(AnalysingScreen(state: widget.state))),
child: Text('Skip', style: SText.caption(SColors.textSub)),
),
],
),
),
],
),
),
);
}
}