Ui improvements for tablet mode

This commit is contained in:
Juan Gilsanz Polo
2024-02-28 18:25:48 +01:00
parent 55c8901eb0
commit c777ccbbca
5 changed files with 195 additions and 118 deletions

View File

@@ -5,76 +5,77 @@ import 'package:linkdy/i18n/strings.g.dart';
import 'package:linkdy/screens/onboarding/provider/onboarding.provider.dart';
class OnboardingWelcome extends ConsumerWidget {
const OnboardingWelcome({Key? key}) : super(key: key);
const OnboardingWelcome({super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
final width = MediaQuery.of(context).size.width;
final height = MediaQuery.of(context).size.height;
final iconSize = width > height ? height : width;
return Padding(
padding: const EdgeInsets.all(24),
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
return LayoutBuilder(
builder: (context, constraints) {
return Padding(
padding: const EdgeInsets.all(24),
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Image.asset(
'assets/icon/icon1024.png',
width: 50,
height: 50,
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.asset(
'assets/icon/icon1024.png',
width: 50,
height: 50,
),
const SizedBox(height: 24),
Text(
t.onboarding.title,
style: const TextStyle(fontSize: 28),
),
const SizedBox(height: 16),
Text(
t.onboarding.subtitle,
style: TextStyle(
fontSize: 16,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
],
),
const SizedBox(height: 24),
Text(
t.onboarding.title,
style: const TextStyle(fontSize: 28),
),
const SizedBox(height: 16),
Text(
t.onboarding.subtitle,
style: TextStyle(
fontSize: 16,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const SizedBox(),
FilledButton(
onPressed: () => ref.read(onboardingProvider.notifier).nextPage(),
child: Row(
children: [
Text(t.onboarding.start),
const SizedBox(width: 8),
const Icon(Icons.arrow_forward_rounded),
],
),
),
],
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const SizedBox(),
FilledButton(
onPressed: () => ref.read(onboardingProvider.notifier).nextPage(),
child: Row(
children: [
Text(t.onboarding.start),
const SizedBox(width: 8),
const Icon(Icons.arrow_forward_rounded),
],
),
Center(
child: Transform.rotate(
angle: 0.7,
child: Icon(
Icons.link_rounded,
size: constraints.maxWidth > constraints.maxHeight
? constraints.maxHeight
: constraints.maxWidth - 48,
color: Theme.of(context).colorScheme.secondary.withOpacity(0.2),
),
],
),
),
],
),
Center(
child: Transform.rotate(
angle: 0.7,
child: Icon(
Icons.link_rounded,
size: iconSize - 48,
color: Theme.of(context).colorScheme.secondary.withOpacity(0.2),
),
),
),
],
),
);
},
);
}
}