Flutter-ში რა ტიპის ვიჯეტები არსებობს?

په Flutter کې، ویجټونه دوه اصلي کټګوریو ته ویشل شوي دي:

• StatelessWidget: ویجټونه چې حالت یې د لومړني جوړولو وروسته نه بدلوي. دوی د UI هغه برخه تشریح کوي چې د وخت په تېرېدو سره د معلوماتو پورې اړه نه لري.
• StatefulWidget: ویجټونه چې حالت یې بدلیدونکی وي. دوی یو تړلی State شی لري، چې بدلیدونکي معلومات لري او د حالت د بدلون پر مهال د ویجټ بیا جوړولو میکانیزم برابروي.

سربېره پر دې، ویجټونه د دوی د هدف له مخې طبقه بندي کیدی شي:

• Layout ویجټونه: د پردې پر مخ د نورو ویجټونو د ځای پر ځای کولو کنټرول کوي (لکه Row, Column, Stack).
• Material Components / Cupertino ویجټونه: چمتو شوي UI عناصر برابروي چې د Material Design (Android) یا Cupertino (iOS) لارښوونو سره سمون لري (لکه AppBar, Button, TextField).
• Input ویجټونه: کارونکي ته اجازه ورکوي چې د اپلیکیشن سره تعامل وکړي (لکه TextField, Checkbox, Slider).
• Interactive ویجټونه: د کارونکي د حرکتونو پر ځواب ورکوي (لکه GestureDetector, InkWell).
• Painting & Effects ویجټونه: ګرافیکي اغېزې پلي کوي (لکه Opacity, ClipRRect).
• Scrolling ویجټونه: د محتوا سکرول تضمینوي (لکه ListView, GridView).

د جوړولو له لارې، ویجټونه کولی شي:

• ابتدایي: بنسټیز بلاکونه (لکه Container, Text, Icon).
• ترکیبي: د نورو ویجټونو څخه جوړ شوي وي.

// د StatefulWidget مثال
class CounterWidget extends StatefulWidget {
  @override
  _CounterWidgetState createState() => _CounterWidgetState();
}

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

  void _incrementCounter() {
    setState(() {
      // حالت بدلوي او بیا رسموي
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Text('شمارنده:'),
        Text(
          '$_counter',
          style: Theme.of(context).textTheme.headline4,
        ),
        FloatingActionButton(
          onPressed: _incrementCounter,
          tooltip: 'زیاتول',
          child: Icon(Icons.add),
        ),
      ],
    );
  }
}

// د StatelessWidget مثال
class TitleWidget extends StatelessWidget {
  final String title;

  TitleWidget({required this.title});

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