1. Stateless Widget:
A StatelessWidget is a widget that does not maintain any state internally. Once created, its properties remain immutable throughout the widget’s lifetime. This means that the appearance and behavior of a StatelessWidget cannot change after it is built. StatelessWidget instances are typically used to represent static UI elements that do not require updates based on user interaction or external data changes.

Characteristics of StatelessWidget:

• Immutable Properties: The properties of a StatelessWidget are set once during initialization and cannot be modified thereafter.
• No Internal State: StatelessWidget does not contain any internal state variables or data that can change over time.
• Build Method: StatelessWidget overrides the build() method, which returns a Widget representing the UI subtree for this widget.
• Efficient Rendering: Since StatelessWidget does not have to manage any state, Flutter can optimize rendering performance by caching and reusing instances of the widget.

Example of StatelessWidget:

import 'package:flutter/material.dart';

class MyButton extends StatelessWidget {
final String text;
final VoidCallback onPressed;

MyButton({required this.text, required this.onPressed});

@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: onPressed,
child: Text(text),
);
}
}

2. Stateful Widget:
A StatefulWidget is a widget that can maintain state internally. Unlike StatelessWidget, StatefulWidget instances can be updated over time in response to user interactions, animations, or changes in external data sources. StatefulWidget consists of two classes: one for the widget itself and another for its associated State object. The State object holds the mutable state data and manages updates to the widget’s appearance.

Characteristics of StatefulWidget:

• Mutable State: StatefulWidget contains an associated State object that can hold mutable state data. Changes to this state trigger updates to the widget’s UI.
• Stateful Widget Class: StatefulWidget is typically accompanied by a State class, which manages the widget’s state and implements the logic for handling updates.
• setState Method: To update the widget’s state, StatefulWidget uses the setState() method, which triggers a rebuild of the widget’s UI subtree.
• Dynamic UI: StatefulWidget is suitable for building interactive UI elements that require updates based on user input, data changes, or animations.

Example of StatefulWidget:

import 'package:flutter/material.dart';

class CounterWidget extends StatefulWidget {
@override
_CounterWidgetState createState() => _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {
int _counter = 0;

void _incrementCounter() {
setState(() {
_counter++;
});
}

@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
‘Counter Value:’,
),
Text(
‘$_counter’,
style: Theme.of(context).textTheme.headline4,
),
ElevatedButton(
onPressed: _incrementCounter,
child: Text(‘Increment’),
),
],
);
}
}