Nút đầu tiên

Thuộc phần Tạo tính tương tác trong hành trình Flutter của Coddy. Bài học 1 trên 34.

Đến giờ, các ứng dụng của bạn chỉ hiển thị nội dung. Phần này sẽ giúp chúng phản hồi, bắt đầu với một nút.

ElevatedButton(
  onPressed: () {},
  child: Text('Start'),
)

child: là nội dung nút hiển thị, thường là một Text. onPressed: là việc xảy ra khi ai đó nhấn vào nút.

() {} là một hàm (function) không có tên: một đoạn code nhỏ mà nút lưu lại và chạy mỗi khi được nhấn. Code nằm giữa hai dấu ngoặc nhọn. Hàm này trống nên hiện tại nhấn nút sẽ không làm gì, nhưng nút đã sẵn sàng để được nhấn.

Khi dùng onPressed: null, nút sẽ chuyển sang màu xám và không thể nhấn. null có nghĩa là “không có giá trị”: không có code nào để chạy.

Thử thách

Dễ

Ứng dụng hiển thị từ Start. Hãy chuyển nó thành một ElevatedButton có thể nhấn, với Start làm phần tử con. Một hàm rỗng là đủ cho onPressed.

Tự làm thử

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Text('Start'),
        ),
      ),
    );
  }
}