how to pass data to another screen using bloc in flutter
Asked Answered
S

2

5

hello I am new in flutter and bloc, I imagine that I have 2 screens (login and home screen). In login screen I am using bloc that post data and I want to call that data in my home screen. Can someone give me example to do that?

Sheriesherif answered 1/4, 2020 at 2:1 Comment(1)
Welcome to StackOverflow! Have you tried anything so far? StackOverflow isn't a free code-writing service, and expects you to try to solve your own problem first. Please update your question to show what you have already tried, showing the specific problem you are facing in a minimal, complete, and verifiable example. For further information, please see how to ask a good question, and take the tour of the site.Cocks
T
3

If you just want to pass a value to home page from login page, you can do like this:

class Home extends StatelessWidget {
  final String username;

  Home(this.username);

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

class Login extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(onPressed: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (ctx) {
          return Home('flutter');
        }));
      }),
    );
  }
}
Tingly answered 1/4, 2020 at 3:8 Comment(4)
how to do that inside stateful, I try using stateful by some tutorial but I get the problem that says like this (This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: MainScreen.value)Sheriesherif
The widgets fields are supposed to be declared as final. Only mutate the variables inside your State class. You can get the variables from the widget doing widget.variableName inside your State.Odontograph
it works, but another problem is I have bottom tab navigator... the route is like this: after I post data in login screen, I navigate it to a file that consists of bottom tab navigator where the main menu is home screen. Should I add something inside my bottom tab navigator file?Sheriesherif
I don't understand what you mean and this looks like another topic, so you should open a new question with code samples so we can understand you better. Also, vote for answers that you like and if one of them answers you then accept itOdontograph
O
4

There are many ways to do that, I can name a few.

  1. You navigate to the new Widget (the screen) and pass to that Widget constructor the data you want it to have.

  2. You can use Provider to provide that data and wrap the new screen on it, then navigate to the new screen.

  3. If this is some data that should be accessed across the app, you could provide the entire BLoC to the entire App and get the BLoC's reference on this new screen and then get the data directly from the BLoC.

Odontograph answered 1/4, 2020 at 3:11 Comment(4)
do you have some resources or examples that I can read because difficult to me to understand some resourcesSheriesherif
On 1, 2 or 3? Each of them is a little different, but it should be simple, start with 1 and just pass it to a constructor.Odontograph
can you help me for number 2 and 3 by giving resources or examples?Sheriesherif
Try reading the Provider documentation, if you don't understand something, open a new question about it here on stackoverflow. The documentation is good and there are lots of samples online.Odontograph
T
3

If you just want to pass a value to home page from login page, you can do like this:

class Home extends StatelessWidget {
  final String username;

  Home(this.username);

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

class Login extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(onPressed: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (ctx) {
          return Home('flutter');
        }));
      }),
    );
  }
}
Tingly answered 1/4, 2020 at 3:8 Comment(4)
how to do that inside stateful, I try using stateful by some tutorial but I get the problem that says like this (This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: MainScreen.value)Sheriesherif
The widgets fields are supposed to be declared as final. Only mutate the variables inside your State class. You can get the variables from the widget doing widget.variableName inside your State.Odontograph
it works, but another problem is I have bottom tab navigator... the route is like this: after I post data in login screen, I navigate it to a file that consists of bottom tab navigator where the main menu is home screen. Should I add something inside my bottom tab navigator file?Sheriesherif
I don't understand what you mean and this looks like another topic, so you should open a new question with code samples so we can understand you better. Also, vote for answers that you like and if one of them answers you then accept itOdontograph

© 2022 - 2024 — McMap. All rights reserved.