MOBILE COMPUTING QUESTION ANSWER

14. What is a Stateful Widget? Explain with appropriate illustrations.

A Stateful Widget is a widget that can change its state over time, triggering a rebuild of
the widget when the state changes. These widgets are dynamic and are often used
when the content of the widget needs to change, such as user interaction (e.g., button
press, text input, etc.).

Stateful widgets consist of two classes:

1. The StatefulWidget class, which is immutable and holds the configuration.
2. The State class, which is mutable and contains the actual state of the widget.
Example:
import 'package:flutter/material.dart';
class MyStatefulWidget extends StatefulWidget {
@override
_MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget> {
int _counter = 0;

void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Stateful Widget Example'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('Counter: $_counter'),
ElevatedButton(
onPressed: _incrementCounter,
child: Text('Increment'),
),
Page1of5
 MOBILE COMPUTING QUESTION ANSWER

],
),
),
);
}
}
void main() => runApp(MaterialApp(home: MyStatefulWidget()));
Here, the counter value changes when the button is pressed, and the widget rebuilds
each time.

15. What is the Purpose of Container? Explain with appropriate illustrations.

The Container widget is a box model that allows you to customize the layout and
styling of child widgets. It can be used for tasks like setting padding, margin, alignment,
decoration (background color, border), and more. It's one of the most versatile widgets
in Flutter.

Example:

import 'package:flutter/material.dart';

class ContainerExample extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
padding: EdgeInsets.all(20),
margin: EdgeInsets.all(30),
color: Colors.blue,
child: Text(
'Hello, Container!',
style: TextStyle(color: Colors.white),
),
),
),
);
}
}
Page2of5
 MOBILE COMPUTING QUESTION ANSWER

void main() => runApp(MaterialApp(home: ContainerExample()));

In this example, the Container widget adds padding, margin, a background color, and
displays a text widget within it.

16. What is a Const Constructor? What is the Purpose of Using It in Flutter?

A const constructor is a special constructor in Dart that allows you to create compile-
time constants. By using const, the widget or object is created only once and remains
unchanged throughout the app's lifetime, which can lead to performance
improvements, especially for widgets that don't change.
When using const, Flutter ensures that the object is reused and not recreated, saving
memory and computational resources.

Example:
import 'package:flutter/material.dart';
class ConstExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const Text(
'This is a const Text widget!',
style: TextStyle(fontSize: 20, color: Colors.blue),
);
}
}
void main() => runApp(MaterialApp(home: ConstExample()));
In the above example, the Text widget is created using a const constructor, meaning it
is instantiated only once.
17. Explain the Flutter Architecture with Appropriate Illustrations.
Flutter's architecture is designed to be efficient and highly performant. The
architecture can be broken down into the following layers:
1. Flutter Engine: The core of Flutter, written in C++, is responsible for rendering
the UI, handling input events, and managing the platform-specific code. It
provides low-level services such as rendering, text layout, and plugins.
Page3of5
 MOBILE COMPUTING QUESTION ANSWER

2. Framework: This layer is written in Dart and includes the Material Design and
Cupertino libraries. It provides high-level APIs to build the app's UI, manage
state, and handle app logic.
3. Dart Platform: Dart provides the programming language that Flutter uses. Dart
compiles to native ARM or x86 code for mobile, desktop, and web platforms,
ensuring performance and portability.
4. Widgets: This layer is the highest abstraction level. Flutter uses a reactive
framework where widgets are described declaratively. The app's UI is created by
composing these widgets.
Illustration:
+--------------------+
| Flutter App |
| (Widgets + Dart) |
+--------------------+
|
+--------------------+
| Flutter Engine |
| (Rendering + Input)|
+--------------------+
|
+--------------------+
| Platform Code |
| (Android/iOS) |
+--------------------+
18. What is Stateless Widget Lifecycle? Explain with Appropriate Illustrations.
The lifecycle of a Stateless Widget is simpler compared to a Stateful Widget because it
doesn't involve any state changes. It only involves the creation and rendering process.
1. Constructor: When a StatelessWidget is created, its constructor is called.
2. Build Method: The build() method is called to render the UI. This is where the
widget's visual representation is created.
3. Dispose: Stateless widgets don't have a dispose() method because they don't
manage resources.
Illustration:
1. Constructor → 2. Build → 3. (No dispose)

19. What is Stateful Widget Lifecycle? Explain with Appropriate Illustrations.

A Stateful Widget has a more complex lifecycle due to its ability to change states. It involves the
following steps:
1. Constructor: When the StatefulWidget is created, its constructor is called.
Page4of5
 MOBILE COMPUTING QUESTION ANSWER

2. createState(): This method creates an instance of the State class, where the mutable state is
stored.
3. initState(): The initState() method is called once, after the widget's state has been created. It is
used for initializing data.
4. build(): The build() method is called every time the state changes and needs to be redrawn.
5. setState(): When the state changes, setState() is called to trigger a rebuild of the widget.
6. dispose(): When the widget is removed from the tree, the dispose() method is called to clean
up resources (like controllers or animations).
Illustration:
1. Constructor → 2. createState() → 3. initState() → 4. build() → 5. setState() → 6. dispose

Page5of5