Sobes.tech
Junior

Kokie yra „Flutter“ widgetų tipai?

sobes.tech AI

Atsakymas iš AI

Flutter'e widgetai suskirstyti į dvi pagrindines kategorijas:

  • StatelessWidget: Widgetai, kurių būsenos po pirminės kūrimo nepasikeičia. Jie aprašo UI dalį, kuri nepriklauso nuo realiu laiku gaunamų duomenų.
  • StatefulWidget: Widgetai su kintama būsena. Jie turi susietą State objektą, kuris saugo kintamus duomenis ir užtikrina mechanizmą, leidžiantį perstatyti widgetą, kai būsenos duomenys pasikeičia.

Be to, widgetai gali būti klasifikuojami pagal jų paskirtį:

  • Layout widgetai: Valdo kitų widgetų išdėstymą ekrane (pvz., Row, Column, Stack).
  • Material Components / Cupertino widgetai: Teikia paruoštus UI elementus, atitinkančius Material Design (Android) arba Cupertino (iOS) gaires (pvz., AppBar, Button, TextField).
  • Input widgetai: Leidžia vartotojui sąveikauti su programa (pvz., TextField, Checkbox, Slider).
  • Interactive widgetai: Reaguoja į vartotojo gestus (pvz., GestureDetector, InkWell).
  • Painting & Effects widgetai: Taiko grafinius efektus (pvz., Opacity, ClipRRect).
  • Scrolling widgetai: Užtikrina turinio slinkimą (pvz., ListView, GridView).

Pagal kūrimo būdą, widgetai gali būti:

  • Primityvūs: Pagrindiniai statybiniai blokai (pvz., Container, Text, Icon).
  • Kombinuoti: Sudaryti iš kitų widgetų.
// Pavyzdys su StatefulWidget
class CounterWidget extends StatefulWidget {
  @override
  _CounterWidgetState createState() => _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      // Keičia būseną ir inicijuoja perpiešimą
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Text('Skaitiklis:'),
        Text(
          '$_counter',
          style: Theme.of(context).textTheme.headline4,
        ),
        FloatingActionButton(
          onPressed: _incrementCounter,
          tooltip: 'Padidinti',
          child: Icon(Icons.add),
        ),
      ],
    );
  }
}
// Pavyzdys su StatelessWidget
class TitleWidget extends StatelessWidget {
  final String title;

  TitleWidget({required this.title});

  @override
  Widget build(BuildContext context) {
    return Text(
      title,
      style: TextStyle(fontSize: 24),
    );
  }
}