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 { class OnboardingBody extends HookConsumerWidget {
const OnboardingBody({ const OnboardingBody({
super.key, super.key,
@ -54,22 +70,6 @@ class OnboardingBody extends HookConsumerWidget {
final canUserLogin = useState(apiSettings.activeServer != null); 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( return Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,

View file

@ -1,9 +1,12 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shelfsdk/audiobookshelf_api.dart'; import 'package:shelfsdk/audiobookshelf_api.dart';
import 'package:vaani/api/api_provider.dart'; import 'package:vaani/api/api_provider.dart';
import 'package:vaani/api/server_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_open_id.dart';
import 'package:vaani/features/onboarding/view/user_login_with_password.dart'; import 'package:vaani/features/onboarding/view/user_login_with_password.dart';
import 'package:vaani/features/onboarding/view/user_login_with_token.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(
padding: const EdgeInsets.all(8.0), padding: const EdgeInsets.all(8.0),
child: switch (methodChoice.value) { child: AnimatedSwitcher(
AuthMethodChoice.authToken => UserLoginWithToken( duration: 200.ms,
server: server, transitionBuilder: fadeSlideTransitionBuilder,
addServer: addServer, child: switch (methodChoice.value) {
), AuthMethodChoice.authToken => UserLoginWithToken(
AuthMethodChoice.local => UserLoginWithPassword( server: server,
server: server, addServer: addServer,
addServer: addServer, ),
), AuthMethodChoice.local => UserLoginWithPassword(
AuthMethodChoice.openid => UserLoginWithOpenID( server: server,
server: server, addServer: addServer,
addServer: addServer, ),
openIDButtonText: openIDButtonText, AuthMethodChoice.openid => UserLoginWithOpenID(
), server: server,
}, addServer: addServer,
openIDButtonText: openIDButtonText,
),
},
),
), ),
], ],
), ),