How Stateful Widgets Are Used Best - Flutter Widgets 101 Ep. 2
Why Stack Overflow recommends it
Stack Overflow users link it when answering Flutter questions that hinge on how StatefulWidget, setState and the widget and element trees behave.
Recommended by 8 people across 8 different months, 2019 to 2023.
What it is
Episode 2 of Google's Flutter Widgets 101 series, presented by Andrew Brogdon. It explains what a StatefulWidget is, how it differs from a stateless one, and how State objects work, using the widget and element trees to show what happens under the hood.
What people said
Strong rec Vandad Nahavandipoor · 2022-02 · Stack Overflow · on “How Flutter framework optimizes the widget rendering if build method can be called many times?”
This is a really good question. The Flutter team has put together this really useful video on YouTube [this video] that explains this perfectly and in details. Essentially you need to understand the difference between the Widget tree and the element tree. Every widget inside your widget tree is backed by something called an element, and this element is what Flutter actually uses to draw "things" on the screen. The widgets are the visual representation of the elements from the programmer's perspective while the elements are the actual visual representation of the widgets on the screen. The optimizations are done at the element tree level which you usually don't get to work with directly.
Recommends TruongSinh · 2019-03 · Stack Overflow · on “StreamBuilder child widget interaction”
TextField widget is newly created, but it's corresponding element is reused/recyled (and so is it state). Here's a pretty good explanation from the creator: [this video]
Recommends Kherel · 2019-08 · Stack Overflow · on “How to access and to change property value of a specific widget in a list”
Your question connected to the big theme that called app state management. Learn about it beginning from stateful widget, inherited widget, provider package, and BLoC pattern. (from simplest to hardest) This is a video made by flutter team about stateful widget [this video] . going back to your question, simple example of using stateful widget: class _MyHomePageState extends State<MyHomePage> { var list = <List<int>>[ [1, 6], [2, 8], [4, 20] ]; void _incrementSecondCardStartParametr() { setState(() { list[1][0] += 1; }); } Function decrementEndParametr(idx) => () => setState((){ list[idx][1] -= 1; }); @override Widget build(BuildContext context) { List<Widget> _widgets = list .map((data) => DataC
Recommends Amazing Aidan · 2019-11 · Stack Overflow · on “How do I display user input in a flutter table”
This all needs to be contained within a StatefulWidget [LINK] and your on pressed code should include setState() See the examples and video [this video]
Recommends TheMisir · 2020-01 · Stack Overflow · on “BuildContext for a class”
You are doing something wrong, but to access context from any method you could use StatefulWidget instead of StatelessWidget. class MyWidget extends StatefulWidget { @override _MyWidgetState createState() => _MyWidgetState(); } class _MyWidgetState extends State<MyWidget> { ... } You can read more about using StatefulWidget from flutter docs [LINK] . Also, check out this video [this video] .
Recommends Abdelrahman Bonna · 2020-04 · Stack Overflow · on “Flutter stateful widget”
First class is the one that rebuilds the widget if you change anything in it. So for example if you have a text widget in the stateful widget and in the runtime you pressed a button and changed the text from 'Hello World' to 'Hello User' actually what happens is that flutter destroys the second class and rebuild it again with the new text using the first one. You can find more information in this video from the Flutter Team: Stateful Widgets Video [this video]
Recommends kallis · 2021-02 · Stack Overflow · on “Flutter - hide/show two banners by tapping n screen”
Add a global variable eg- bool _isVisible = true, then wrap any widget that you want to hide or then show in Visibility widget, Visibility( //replace container with your desired widget child: Container(), visible: _isVisible, ), After that, Flutter has a useful widget called GestureDetector. Just wrap any other widget into it, in your case the overall screen widget. GestureDetector( onTap: () { setState(() { _isVisible = !_isvisible; }); }, //Replace container with the widget that you using for screen child: Container() ) setState() function is used for resetting the state according to the changes it make. Finally, the most important thing use StatefulWidget. Here is a youtube video to learn
Recommends Sanchit Arora · 2022-06 · Stack Overflow · on “Can't update a widget state inside a List or a Map”
Since you are using StatefulWidget to rebuild the UI, you should know some common functionality about how it works: The initState() method gets called only once when your page is getting build for the first time. The setState() method triggers rebuild of the StatefulWidget (build method) which rebuilds all components (widget) under build method. When you try to call setState() from TextField which is inside the map, it does not rebuild the color of TextField because it is outside the scope of build method. You can toggle the color of TextField which is inside the scope of build method through setState() method of TextField which is inside the map. See this video to understand more [this video] .
Cites SEG.Veenstra · 2019-01 · Stack Overflow · on “How to Continue Transform/Rotation? - Dart/Flutter”
You basically want to save the state of the widget so I think you will need to wrap it in a StatefulWidget to be able to do that. ( [this video] ) To smooth out the animation you could maybe try and use the AnimatedContainer? I haven't used it myself but I think it should be what you need! ( [LINK] ) EDIT Okay, I've got it working for you. Offset vector; double startingAngle; double deltaAngle = 0.0; double finalAngle = 0.0; // store the final angle of the object double finalObjectAngle = 0.0; void _onPanStart(DragStartDetails details) { _polarCoordFromGlobalOffset(details.globalPosition); startingAngle = vector.direction; print('START = $startingAngle ==================================='); } voi
Cites Kab Agouda · 2021-02 · Stack Overflow · on “Missing concrete of implementation of 'statefulwidget.createstate' and setstate isn't deifned”
Here is an example of a StatefulWidget implementation class NameOfYourWidget extends StatefulWidget { @override _NameOfYourWidgetState createState() => _NameOfYourWidgetState(); } class _NameOfYourWidgetState extends State<NameOfYourWidget> { @override Widget build(BuildContext context) { return Container( ); } } For your code , use this instead : class Shared extends StatefulWidget { @override _SharedState createState() => _SharedState(); } class _SharedState extends State<Shared> { bool _isLoggedIn = false; Map userProfile; final facebookLogin = FacebookLogin(); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Colors.amber, centerTitle: true,