From 3079b4bcc5f7565c277a23bc55e6f65e6364c9c7 Mon Sep 17 00:00:00 2001
From: Inex Code <inex.code@selfprivacy.org>
Date: Fri, 16 Sep 2022 01:28:10 +0300
Subject: [PATCH] Add animations to segmented_buttons.dart
---
.../brand_button/segmented_buttons.dart | 37 +++++++++++++------
1 file changed, 26 insertions(+), 11 deletions(-)
diff --git a/lib/ui/components/brand_button/segmented_buttons.dart b/lib/ui/components/brand_button/segmented_buttons.dart
index 444aa906..8ddccb5b 100644
--- a/lib/ui/components/brand_button/segmented_buttons.dart
+++ b/lib/ui/components/brand_button/segmented_buttons.dart
@@ -30,19 +30,34 @@ class SegmentedButtons extends StatelessWidget {
children: titles.asMap().entries.map((final entry) {
final index = entry.key;
final title = entry.value;
- return Row(
- crossAxisAlignment: CrossAxisAlignment.center,
+ return Stack(
+ alignment: Alignment.centerLeft,
children: [
- if (isSelected[index])
- Icon(
- Icons.check,
- size: 18,
- color: Theme.of(context).colorScheme.onSecondaryContainer,
+ AnimatedOpacity(
+ duration: const Duration(milliseconds: 200),
+ opacity: isSelected[index] ? 1 : 0,
+ child: AnimatedScale(
+ duration: const Duration(milliseconds: 200),
+ curve: Curves.easeInOut,
+ alignment: Alignment.centerLeft,
+ scale: isSelected[index] ? 1 : 0,
+ child: Icon(
+ Icons.check,
+ size: 18,
+ color: Theme.of(context).colorScheme.onSecondaryContainer,
+ ),
+ ),
+ ),
+ AnimatedPadding(
+ padding: isSelected[index]
+ ? const EdgeInsets.only(left: 24)
+ : EdgeInsets.zero,
+ duration: const Duration(milliseconds: 200),
+ curve: Curves.easeInOut,
+ child: Text(
+ title,
+ style: Theme.of(context).textTheme.labelLarge,
),
- if (isSelected[index]) const SizedBox(width: 8),
- Text(
- title,
- style: Theme.of(context).textTheme.labelLarge,
),
],
);