Twój pierwszy przycisk
Część sekcji Dodajemy interaktywność ścieżki Flutter w Coddy. Lekcja 1 z 34.
Do tej pory Twoje aplikacje tylko coś wyświetlały. W tej sekcji sprawisz, że zaczną reagować, zaczynając od przycisku.
ElevatedButton(
onPressed: () {},
child: Text('Start'),
)child: określa, co wyświetla przycisk, zwykle jest to Text. onPressed: określa, co się dzieje, gdy ktoś dotknie przycisku.
() {} to funkcja bez nazwy: mały fragment kodu, który przycisk przechowuje i uruchamia po każdym dotknięciu. Kod umieszcza się między nawiasami klamrowymi. Ta funkcja jest pusta, więc dotknięcie na razie nic nie robi, ale przycisk jest gotowy do naciśnięcia.
Po ustawieniu onPressed: null przycisk jest wyszarzony i nie można go nacisnąć. null oznacza „brak wartości”: brak kodu do uruchomienia.
Wyzwanie
ŁatwyAplikacja wyświetla słowo Start. Zmień je w przycisk ElevatedButton, który można nacisnąć, i ustaw Start jako jego element podrzędny. Wystarczy pusta funkcja dla onPressed.
Spróbuj swoich sił
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'),
),
),
);
}
}
Ta lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.
Wszystkie lekcje w sekcji Dodajemy interaktywność
1Przyciski
Twój pierwszy przyciskWyświetlanie tekstu w konsoliPrzyciski tekstowe i konturowePrzyciski z ikonamiPływający przycisk akcji7Przełączniki i suwaki
Włączanie i wyłączanie przełącznikiemZaznacz pole wyboruWybierz wartość za pomocą suwakaPoćwicz samodzielnie: Kompilator Flutter online