Sobes.tech
Junior

Flutter'da hangi tür widget'lar vardır?

sobes.tech yapay zeka

AI'dan gelen yanıt

Flutter'da widgetler iki ana kategoriye ayrılır:

  • StatelessWidget: Durumu ilk oluşturulduktan sonra değişmeyen widgetler. Kullanıcı arayışının bir bölümünü tanımlarlar ve çalışma zamanında herhangi bir veriyle ilgisi yoktur.
  • StatefulWidget: Değişken duruma sahip widgetler. Bağlı State nesnesi vardır, bu nesne değişken verileri içerir ve durum değiştiğinde widget'ın yeniden çizilmesini sağlar.

Ayrıca, widgetler amaçlarına göre sınıflandırılabilir:

  • Düzen widgetleri: Ekrandaki diğer widgetlerin konumunu kontrol ederler (örneğin, Row, Column, Stack).
  • Material Bileşenleri / Cupertino widgetleri: Material Design (Android) veya Cupertino (iOS) yönergelerine uygun hazır UI öğeleri sağlarlar (örneğin, AppBar, Button, TextField).
  • Girdi widgetleri: Kullanıcının uygulama ile etkileşime girmesine izin verirler (örneğin, TextField, Checkbox, Slider).
  • Etkileşimli widgetler: Kullanıcı hareketlerine tepki verirler (örneğin, GestureDetector, InkWell).
  • Çizim ve Efekt widgetleri: Grafik efektleri uygularlar (örneğin, Opacity, ClipRRect).
  • Kaydırma widgetleri: İçeriğin kaydırılmasını sağlarlar (örneğin, ListView, GridView).

Oluşturma şekline göre, widgetler şunlar olabilir:

  • Primitifler: Temel yapı taşları (örneğin, Container, Text, Icon).
  • Bileşikler: Diğer widgetlerden oluşur.
// StatefulWidget örneği
class CounterWidget extends StatefulWidget {
  @override
  _CounterWidgetState createState() => _CounterWidgetState();
}

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

  void _incrementCounter() {
    setState(() {
      // Durumu değiştir ve yeniden çiz
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Text('Sayaç:'),
        Text(
          '$_counter',
          style: Theme.of(context).textTheme.headline4,
        ),
        FloatingActionButton(
          onPressed: _incrementCounter,
          tooltip: 'Artır',
          child: Icon(Icons.add),
        ),
      ],
    );
  }
}
// StatelessWidget örneği
class TitleWidget extends StatelessWidget {
  final String title;

  TitleWidget({required this.title});

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