Flutter

I. In Brief: Stateless: Parent widget help to set Children State (Raised Button, Text and Icon) Stateful: Not regulated by parent, regulated itself by watching for any changes and updating the state (setState()). II. Stateless: Both are stateless. Stateful is associated with a state  and is immutable (stateless). Parent's Widget Relationship with Child's Widget The parent widget is stateless because it does not care about its child's state. The stateful child itself (or technically Flutter) will take care of its own state. III. Type of Widget: Stateless: Raised Button, Text and Icon Stateful: User interaction;  form, slider & widget that changes over time, data feed causes the UI to update; Checkbox, Radio, Slider, InkWell, Form, and TextField IV. Re-render: Stateless: Depend on external data Stateful: depend on  internal state and re-render when input data or Widget's state changes. V. Lifecycle Stateful:  Recycle Widget but...

1. Drawer Official Doc Material Design has 2 mode of navigation, Tabs or/and Drawer. Drawer slide in horizontally Use ListView (Scrollable) or Column as Child ListTitle for each single row Details of User can be displayed with DrawerHeader , UserAccountsDrawerHeader onTap Behaviour can be set Wrapper: Material App > Scaffold > Drawer > ListView Drawer: When tapped on row, will change Text in Main Page void main(){ runApp( new MaterialApp(home: new DrawerTemp()),); } class DrawerTemp extends StatefulWidget { @override _DrawerTempState createState() => _DrawerTempState(); } class _DrawerTempState extends State<DrawerTemp> { String TextValue = "Original" ; @override Widget build(BuildContext context) { return Scaffold( appBar: new AppBar( title: new Text( "Drawer Test" ), backgroundColor: Colors. lightBlueAccent , ), drawer: new Drawer( child: new ListView( ...

https://medium.com/flutter-community/breaking-layouts-in-rows-and-columns-in-flutter-8ea1ce4c1316 https://medium.com/flutter-community/parsing-complex-json-in-flutter-747c46655f51 End-to-end test https://medium.com/flutter-community/flutter-plugins-asyncloader-6efd9d19b6a3 Navigation https://medium.com/flutter-community/flutter-push-pop-push-1bb718b13c31

Imagine that you're working on an awesome backend project. It's well defined and well decoupled from the rest of the subsystems in the company. At some point in time however, another team asks you to send them a stream some of the data that your project owns. This request doesn't really fit your project definition, implementation or API, but this data must be shared as per product requirement. So, you add a seemingly random, out of place piece of code that does exactly that, sends a very specific stream of data to some external system. With time your backend project adds more and more such "additional" data streaming pieces of code, bloating the project and making it hard to track and manage. You can’t wait to get rid of it, but don't really know where to move this code... Now imagine, a few days later, your project manager tells you to expect peak load due to a massive marketing campaign starting soon. As a responsible developer you run stress tests and find ...

1.T extField onChanged: Feedback when change. onSubmitted: Feedback when submitted. TextDecoration:hintText and labelText. To nest TextField inside Row, need to nest TextField inside Flexible because TextField doesn't not limited width. The  Row  widget wants to determine the intrinsic size of its non-flexible children so it knows how much space that it has left for the flexible ones. However,  TextField  doesn't have an intrinsic width; it only knows how to size itself to the full width of its parent container. Try wrapping it in a  Flexible  or  Expanded  to tell the  Row  that you're expecting the  TextField  to take up the remaining space: void main(){ runApp( new MaterialApp(home: new FieldWidget()),); } class FieldWidget extends StatefulWidget { @override _FieldWidgetState createState() => _FieldWidgetState(); } class _FieldWidgetState extends State<FieldWidget> { String txtFld = " " ; ...