Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ScreenTypeLayout widgets don't rebuild on browser refresh #26

Open
verscph opened this issue Mar 21, 2021 · 1 comment
Open

ScreenTypeLayout widgets don't rebuild on browser refresh #26

verscph opened this issue Mar 21, 2021 · 1 comment
Labels
question Further information is requested

Comments

@verscph
Copy link

verscph commented Mar 21, 2021

The StartupView of my app checks whether the user is logged in and navigates to "Home" or "LoginView".

When using responsive_builder, the widgets are not rebuilt when the user refreshes the browser.

My code:

class StartUpView extends StatelessWidget {
  const StartUpView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    print('StartupView');
    return ScreenTypeLayout(
      breakpoints: ScreenBreakpoints(desktop: 1920, tablet: 900, watch: 375),
      mobile: StartUpViewMobile(),
      tablet: StartUpViewTablet(),
      desktop: StartupViewDesktop()
    );
  }
}

class StartUpViewDesktop extends StatelessWidget {
  const StartUpViewDesktop({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    print('StartupViewDesktop');
    return ViewModelBuilder<StartUpViewModel>.reactive(
      viewModelBuilder: () => StartUpViewModel(),
      onModelReady: (model) => model.handleStartUpLogic(),
      builder: (context, model, child) => Scaffold(
        extendBodyBehindAppBar: true,
        extendBody: true,
        body: Center(
          child: CircularProgressIndicator(
            strokeWidth: 3,
            valueColor: AlwaysStoppedAnimation(
              Theme.of(context).accentColor,
            ),
          ),
        ),
      ),
    );
  }
}

class StartUpViewModel extends BaseModel {
  final AuthenticationService _authenticationService =
      locator<AuthenticationService>();
  final NavigationService _navigationService = locator<NavigationService>();

  Future handleStartUpLogic() async {
    bool firstTime = true;
    _authenticationService.authChanges.listen((user) async {
      if (user != null) {
        _navigationService.clearStackAndShow(Routes.homeView);
      }
      if (!firstTime && user == null) {
        if (_authenticationService.platform == 'WEB') {
          _navigationService.clearStackAndShow(Routes.loginView);
        } else {
          _navigationService.clearStackAndShow(Routes.welcomeView);
        }
      }
      firstTime = false;
    });
  }
}

The console output on startup:

StartupView
StartupViewDesktop

When I refresh the browser, the StartupViewDesktop widget isn't rebuilt. The console output is:

StartupView

and it adds the page to the navigation stack which makes the widget
Navigator.of(context).canPop() == true

Screenshot 2021-03-21 at 13 07 55

All works as expected when using

class StartUpView extends StatelessWidget {
  const StartUpView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    print('StartupView');
    return StartupViewDesktop();
  }
}

then, the StartupViewDesktop is rebuilt on refreshing the browser and
Navigator.of(context).canPop() == false

Screenshot 2021-03-21 at 13 15 21

Looks like responsive_builder doesn't handle the widget state appropriately?

Thanks for your help!

@FilledStacks
Copy link
Owner

You can pass in the builders instead using

class StartUpView extends StatelessWidget {
  const StartUpView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    print('StartupView');
    return ScreenTypeLayout.builder(
      breakpoints: ScreenBreakpoints(desktop: 1920, tablet: 900, watch: 375),
      mobile: (context) => StartUpViewMobile(),
      tablet: (context) => StartUpViewTablet(),
      desktop: (context) => StartupViewDesktop()
    );
  }
}

That should rebuild on refresh.

@Eimen2018 Eimen2018 added the question Further information is requested label Aug 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

3 participants