Stateful Widget variable lerine erişip, değiştirme

Abd

Stateful widget’im var container return ediyor. Rengi ve text’i var. Constructor ile bu değişkenleri alıyorum ve widget.renki widget.yazi diye kullanıyorum. Başka bir sayfada bu widgetten bir obje oluşturuyorum ve bu obje üzerinden bu renk ve yaziya ulaşıp değiştirmek istiyorum. Ama stateful’da bu değişkenleri tanımlarken final kullanmamız gerekiyor dolayısıyla değiştiremiyorum. Değişkenleri State class’ının içinde tanımladığımda ise obje. kullanarak bu değişkenlere erişemiyorum, görmüyor.

Bu container return eden stateful widget’i ayrı bir dart dosyası olarak yazmasam ana dart dosyamda direkt yazsam Container(…) şeklinde bu tarz bir sorunla karşılaşmayacağım çünkü bütün değişkenler tek sayfa altında olacak ama bu sefer kodları okuması, düzeltmesi falan çok zor olacak.

Kod kabaca şu şekilde

class ReturnContainer extends StatefulWidget {
  final Color renk;
  final String yazi;
  ReturnContainer (this.renk, this.yazi);
  @override
  _ReturnContainerState createState() => _ReturnContainerState();
}
class _ReturnContainerState extends State<ReturnContainer> {
  @override
  Widget build(BuildContext context) {
 return Container(
 color: widget.renk,
 child: Text('${widget.yazi}'),
 );
 }
 }


class AnaSayfa extends StatefulWidget {
  @override
  _AnaSayfaState createState() => _AnaSayfaState ();
}
class _AnaSayfaState extends State<AnaSayfa > {
var c = ReturnContainer(Colors.red, 'asfdsf'),
  @override
  Widget build(BuildContext context) {
...................

c. diyerek değişkenlere ulaşmak, değiştirmek istiyorum

HseyinAkkaya

Abd İlk defa böyle bir soru geldi ve merak ettim kurcaladım biraz. Bu istediğini getter - setter ile yapabilirsin. Biraz zahmetli ama çalışır hale getirmeyi başardım. Değişik bir yaklaşım flutter için ama ihtiyaç duymuşsunuz ki yapmak istemişsiniz. Bende çalışan kodlar;

class ReturnContainer extends StatefulWidget {
  ReturnContainer(this.color, this.text);
  final Color color;
  final String text;

  static String _text;

  String get yazi => _text ?? text;
  set yazi(String s) {
    _text = s;
  }

  static Color _color;
  Color get renk => _color ?? color;
  set renk(Color c) {
    _color = c;
  }
  @override
  _ReturnContainerState createState() => _ReturnContainerState();
}
class _ReturnContainerState extends State<ReturnContainer> {
  Color rengim;
  String yazi;
  @override
  void initState() {
    rengim = widget.renk ?? widget.color;
    yazi = widget.yazi ?? widget.text;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
  return   Container(
          height: 100,
          child: Text(
            yazi,
            style: TextStyle(
              color: rengim,
              fontSize: 25,
              fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
          ),
          color: Colors.green.shade200,
          alignment: Alignment.center,
        ); 
  }

main.dart dosyasında

import 'package:flutter/material.dart';
import 'package:testler/test.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    var c = ReturnContainer(Colors.purple, "Test");
    c.renk = Colors.black;
    c.yazi = "Flutter";

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: c,
    );
  }
}

bu şekilde kullandım ve sonuç aldım. Ekranda mor renkli “Test” yerine siyah renkli “Flutter” yazısı geldi . Atama yaptığım yerleri (c. ile kullandığım) kaldırınca mor “Test” yazdı.
Umarım işinizi görür. 🙂

yasintuncel

Abd Merhabalar, daha basit yöntem olarak su var;
ReturnContainer i stateless a çevirip kullandiginiz dosyada bir değişkende tutun.

ReturnContainer returnContainer= ReturnContainer(x,y);

değiştirmek istediğinizde ise yeni atama yapın.

returnContainer= ReturnContainer(z,t);

😀

Flutter

HseyinAkkaya İstenilen talep için farklı bir kod öneriniz var mı ?
Bence daha basit bir şekilde de yapılabilir.
Siz @Abd ’nin yazdığı koda göre uyarladınız ama aklımda bir fikir olmamakla beraber daha basit bir yolla yapılabilir bence

HseyinAkkaya

Aslında bu yapı flutter için çok uygun değil. Dart için tamam olabilir ama flutter ve widget kavramlarına biraz aykırı bir kullanım. Çünkü build içinde widgetlarımızı ekrana basıyoruz ve setstate dediğimizde yine sadece build metodu tetikleniyor. Widget içine veri yazmak yerine değişken kullanarak değişiklik yapabiliyoruz. .Net’deki gibi ekrandaki bir nesnenin özelliğini textbox1.text diyerek değiştirdiğimizde ekranda değişikliği göremiyoruz. Çünkü widgetın yeniden build edilmesi gerekiyor. Nerede nasıl kullanacak bilgim yok ama bu şekilde istediği yapılabiliyor ancak. Diğer türlü final değişken değiştirilemiyor. Static değişkene state Classıdan erişemiyoruz. En makulu eski usül get set metotlarını yazmak gibi geldi bana. @Abd bizimle ne amaçla kullanacağını da paylaşırsa belki ufkumuzu aydınlatabilir 😀

Flutter

HseyinAkkaya Çok güzel anlattın 😃

HseyinAkkaya

Teşekkür ederim 😊

Abd

@HseyinAkkaya
Hocam bende diyorum niye ctrl+s yaptığımda değişikliği göremiyorum. 😃
@Flutter

Yapmak istediğim şey şu uygulama.
https://codecanyon.net/item/fives-android-universal-word-game-template/19840229

Üstte 5 tane boş container’im var. Renk ve harf değişkenleri var. Aşağıdaki butonlara basınca yukarıdaki container’in rengini ve yazisini değiştirmek istiyorum. Hatta bu 2 değişkene butonların içinden erişmem gerekiyor aslında ama onu yapamam gibi geldi. Buttonların fonksiyonlarını main dosyasında hazırlayıp buttonların constructorlarına değişken olarak koyup hallederim diye düşündüm. Bunu yaparkende sıkıntılar yaşacağım gibi geliyor. 😃
Gittiğim yol bana da pek doğru gelmiyor ama aklıma başka bir şey gelmedi.

HseyinAkkaya

Flutter bunu noktalı kullanmanızı tavsiye etmem dediğim gibi değişken kullanın. Butonun ontap özelliğinde değişkeni değiştirip setstate yapın. Eğer kendiniz buton oluşturmak istiyorsanız butonun görünümünü farklı class ta yapıp main.dar içünde kullanırken gesturededector ile sarmalayıp ontap özelliği kazandırabilirsiniz. Bu tars fantazilere gerek yok çünkü ilerde bu gösterdiğünizden daha karmaşık işlemler yapacaksınız ve get set ile uğraşmak çok ağır gelecek 🙂

Abd

HseyinAkkaya Hocam tam anlayamadım nasıl kullanacağımı. 🙂
Kodumun düzgün gali şu.

Bu oyunun olduğu ana dosya.

class Oyun extends StatefulWidget {
  @override
  _OyunState createState() => _OyunState();
}

class _OyunState extends State<Oyun> {
  var kare1 = new Kare(Colors.grey, '?');
  var kare2 = new Kare(Colors.grey, '?');
  var kare3 = new Kare(Colors.grey, '?');
  var kare4 = new Kare(Colors.grey, '?');
  var kare5 = new Kare(Colors.grey, '?');

  var buton1 = new Buton(Colors.blue, 'A', fonk);
  var buton2 = new Buton(Colors.blue, 'B', fonk);
  var buton3 = new Buton(Colors.blue, 'C', fonk);
  var buton4 = new Buton(Colors.blue, 'D', fonk);
  var buton5 = new Buton(Colors.blue, 'E', fonk);

  static fonk() {
    print('fonk calisiti');
    //
    // Burada butona tıklandığında butonun rengini ve harfini değiştirecek kod olacak.
    //
    // kare1.renk = buton2.renk;
    // kare1.harf = buton2.deger;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          SizedBox(height: 50.0),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              kare1,
              kare2,
              kare3,
              kare4,
              kare5,
            ],
          ),
          SizedBox(height: 100),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              buton1,
              buton2,
              buton3,
              buton4,
              buton5,
            ],
          ),
        ],
      ),
    );
  }
}

Bu üst taraftaki boş karelerin kodu.


class Kare extends StatefulWidget {
  final Color renk;
  final String harf;
  Kare(this.renk, this.harf);

  @override
  _KareState createState() => _KareState();
}

class _KareState extends State<Kare> {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 50.0,
      width: 50.0,
      color: widget.renk,
      child: Center(
        child: Text(
          '${widget.harf}',
          style: TextStyle(
            color: Colors.white,
            fontSize: 30.0,
          ),
        ),
      ),
    );
  }
}

Bu da butonların.

class Buton extends StatefulWidget {
  final Color renk;
  final String deger;
  final Function fonk;
  Buton(this.renk, this.deger, this.fonk);

  @override
  _ButonState createState() => _ButonState();
}

class _ButonState extends State<Buton> {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      child: Container(
        width: 50.0,
        height: 50.0,
        color: widget.renk,
        child: Center(
          child: Text(
            '${widget.deger}',
            style: TextStyle(
              color: Colors.white,
              fontSize: 30.0,
            ),
          ),
        ),
      ),
      onTap: () => widget.fonk(),
    );
  }
}

Kodu tırnakların içine yazdım neden böyle gözüküyor bilmiyorum bu arada 🙂

Abd

yasintuncel Teşekkür ederim 🙂 işe yaradı