2020-11-29 20:07:46 +00:00
|
|
|
import 'package:flutter/material.dart';
|
2021-01-06 17:35:57 +00:00
|
|
|
import 'package:selfprivacy/logic/cubit/app_settings/app_settings_cubit.dart';
|
2020-11-29 20:07:46 +00:00
|
|
|
import 'package:selfprivacy/ui/components/brand_button/brand_button.dart';
|
2020-12-06 07:28:31 +00:00
|
|
|
import 'package:selfprivacy/utils/route_transitions/basic.dart';
|
2021-03-15 15:39:44 +00:00
|
|
|
import 'package:easy_localization/easy_localization.dart';
|
2020-11-29 20:07:46 +00:00
|
|
|
|
2020-12-30 14:13:25 +00:00
|
|
|
class OnboardingPage extends StatefulWidget {
|
2022-10-26 16:26:09 +00:00
|
|
|
const OnboardingPage({required this.nextPage, super.key});
|
2020-11-29 20:07:46 +00:00
|
|
|
|
2021-01-06 17:35:57 +00:00
|
|
|
final Widget nextPage;
|
2020-12-30 14:13:25 +00:00
|
|
|
@override
|
2022-05-25 12:21:56 +00:00
|
|
|
State<OnboardingPage> createState() => _OnboardingPageState();
|
2020-12-30 14:13:25 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
class _OnboardingPageState extends State<OnboardingPage> {
|
|
|
|
PageController pageController = PageController();
|
|
|
|
|
|
|
|
@override
|
|
|
|
void initState() {
|
|
|
|
super.initState();
|
|
|
|
}
|
|
|
|
|
2020-11-29 20:07:46 +00:00
|
|
|
@override
|
2022-06-05 19:36:32 +00:00
|
|
|
Widget build(final BuildContext context) => SafeArea(
|
2022-06-05 22:40:34 +00:00
|
|
|
child: Scaffold(
|
|
|
|
body: PageView(
|
|
|
|
controller: pageController,
|
|
|
|
children: [
|
|
|
|
_withPadding(firstPage()),
|
|
|
|
_withPadding(secondPage()),
|
|
|
|
],
|
|
|
|
),
|
2020-12-30 14:13:25 +00:00
|
|
|
),
|
2022-06-05 22:40:34 +00:00
|
|
|
);
|
2020-12-30 14:13:25 +00:00
|
|
|
|
2022-06-05 19:36:32 +00:00
|
|
|
Widget _withPadding(final Widget child) => Padding(
|
2022-06-05 22:40:34 +00:00
|
|
|
padding: const EdgeInsets.symmetric(
|
|
|
|
horizontal: 15,
|
|
|
|
),
|
|
|
|
child: child,
|
|
|
|
);
|
2020-12-30 14:13:25 +00:00
|
|
|
|
2022-06-05 19:36:32 +00:00
|
|
|
Widget firstPage() => ConstrainedBox(
|
2022-06-05 22:40:34 +00:00
|
|
|
constraints: BoxConstraints(
|
|
|
|
maxHeight: MediaQuery.of(context).size.height,
|
|
|
|
),
|
|
|
|
child: Column(
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
children: [
|
|
|
|
const SizedBox(height: 30),
|
2022-12-31 04:16:10 +00:00
|
|
|
Text(
|
2022-06-05 22:40:34 +00:00
|
|
|
'onboarding.page1_title'.tr(),
|
2022-12-31 04:16:10 +00:00
|
|
|
style: Theme.of(context).textTheme.headlineSmall,
|
2022-06-05 22:40:34 +00:00
|
|
|
),
|
2022-12-31 04:16:10 +00:00
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page1_text'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
2022-06-05 22:40:34 +00:00
|
|
|
Flexible(
|
|
|
|
child: Center(
|
|
|
|
child: Image.asset(
|
|
|
|
_fileName(
|
|
|
|
context: context,
|
|
|
|
path: 'assets/images/onboarding',
|
|
|
|
fileExtention: 'png',
|
|
|
|
fileName: 'onboarding1',
|
|
|
|
),
|
2021-02-17 16:20:09 +00:00
|
|
|
),
|
2020-12-30 14:13:25 +00:00
|
|
|
),
|
|
|
|
),
|
2022-06-05 22:40:34 +00:00
|
|
|
BrandButton.rised(
|
|
|
|
onPressed: () {
|
|
|
|
pageController.animateToPage(
|
|
|
|
1,
|
|
|
|
duration: const Duration(milliseconds: 300),
|
|
|
|
curve: Curves.easeIn,
|
|
|
|
);
|
|
|
|
},
|
|
|
|
text: 'basis.next'.tr(),
|
|
|
|
),
|
|
|
|
const SizedBox(height: 30),
|
|
|
|
],
|
|
|
|
),
|
|
|
|
);
|
2020-12-30 14:13:25 +00:00
|
|
|
|
2022-06-05 19:36:32 +00:00
|
|
|
Widget secondPage() => ConstrainedBox(
|
2022-06-05 22:40:34 +00:00
|
|
|
constraints: BoxConstraints(
|
|
|
|
maxHeight: MediaQuery.of(context).size.height,
|
|
|
|
),
|
|
|
|
child: Column(
|
2022-12-31 04:16:10 +00:00
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
2022-06-05 22:40:34 +00:00
|
|
|
children: [
|
|
|
|
const SizedBox(height: 30),
|
2022-12-31 04:16:10 +00:00
|
|
|
Text(
|
|
|
|
'onboarding.page2_title'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.headlineSmall,
|
2020-12-30 14:13:25 +00:00
|
|
|
),
|
2022-12-31 04:16:10 +00:00
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_text'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_server_provider_title'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_server_provider_text'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_dns_provider_title'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_dns_provider_text'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_backup_provider_title'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
Text(
|
|
|
|
'onboarding.page2_backup_provider_text'.tr(),
|
|
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
2022-06-05 22:40:34 +00:00
|
|
|
),
|
2022-12-31 04:16:10 +00:00
|
|
|
const SizedBox(height: 16),
|
2022-06-05 22:40:34 +00:00
|
|
|
BrandButton.rised(
|
|
|
|
onPressed: () {
|
|
|
|
context.read<AppSettingsCubit>().turnOffOnboarding();
|
|
|
|
Navigator.of(context).pushAndRemoveUntil(
|
|
|
|
materialRoute(widget.nextPage),
|
|
|
|
(final route) => false,
|
|
|
|
);
|
|
|
|
},
|
|
|
|
text: 'basis.got_it'.tr(),
|
|
|
|
),
|
|
|
|
const SizedBox(height: 30),
|
|
|
|
],
|
|
|
|
),
|
|
|
|
);
|
2020-12-03 16:52:53 +00:00
|
|
|
}
|
2021-02-17 16:20:09 +00:00
|
|
|
|
|
|
|
String _fileName({
|
2022-06-05 19:36:32 +00:00
|
|
|
required final BuildContext context,
|
|
|
|
required final String path,
|
|
|
|
required final String fileName,
|
|
|
|
required final String fileExtention,
|
2021-02-17 16:20:09 +00:00
|
|
|
}) {
|
2022-06-05 19:36:32 +00:00
|
|
|
final ThemeData theme = Theme.of(context);
|
|
|
|
final bool isDark = theme.brightness == Brightness.dark;
|
2021-02-17 16:20:09 +00:00
|
|
|
return '$path/$fileName${isDark ? '-dark' : '-light'}.$fileExtention';
|
|
|
|
}
|