5. Flutter Tutorial for Beginners – Understanding Stateless Widgets and Stateful Widgets

0
733

In Flutter, there are mainly two types of widgets:

  1. StatelessWidget
  2. StatefulWidget

 

 1. StatefulWidget

Stateful widgets are useful when the part of the user interface you are describing can change dynamically. It contains mainly two classes: the state object and the widget. It is dynamic because it can change the inner data during the widget lifetime. It has createState() method, which returns a class that extends the Flutters State Class. Checkbox, Radio, Slider, InkWell, Form, and TextField are the example of StatefulWidget.

Example:

class Car extends StatefulWidget {  
  const Car({ Key key, this.title }) : super(key: key);   
  
  @override  
  _CarState createState() => _CarState();  
}  
  
class _CarState extends State {  
  @override  
  Widget build(BuildContext context) {  
    return Container(  
      color: const Color(0xFEEFE),  
           child: Container(  
            child: Container( //child: Container() )  
        )  
    );  
  }  
}

 2. StatelessWidget

The StatelessWidget does not have any state information. It remains static throughout its lifecycle. Like static HTML pages. Text, Row, Column, Container are the example of StatelessWidget.

Example:

class MyStatelessCarWidget extends StatelessWidget {  
  const MyStatelessCarWidget ({ Key key }) : super(key: key);  
  
  @override  
  Widget build(BuildContext context) {  
    return Container(color: const Color(0x0xFEEFE));  
  }  
}  

LEAVE A REPLY

Please enter your comment!
Please enter your name here