Hiểu về Widgets trong Flutter

Trong Flutter, Widgets là các thành phần cơ bản để xây dựng giao diện người dùng của ứng dụng. Mỗi khung nhìn (view) trong Flutter đều là một Widget. Có hai loại chính của Widgets trong Flutter:

Stateless Widgets

Stateless Widgets là những Widgets không có trạng thái và không thay đổi sau khi được tạo. Khi trạng thái của ứng dụng thay đổi, Stateless Widgets sẽ được vẽ lại với các giá trị mới nhưng không lưu trữ trạng thái.

Stateful Widgets

Stateful Widgets là những Widgets có trạng thái và có thể thay đổi trong quá trình chạy. Khi trạng thái thay đổi, Stateful Widgets sẽ tự động vẽ lại để hiển thị các thay đổi mới.

Flutter cung cấp một số Widgets có sẵn như Text, Image, RaisedButton, Container và nhiều Widgets khác để xây dựng giao diện người dùng. Bên cạnh đó, bạn có thể tự tạo các Widgets tùy chỉnh phù hợp với yêu cầu cụ thể của ứng dụng.

Cách sử dụng Widgets trong Flutter

Để sử dụng Widgets trong Flutter, bạn chỉ cần tạo các Widgets và xếp chúng vào cấu trúc cây Widget của ứng dụng. Flutter sử dụng mô hình cây Widget để xây dựng giao diện người dùng. Mỗi Widget có thể chứa các Widgets con, tạo thành một cấu trúc cây.

Ví dụ, để tạo một ứng dụng đơn giản với một nút nhấn và một văn bản, bạn có thể sử dụng Widgets như sau:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Widgets'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              RaisedButton(
                onPressed: () {
                  // Xử lý khi nút được nhấn
                },
                child: Text('Nhấn vào đây'),
              ),
              Text('Chào mừng đến với Flutter Widgets'),
            ],
          ),
        ),
      ),
    );
  }
}

Trong ví dụ trên, chúng ta sử dụng MaterialApp, Scaffold, Column, RaisedButton, Text Widgets để xây dựng giao diện đơn giản. Bạn có thể thay đổi các Widgets và cấu trúc cây Widget để tạo ra các giao diện phức tạp hơn cho ứng dụng của mình.

 

Kết Luận

Widgets là cơ sở của giao diện người dùng trong Flutter. Sử dụng các Widgets có sẵn và tự tạo Widgets tùy chỉnh, bạn có thể xây dựng các ứng dụng đa dạng và hấp dẫn trong Flutter.