Menu
CoddyTech

Ваша первая кнопка

Часть раздела Добавляем интерактивность путешествия по Flutter на Coddy. Урок 1 из 34.

До сих пор ваши приложения только показывали информацию. В этом разделе мы научим их реагировать, начав с кнопки.

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

child: — это то, что отображает кнопка, обычно Text. onPressed: — это то, что происходит, когда кто-то нажимает на кнопку.

() {} — это функция без имени: небольшой фрагмент кода, который кнопка сохраняет и выполняет при каждом нажатии. Код помещается между фигурными скобками. Здесь он пустой, поэтому нажатие пока ничего не делает, но кнопку уже можно нажать.

При onPressed: null кнопка становится серой, и на неё нельзя нажать. null означает «нет значения»: нет кода для выполнения.

challenge icon

Задание

Легко

Преврати слово Start, которое отображается в приложении, в кнопку ElevatedButton, на которую можно нажать, и помести в неё Start как дочерний элемент. Для onPressed достаточно пустой функции.

Попробуйте сами

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'),
        ),
      ),
    );
  }
}
quiz iconПроверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Все уроки раздела Добавляем интерактивность

Потренируйтесь самостоятельно: Онлайн-компилятор Flutter