Fejlfindingsværktøjer og -teknikker
Bliv fortrolig med Flutter's fejlfindingsværktøjer, herunder DevTools, breakpoints og logning, så De effektivt kan identificere og løse problemer.
Fejlfindingsværktøjer og -teknikker er en gratis Mobiludvikling med Flutter-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i Mobiludvikling med Flutter, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Mobiludvikling med Flutter-kurset indeholder 4 lektioner i alt.
Hvad er fejlfinding?
Fejlfinding er processen med at finde og rette fejl, også kaldet bugs, i din kode. Det er en vigtig færdighed for alle udviklere.
En app, der er grundigt fejlsøgt, er stabil, fungerer som forventet og giver en god brugeroplevelse.
Mød Flutter DevTools
Flutter DevTools er en effektiv samling værktøjer til fejlfinding og profilering af Flutter-applikationer. Den hjælper dig med at forstå din apps brugergrænseflade, ydeevne og hukommelsesforbrug.
Tænk på det som din Flutter-apps diagnostikcenter!
Åbn DevTools
Du kan starte DevTools direkte fra dit IDE (for eksempel VS Code eller Android Studio), når din Flutter-app kører. Se efter en knap med teksten 'Dart DevTools' eller 'Open DevTools'.
Alternativt kan du køre flutter pub global activate devtools og derefter flutter pub global run devtools fra din terminal.
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('DevTools Demo')),
body: Center(
child: Text('Hello, Debugger!'),
),
),
);
}
}Fejlfinding af brugergrænsefladen med Inspector
Widget Inspector i DevTools giver dig mulighed for at visualisere din apps brugergrænsefladetræ. Du kan vælge en hvilken som helst widget på skærmen og se dens egenskaber, layoutbegrænsninger og oplysninger om dens renderingsboks.
Det hjælper dig med at forstå, hvorfor widgets er placeret eller dimensioneret på en bestemt måde.
Ydeevne og diagnostik
Ud over Inspector tilbyder DevTools faner til analyse af Performance, Memory og Network. De hjælper med at identificere flaskehalse, hukommelseslækager og problemer med netværksanmodninger.
Under fanen Debugger administrerer du breakpoints og gennemgår din Dart-kode trin for trin.
Breakpoints: Sæt kørsel på pause
Et breakpoint er en særlig markør, som du angiver i din kode. Når programmet kører og når et breakpoint, sættes kørslen på pause præcis på den pågældende linje.
Det giver dig mulighed for at undersøge variabelværdier og kaldstakken samt forstå programmets tilstand på et bestemt tidspunkt.
Angiv et breakpoint
I de fleste IDE'er kan du angive et breakpoint ved at klikke i margen (området til venstre for linjenumrene) ud for den kodelinje, hvor du vil sætte kørslen på pause.
Prøv at angive et i _incrementCounter-metoden nedenfor, og tryk derefter på knappen.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++; // Set a breakpoint here!
});
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Breakpoints')),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('Counter: $_counter'),
ElevatedButton(
onPressed: _incrementCounter,
child: Text('Increment'),
),
],
),
),
),
);
}
}Naviger i kodekørslen
Når kørslen er sat på pause ved et breakpoint, har du flere muligheder:
- Træd over: Kør den aktuelle linje, og gå videre til den næste.
- Træd ind: Hvis den aktuelle linje er et funktionskald, så gå ind i funktionen.
- Træd ud: Forlad den aktuelle funktion, og vend tilbage til det sted, hvor den blev kaldt.
- Fortsæt: Genoptag normal kørsel indtil næste breakpoint eller programmets afslutning.
Enkel logning med `print`
Til hurtige kontroller kan du bruge print() til at skrive meddelelser til konsollen. Flutter indeholder dog debugPrint(), som er bedre egnet til produktionsapps.
debugPrint() forhindrer, at output går tabt, når der er for mange data, især på Android.
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart'; // For debugPrint
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
void _logMessage() {
print('This is a regular print message.');
debugPrint('This is a debugPrint message, better for Flutter!');
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Logging Demo')),
body: Center(
child: ElevatedButton(
onPressed: _logMessage,
child: Text('Log it!'),
),
),
),
);
}
}Videnstjek om fejlfinding
Du har lært om vigtige værktøjer og teknikker til fejlfinding i Flutter. Lad os teste din forståelse!
Opsummering af lektionen
Godt klaret! I denne lektion har du opnået en grundlæggende forståelse af fejlfinding i Flutter.
- Vi udforskede Flutter DevTools, din samlede værktøjssamling til fejlfinding.
- Du lærte at bruge breakpoints til at sætte kørslen på pause og undersøge appens tilstand.
- Vi gennemgik også enkel logning med
print()ogdebugPrint().
Disse færdigheder er afgørende for at bygge robuste Flutter-applikationer uden fejl!
Lær Dart med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 22
- Lektioner
- 88
Ofte stillede spørgsmål
Er lektionen “Fejlfindingsværktøjer og -teknikker” gratis?
Ja — alle 3 lektioner i læringssporet Mobiludvikling med Flutter, inklusive “Fejlfindingsværktøjer og -teknikker”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Mobiludvikling med Flutter-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Fejlfindingsværktøjer og -teknikker”?
Bliv fortrolig med Flutter's fejlfindingsværktøjer, herunder DevTools, breakpoints og logning, så De effektivt kan identificere og løse problemer. Du øver dig i Mobiludvikling med Flutter med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Mobiludvikling med Flutter?
Der kræves ingen tidligere erfaring. Mobiludvikling med Flutter på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 3 af 4.
Hvor lang tid tager lektionen “Fejlfindingsværktøjer og -teknikker”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Mobiludvikling med Flutter-lektion?
Ja. Alle Mobiludvikling med Flutter-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Principper for widget-test
- Integrationstest
- Fejlfindingsværktøjer og -teknikker
- Unit testing og mocking