After pressing the "Kayıt Ol" button on the "Giriş Yap (Login)" page, I should go to the "Kayıt Ol (Signup)" page, but it adds the Login page to the stack and I can’t see the Signup page. Am I missing something? I can’t go another page from "Giriş Yap (Login)" page. I showed the case at below gif. I’m waiting your helping.
app_router.dart
part 'app_router.gr.dart';
@AutoRouterConfig(replaceInRouteName: AppRouter._replaceInRouteName)
final class AppRouter extends _$AppRouter {
static const _replaceInRouteName = 'View,Route';
@override
List<AutoRoute> get routes => [
AutoRoute(
page: LoginRoute.page,
initial: true,
children: [
AutoRoute(page: SignUpRoute.page),
],
),
];
}
login_view.dart
/// [LoginView] is a [StatefulWidget] that displays the sign up view.
@RoutePage()
final class LoginView extends StatefulWidget {
/// Constructor
const LoginView({super.key});
@override
State<LoginView> createState() => _LoginViewState();
}
class _LoginViewState extends State<LoginView> with AuthCommonViewMixin {
double _expandedHeight = 200.0;
@override
Widget build(BuildContext context) {
log('LoginView build');
return Form(
key: loginFormKey,
child: BaseView(
sliverAppBar: SliverAppBar(
pinned: false,
expandedHeight: _expandedHeight,
flexibleSpace: FlexibleSpaceBar(
background: CurvedImage(
image: Assets.icons.icLoginLogistic.svg(
fit: BoxFit.fill,
package: 'gen',
),
),
),
),
onPageBuilder: (context, value) => SliverList(
delegate: SliverChildListDelegate(
[
const AuthTitle(
titleText: LocaleKeys.authentication_login,
),
CustomTextFormField(
controller: emailController,
prefixIcon: const Icon(Icons.email_outlined),
labelText: LocaleKeys.authentication_email.tr(),
hintText: LocaleKeys.authentication_email_placeholder.tr(),
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.next,
),
CustomTextFormField(
controller: passwordController,
prefixIcon: const Icon(Icons.lock_outline),
labelText: LocaleKeys.authentication_password.tr(),
hintText: LocaleKeys.authentication_password_placeholder.tr(),
keyboardType: TextInputType.visiblePassword,
textInputAction: TextInputAction.done,
obscureText: true,
),
Align(
alignment: Alignment.centerRight,
child: TextButton(
onPressed: () {},
child: const Text(LocaleKeys.authentication_forgot_password).tr(),
),
),
Padding(
padding: PaddingManager.paddingManagerNormalPaddingSymmetricVertical,
child: CustomElevatedButton(
onPressed: () {},
child: const Text(LocaleKeys.authentication_login).tr(),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text(LocaleKeys.authentication_dont_have_account).tr(),
TextButton(
onPressed: () {
context.router.push(SignUpRoute());
},
child: const Text(LocaleKeys.authentication_sign_up).tr(),
),
],
),
],
),
),
),
);
}
}
signup_view.dart
/// [SignUpView] is a [StatefulWidget] that displays the sign up view.
@RoutePage()
final class SignUpView extends StatefulWidget {
/// Constructor
const SignUpView({super.key});
@override
State<SignUpView> createState() => _SignUpViewState();
}
class _SignUpViewState extends State<SignUpView>
with AuthCommonViewMixin, SignUpViewMixin {
@override
Widget build(BuildContext context) {
log('SignUpView build');
return Form(
key: signupFormKey,
child: BaseView(
onPageBuilder: (context, value) => SliverList(
delegate: SliverChildListDelegate(
[
const AuthTitle(
titleText: LocaleKeys.authentication_sign_up,
Padding(
padding: PaddingManager.paddingManagerNormalPaddingSymmetricVertical,
child: CustomElevatedButton(
onPressed: () {},
child: const Text(LocaleKeys.authentication_sign_up).tr(),
),
),
],
),
),
),
);
}
}
2
Answers
Instead of nesting SignUpRoute inside LoginRoute you can just place them at the same level in your AppRouter
check this docs: https://autoroute.vercel.app/basics/nested_routes
And can you watch: https://www.youtube.com/watch?v=GINXiO5Te4U
So, we before is children create and later EmptyRouter. I not like this 🙁