You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/Framework/Flutter/Flutter.md
+15-10Lines changed: 15 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -14,27 +14,30 @@ has_children: false
14
14
You get a widget, you get a widget, everyone gets a widget!
15
15
Flutter is an open-source UI software development kit created by Google. It allows developers to build natively compiled applications for mobile, web, and desktop from a single codebase. Flutter uses the Dart programming language and provides its own widgets, which makes it highly customizable and efficient.
16
16
17
-
### 1) Widget-Based Architecture
17
+
---
18
+
19
+
1.**Widget-Based Architecture**
18
20
19
-
- In Flutter, everything is a widget. This is a core principle of the framework that allows for highly customizable and reusable UI components.
20
-
- Widgets are used to define the structure and appearance of the UI, and Flutter provides a rich set of pre-built widgets that can be used to compose the UI.
21
+
- In Flutter, everything is a widget. This is a core principle of the framework that allows for highly customizable and reusable UI components.
22
+
- Widgets are used to define the structure and appearance of the UI, and Flutter provides a rich set of pre-built widgets that can be used to compose the UI.
21
23
22
-
### 2) State Management
24
+
2.**State Management**
23
25
24
-
- This is a crucial aspect of any Flutter application. There are various strategies for managing state in Flutter, such as Provider, Riverpod, Bloc, etc.
25
-
- State management is a complex topic, and there is no one-size-fits-all solution. The best approach depends on the size and complexity of the application.
26
+
- This is a crucial aspect of any Flutter application. There are various strategies for managing state in Flutter, such as Provider, Riverpod, Bloc, etc.
27
+
- State management is a complex topic, and there is no one-size-fits-all solution. The best approach depends on the size and complexity of the application.
26
28
27
-
### 3) Hot Reload & Hot Restart
29
+
3.**Hot Reload & Hot Restart**
28
30
29
-
- Flutter's hot reload feature allows developers to quickly and easily experiment, build UIs, add features, and fix bugs.
30
-
- Hot reload injects updated source code files into a running Dart Virtual Machine (VM). This allows you to quickly view the effects of your changes without restarting the app.
31
+
- Flutter's hot reload feature allows developers to quickly and easily experiment, build UIs, add features, and fix bugs.
32
+
- Hot reload injects updated source code files into a running Dart Virtual Machine (VM). This allows you to quickly view the effects of your changes without restarting the app.
31
33
32
34
---
33
35
34
36
## Examples
35
37
36
-
Here are some simple example problems that explore making a coffee. Here is some example dart code:
38
+
Here are some simple example problems that explore making a coffee.
37
39
40
+
{: .code title="Example"}
38
41
```dart
39
42
class CoffeeMaker {
40
43
void makeCoffee() {
@@ -68,6 +71,7 @@ class CoffeeMaker {
68
71
69
72
In this example, we have two widgets: `MyApp` and `MyHomePage`. `MyApp` is the root widget of the application and `MyHomePage` is a child widget. Each widget has a build method that describes the part of the user interface the widget represents. Widgets are composed together to build the complete UI. For example, `MyHomePage` uses `Scaffold`, `AppBar`, `Center`, `Column`, `Text`, and `FloatingActionButton` widgets to define its UI. This is a fundamental aspect of Flutter's widget-based architecture: complex UIs are built by composing a number of simpler widgets.
70
73
74
+
{: .code title="Example"}
71
75
```dart
72
76
import 'package:flutter/material.dart';
73
77
@@ -129,6 +133,7 @@ class MyHomePage extends StatelessWidget {
129
133
130
134
In this example, we use the `Provider` package for state management with a `Counter` class that notifies listeners of changes. The `ChangeNotifierProvider` makes an instance of `Counter` available to the widget tree, allowing any widget to listen for changes. The `Consumer` widget then rebuilds the UI whenever the `Counter` changes, demonstrating how Flutter allows widgets to react and rebuild when the state changes.
0 commit comments