feat: add fadeSlideTransitionBuilder for smoother transitions in user login

This commit is contained in:
Dr.Blank 2025-04-23 00:53:24 +05:30
parent ad0cd6e2ad
commit a05f095892
No known key found for this signature in database
GPG key ID: BA5F87FF0560C57B
2 changed files with 42 additions and 32 deletions

View file

@ -39,6 +39,22 @@ class OnboardingSinglePage extends HookConsumerWidget {
}
}
Widget fadeSlideTransitionBuilder(
Widget child,
Animation<double> animation,
) {
return FadeTransition(
opacity: animation,
child: SlideTransition(
position: Tween<Offset>(
begin: const Offset(0, 0.3),
end: const Offset(0, 0),
).animate(animation),
child: child,
),
);
}
class OnboardingBody extends HookConsumerWidget {
const OnboardingBody({
super.key,
@ -54,22 +70,6 @@ class OnboardingBody extends HookConsumerWidget {
final canUserLogin = useState(apiSettings.activeServer != null);
fadeSlideTransitionBuilder(
Widget child,
Animation<double> animation,
) {
return FadeTransition(
opacity: animation,
child: SlideTransition(
position: Tween<Offset>(
begin: const Offset(0, 0.3),
end: const Offset(0, 0),
).animate(animation),
child: child,
),
);
}
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,

View file

@ -1,9 +1,12 @@
import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shelfsdk/audiobookshelf_api.dart';
import 'package:vaani/api/api_provider.dart';
import 'package:vaani/api/server_provider.dart';
import 'package:vaani/features/onboarding/view/onboarding_single_page.dart'
show fadeSlideTransitionBuilder;
import 'package:vaani/features/onboarding/view/user_login_with_open_id.dart';
import 'package:vaani/features/onboarding/view/user_login_with_password.dart';
import 'package:vaani/features/onboarding/view/user_login_with_token.dart';
@ -172,26 +175,33 @@ class UserLoginMultipleAuth extends HookConsumerWidget {
}
},
),
],
].animate(interval: 100.ms).fadeIn(
duration: 150.ms,
curve: Curves.easeIn,
),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: switch (methodChoice.value) {
AuthMethodChoice.authToken => UserLoginWithToken(
server: server,
addServer: addServer,
),
AuthMethodChoice.local => UserLoginWithPassword(
server: server,
addServer: addServer,
),
AuthMethodChoice.openid => UserLoginWithOpenID(
server: server,
addServer: addServer,
openIDButtonText: openIDButtonText,
),
},
child: AnimatedSwitcher(
duration: 200.ms,
transitionBuilder: fadeSlideTransitionBuilder,
child: switch (methodChoice.value) {
AuthMethodChoice.authToken => UserLoginWithToken(
server: server,
addServer: addServer,
),
AuthMethodChoice.local => UserLoginWithPassword(
server: server,
addServer: addServer,
),
AuthMethodChoice.openid => UserLoginWithOpenID(
server: server,
addServer: addServer,
openIDButtonText: openIDButtonText,
),
},
),
),
],
),