Flutter: Widgets

Widgets er byggestenene i Flutter-applikationer. I Flutter er alt en widget, lige fra knapper og tekstfelter til hele skærme og layouts. Widgets er ansvarlige for at definere brugergrænsefladen og reagere på brugerinteraktioner.

Der er to typer af widgets i Flutter:

1. Stateless widgets: Stateless widgets er uforanderlige og har ikke intern tilstand. De repræsenterer statiske dele af brugergrænsefladen, der ikke ændrer sig over tid. Stateless widgets bygges ved hjælp af StatelessWidget-klassen og implementerer build-metoden, der returnerer widgetens visuelle repræsentation baseret på inputparametre.

Her er et eksempel på en stateless widget, der viser en simpel tekst:

import 'package:flutter/material.dart';

class MyTextWidget extends StatelessWidget {
  final String text;

  MyTextWidget(this.text);

  @override
  Widget build(BuildContext context) {
    return Text(text);
  }
}

1. Stateful widgets: Stateful widgets har en intern tilstand, der kan ændre sig over tid. De bruges til at repræsentere dele af brugergrænsefladen, der kan opdatere sig selv eller reagere på ændringer i applikationens tilstand. Stateful widgets bygges ved hjælp af StatefulWidget-klassen, der har en tilknyttet State-klasse.

Her er et eksempel på en stateful widget, der viser en tæller:

import 'package:flutter/material.dart';

class MyCounterWidget extends StatefulWidget {
  @override
  _MyCounterWidgetState createState() => _MyCounterWidgetState();
}

class _MyCounterWidgetState extends State<MyCounterWidget> {
  int counter = 0;

  void incrementCounter() {
    setState(() {
      counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('Counter: $counter'),
        ElevatedButton(
          onPressed: incrementCounter,
          child: Text('Increment'),
        ),
      ],
    );
  }
}

I dette eksempel bruger vi StatefulWidget-klassen til at oprette en stateful widget, der holder styr på en tæller. Vi bruger setState-metoden til at opdatere tilstanden og genopbygge widgeten, når tælleren ændres.

Widgets er grundlæggende byggestenene i Flutter og gør det muligt at opbygge en dynamisk og interaktiv brugergrænseflade. Du kan kombinere forskellige widgets for at opnå den ønskede brugeroplevelse og funktionalitet i dine Flutter-applikationer.