Andrey Aleev

As Flutter is declarative user interface is being build as some function from state

UI = f(state)

In other words, UI observes State.
As Android Java and Kotlin developer I got used to write everything imperative. For example

textView.setText("Lorem")

or in Kotlin

 textView.text="Lorem"

In Flutter, on other hand, if you want to change UI, you need first to change the State.

A State can be defined as “whatever data you need in order to rebuild your UI at any moment in time”

Stateful and stateless widgets

In short Stateful are like var and stateless are like val variables in Koltin.
You cannot change A stateless widget. Use it when you need to show UI element once and never wont change it state. For example, text labels, icons, images etc.

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Stateless Widget',
        home: Scaffold(
          appBar: AppBar(
            title: Text('Appbar title'),
          ),
        body: Center(
          child: Text('static content'),
        ),
      ),
    );
  }
}

A Stateful widget can be changed in runtime. It may be input TextField, Slider, Checkbox etc.
A widget’s state is stored in a State object. When the widget’s state changes, the state object calls setState(), telling the framework to redraw the widget.

To declare StatefulWidget you need to extend StatefulWidget and create State for it

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  int _count = 42;
  // ···
}

Ephemeral state and App state

First, Application state. It used when you need to share data between screens, widgets or even sessions. In this kind of data you may want to store business logic data, for example, user preferences, downloaded lists, shopping cart etc.

Ephemeral state is a widget state. Examples: current page in PageView, current progress, current selected radioButton in radioGroup