State, Widget, StateFulWidget, StateLessWidget, Vòng đời của ứng dụng
- Widget là gì ?
- Các màn hình trong ứng dụng Flutter được tạo bởi các Widget lắp ghép lại với nhau.
- Widget là các “configuration object” dùng để tạo lên ứng dụng Flutter. Như vậy, Tạo ứng dụng Flutter là tạo các Widget và liên kết chúng lại với nhau.
2. State là gì?
- Trong Flutter, State là thông tin về một thứ gì đó được lưu trong bộ nhớ.
- State được dùng theo 2 cách đó là StatelessWidget, StatefulWidget.
- StatelessWidget: là một Widget có sẵn trong Flutter SDK, chỉ nhận dữ liệu và hiển thị dữ liệu thụ động không liên quan đến state.
Stateless trong Tiếng Anh nghĩa là : không State hay không trạng thái. Vậy StatelessWidget có nghĩa là Widget không State hay Widget không trạng thái.
- StatefulWidget: Trái với StatelessWidget thì StatefulWidget là Widget có trạng thái, cũng là Widget có sẵn trong Flutter SDK.
Stateful có nghĩa là có State hay có trạng thái. Vậy StatefulWidget có nghĩa là Widget có State hay Widget có trạng thái.
3. Vòng đời ứng dụng
- Vòng đời ứng dụng chỉ dùng StatelessWidget
- Vì chỉ sử dụng StatelessWidget, Màn hình ứng dụng chỉ đơn thuần là nhận và hiển thị dữ liệu, không liên quan đến State nên không có vòng đời.
- Việc ghi đè (@ override ) phương thức build là dùng để render Graphic UI( user interface), hiển thị lên màn hình cho người dùng.
- Vòng đời sử dụng StatefulWidget
- Xây dựng màn hình ứng dụng dùng StatefulWidget tức là liên quan đến việc quản lý State. Vì vậy nó cần chu trình quản lý trạng thái.
- Trong một vòng đời có 7 trạng thái đó là : createState, initState, didChangeDependences, build, didUpdateWidget, deactive, dispose.
- Chi tiết về 7 trạng thái:
+ createState: Khi tạo class kế thừa đến StatefulWidget, hàm khởi tạo sẽ được yêu cầu gọi đầu tiên, bằng cách ghi đè phương thức createState.
+ initState(): Hàm này được gọi ngay khi widget được tạo
+ didChangeDependencies(): Hàm được gọi ngay sau hàm initState() và được gọi lại khi dependency của State thay đổi.
+ build(): Hàm này được gọi sau didChangeDependencies(). Tất cả graphic UI (User Interface) sẽ được render trong hàm này.
+ didUpdateWidget: Hàm này được gọi khi Widget configuration thay đổi. Sau khi hàm này được gọi thì hàm build sẽ được gọi, như vậy hàm setState được sử dụng trong hàm didUpdateWidget sẽ bị bỏ qua.
+ deactivate(): Hàm này được gọi khi State bị gỡ khỏi cây widget nhưng nó có thể xác nhận lại trước khi quá trình xoá kết thúc.
+ dispose(): Hàm này được gọi khi State bị gỡ ngay lập tức khỏi cây widget và khi đó State không bao giờ được build trở lại.
Những kết luận quan trọng các bạn nên nhớ:
+ Các màn hình ứng dụng Flutter được tạo bởi các Widget
+ Hàm setState trong class kế thừa StatefulWidget , giúp set lại State và build lại màn hình mỗi khi được gọi đến.
+ StatelessWidget – class kế thừa Widget này, chỉ nhận và hiển thị dữ liệu đơn thuần không liên quan đến state và không có vòng đời.
+ StatefulWidget – class kế thừa Widget này để tạo màn hình ứng dụng có vòng đời gồm 7 trạng thái là : createState, initState, didChangeDependencies, build, didUpdateWidget, deactivate, dispose.