aboutsummaryrefslogtreecommitdiff
path: root/lib/screens/onboarding_screen.dart
blob: 5d1ff7aef238acf416ca28b2764d0fd685b71522 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
import 'package:concentric_transition/concentric_transition.dart';
import 'package:flutter/material.dart';
import 'package:linkchat/settings/preferences.dart';
import 'package:lottie/lottie.dart';

import '../widgets/responsive.dart';

class PageData {
  final String title;
  final String icon;
  final MaterialColor bgColor;
  final Color textColor;

  const PageData({
    required this.title,
    required this.icon,
    required this.bgColor,
    required this.textColor,
  });
}

class OnboardingScreen extends StatelessWidget {
  const OnboardingScreen({super.key});

  static const pages = [
    PageData(
      title: '¡Bienvenidx a LinkChat!',
      icon: 'assets/star.json',
      bgColor: Colors.deepPurple,
      textColor: Colors.white,
    ),
    PageData(
      title:
          'Una nueva experiencia de chat donde solo puedes compartir enlaces',
      icon: 'assets/share.json',
      bgColor: Colors.red,
      textColor: Colors.white,
    ),
    PageData(
      title: 'Guarda tus enlaces favoritos para verlos más tarde',
      icon: 'assets/heart.json',
      bgColor: Colors.green,
      textColor: Colors.black,
    ),
  ];

  Widget icon(PageData data) => CircleAvatar(
        radius: 100.0,
        backgroundColor: data.bgColor.shade200,
        child: Lottie.asset(
          data.icon,
          height: 100.0,
          fit: BoxFit.fill,
        ),
      );

  Widget text(BuildContext context, PageData data) => Text(
        data.title,
        textAlign: TextAlign.center,
        style: Theme.of(context)
            .typography
            .englishLike
            .headlineMedium!
            .copyWith(color: data.textColor),
      );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ConcentricPageView(
        colors: pages.map((PageData p) => p.bgColor).toList(),
        itemCount: pages.length,
        physics: const NeverScrollableScrollPhysics(),
        itemBuilder: (int index) {
          PageData data = pages[index];
          return Center(
            child: Padding(
              padding: const EdgeInsets.all(15.0),
              child: Responsive(
                mobile: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    icon(data),
                    const SizedBox(height: 50.0),
                    text(context, data),
                  ],
                ),
                desktop: Row(
                  children: [
                    Expanded(child: icon(data)),
                    Expanded(child: text(context, data)),
                  ],
                ),
              ),
            ),
          );
        },
        onFinish: () {
          Preferences.setShowOnboarding(false);
          Navigator.of(context).pushNamed('/dash');
        },
      ),
    );
  }
}