TextEditingController dizini kullanarak liste oluşturma

hsynakcn00x

Merhaba arkadaşlar. Yazmaya çalıştığım bir kod var da internetten falan da araştırdım ama istediğim gibi bir şey bulamadım. Bir de siz bakar mısınız?
Yapmak istediğim TextField’ a girdiğim değerleri ekledikçe Listview’ de Text olarak alt alta eklemesi. İnternette controller ı dizi olarak almıştı ama nasıl dispose edileceğini bulamadım clear yazmayı denedim. Sizce kod nasıl değişmeli?

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart';

void main() {
  runApp(
    MaterialApp(
      home: HomePage(),
    ),
  );
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<TextEditingController> textcontroller = new List();
  List<String>str=<String>[];
  @override
  void dispose() {
    textcontroller.clear();
    super.dispose();
  }
  int index=0;
  addvalue() {
    setState(() {
      str.add(textcontroller[index].text);
      index++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("sdsdfds"),
        centerTitle: true,
        backgroundColor: Colors.grey[700],
      ),
      body: Container(
        padding: EdgeInsets.all(20.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            Container(
              child: TextField(
                controller: textcontroller[],
                decoration: InputDecoration(
                  hintText: "Input value",
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(20.0),
                  ),
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.all(10.0),
              child: RaisedButton(
                color: Colors.lightBlueAccent,
                shape: RoundedRectangleBorder(
                  borderRadius: new BorderRadius.circular(20.0),
                  side: BorderSide(color: Colors.black),
                ),
                child: Container(
                  padding: EdgeInsets.all(8.0),
                  child: Text(
                    "Add Value",
                    style: TextStyle(
                      fontSize: 30.0,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                onPressed: () {
                  addvalue();
                },
              ),
            ),
            ListView.builder(
              itemCount:str.length,
              itemBuilder: (context,item){
                return Text(
                  "${str}"
                );
              },
            ),
          ],
        ),
      ),
    );
  }
}

HseyinAkkaya

hsynakcn00x
List<TextEditingController> textcontroller = new List();
bu kısmı
TextEditingController textcontroller = TextEditingController() ;
olarak değiştirin.
widgetlarınızı aşağıdaki gibi güncelleyin çalışacaktır. Deneme fırsatım olmadı sorun yaşarsanız buradan paylaşabilirsiniz.

           TextField(
              controller: textcontroller,
              decoration: InputDecoration(
                hintText: "Input value",
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(20.0),
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.all(10.0),
              child: RaisedButton(
                color: Colors.lightBlueAccent,
                shape: RoundedRectangleBorder(
                  borderRadius: new BorderRadius.circular(20.0),
                  side: BorderSide(color: Colors.black),
                ),
                child: Container(
                  padding: EdgeInsets.all(8.0),
                  child: Text(
                    "Add Value",
                    style: TextStyle(
                      fontSize: 30.0,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                onPressed: () {
                  str.add(textcontroller.text);
                  textcontroller.clear();
                  setState(() { });
                },
              ),
            ),
             ListView.builder(
              itemCount:str.length,
              itemBuilder: (context,index){
                return Text(
                  str[index]
                );
              },
            ),

hsynakcn00x

HseyinAkkaya Demin aynı işi yapmasını istediğim başka bir kod yazmıştım. Orda da yukarıdaki kodda da aynı hatayı aldım. Yukarıdaki kodun son hali ve aldığım hata,
import ‘package:flutter/cupertino.dart’;
import ‘package:flutter/material.dart’;

void main() {
runApp(
MaterialApp(
home: HomePage(),
),
);
}

class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
TextEditingController textcontroller =TextEditingController();
List<String>str=<String>[];
@override
void dispose() {
textcontroller.clear();
super.dispose();
}
addvalue() {
setState(() {
str.add(textcontroller.text);
});
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(“sdsdfds”),
centerTitle: true,
backgroundColor: Colors.grey[700],
),
body: Container(
padding: EdgeInsets.all(20.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
child: TextField(
controller: textcontroller,
decoration: InputDecoration(
hintText: “Input value”,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(20.0),
),
),
),
),
Container(
margin: EdgeInsets.all(10.0),
child: RaisedButton(
color: Colors.lightBlueAccent,
shape: RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(20.0),
side: BorderSide(color: Colors.black),
),
child: Container(
padding: EdgeInsets.all(8.0),
child: Text(
“Add Value”,
style: TextStyle(
fontSize: 30.0,
fontWeight: FontWeight.bold,
),
),
),
onPressed: () {
str.add(textcontroller.text);
textcontroller.clear();
setState(() { });
},
),
),
ListView.builder(
itemCount:str.length,
itemBuilder: (context,item){
return Text(
“${str}”//veya str[item] ikisi de aynı hatayı veriyor.
);
},
),
],
),
),
);
}
}
____________________________________Aldığım Hata
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
Vertical viewport was given unbounded height.
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderViewport#aeabf NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderViewport#aeabf NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderIgnorePointer#15e01 relayoutBoundary=up11 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#ff335 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderPointerListener#be5ce relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsGestureHandler#c7878 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderPointerListener#43771 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: _RenderScrollSemantics#ed173 relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderRepaintBoundary#f174c relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderCustomPaint#45897 relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
ListView file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:80:22
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderRepaintBoundary#4dd0a relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
Column file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:41:16
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#59b93 relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
Container file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:39:13
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderPadding#6c1a6 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
‘package:flutter/src/rendering/box.dart’:
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was:
Scaffold file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:33:12
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
Null check operator used on a null value
The relevant error-causing widget was:
Column file:///C:/Users/hsyna/AndroidStudioProjects/textfield_display_inputvalue/lib/main.dart:41:16
════════════════════════════════════════════════════════════════════════════════════════════════════
Yardımcı olabilirsen iyi olur valla. Bunu anlarsam bu sefer map te arama yapmayı deniycem.

HseyinAkkaya

hsynakcn00x bu hatanın sebebi column içinde listview kullanmakla ilgili. Sorunu şöyle açıklayım. Column içine atılan nesneler kadar büyür. List view ise parentı kadar büyümeye çalışır. Yani sonsuz büyüyebilen bir column içine column kadar büyüyecek bir listview atıyorsunuz. Dolayısıyla listview sonsuz büyümeye çalışıyor. Listviewı bir expanded ile sarmalarsanız sorun düzelecektir.

mayhemious

Bende bir projede aşağıdaki şekilde kullanmıştım

import 'package:shared_preferences/shared_preferences.dart';
import 'gelis.dart';

class Giris extends StatefulWidget {
  @override
  _GirisState createState() => _GirisState();
}

List listemiLk = []; //label text için
List bulistiLk = []; //textfield kayıt için
int dng = 2;//kaç daire var



List<TextEditingController> _controllers = List(); //texteditleri listeden al

class _GirisState extends State<Giris> {
  // final key1 =
  //     GlobalKey(); //duplicate hatası vermesin diye listview.builder a key verdim
  final _scaffoldKey = GlobalKey<
      ScaffoldState>(); //scafold a key verip snackbar kullanımında tanımla **** key i class ın altında tanımla yoksa hata olur
  void initState() {
    super.initState();
    //super in altında initstate
    SharedPreferences.getInstance().then((sf) => mySharedpref =
        sf); //bu şekilde shared pref tanımlaması yaparsan asyn gerek yok
    setState(() {
      ilk();
    });
  }

  @override
  void dispose() {
    super.dispose(); //super in üstünde dispose
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      //snackbar kullanımı için scafolda key atandı. bu key ile heryerden scafolda ulaşabilirsin

      body: Column(
        children: <Widget>[
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: ListView.builder(
                itemCount: listemiLk.length,
                //key: key1,
                itemBuilder: (context, i) {
                  _controllers.add(TextEditingController());

                  return Column(
                    children: [
                      Card(
                        child: TextFormField(
                          keyboardType: TextInputType.number,
                          controller: _controllers[i],
                          decoration: InputDecoration(
                              prefixIcon: Icon(Icons.add),
                              border: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(10)),
                              labelText:
                                  "${listemiLk[i].toString()} Endeksi Giriniz..!",
                              labelStyle: TextStyle(
                                color: Colors.black,
                              ),
                              fillColor: Colors.black),
                        ),
                        color: Color(0xff56c8d8),
                      ),
                      Divider(
                        color: Colors.black,
                      ),
                    ],
                  );
                },
              ),
            ),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              FlatButton.icon(
                icon: Icon(Icons.save),
                label: Text("KAYDET VE DEVAM ET"),
                onPressed: () => kaydet(),
              ),
              FlatButton.icon(
                icon: Icon(Icons.delete),
                label: Text("TEMİZLE"),
                onPressed: () => sil(),
              ),
            ],
          ),
          SizedBox(
            height: MediaQuery.of(context).size.height * 0.20,
          ),
        ],
      ),
    );
  }

  void snackbarGoster(snackbarYazi) {
    _scaffoldKey.currentState.showSnackBar(
      SnackBar(
        content: Text(
          snackbarYazi,
          textAlign: TextAlign.center,
        ),
        backgroundColor: Colors.black,
        // action: SnackBarAction(
        //   textColor: Colors.white,
        //label: "Test Butonu",
        // onPressed: () {
        //   // Buraya Butona Tıklayınca Yapılacak Olaylar Yazılacak.
        // },
        // ),
      ),
    );
  }

  void ilk() {
    for (var i = 0; i < dng; i++) {
      listemiLk.add("Daire ${i + 1} ilk ");
    }
  }

  void kaydet() {
    for (var i = 0; i < dng; i++) {
      if (_controllers[i].text == "") {
        _controllers[i].text = "0";
      }
      bulistiLk.add(_controllers[i].text);
    }

    snackbarGoster("Kayıt İşlemi Başarılı");

    Future.delayed(const Duration(seconds: 5), () async {
      // Navigator.pushNamed(context, "/gelis");
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) =>
              Gelis(bulistiLk: bulistiLk, listemiLk: listemiLk),
        ),
      );
    });
  }

  void sil() {
    for (var i = 0; i < dng; i++) {
      mySharedpref.remove(listemiLk[i].toString());
      bulistiLk.clear();
      _controllers[i].clear();
    }

    snackbarGoster("Tüm Kayıtlı Veriler Silindi");
  }

  void oku() async {
    for (var i = 0; i < dng; i++) {
      String a;

      a = listemiLk[i].toString();

      print(listemiLk[i].toString() + mySharedpref.getString(a));
    }
  }
}````

hsynakcn00x

mayhemious teşekkürler dostum uygularım bunu da 🙂

hsynakcn00x

HseyinAkkaya Harikasın eyvallah gardaş. Söylediğin tarzdaki bilgiler flutter.dev de widgetla ilgili yazılarda var mı çok dikkat etmedim de nerden alabilirim bu tarz bilgileri paylaşırsan sevinirim 🙂

HseyinAkkaya

hsynakcn00x aslında bu biraz widgetları tanımakla ilgili. Bu şekilde bir bilgi bulamazsınız. Column içinde listview kullanmayın ya da singlechildscroolview içinde listview kullanmayın gibi bilgiler açıklamalarda bulunmaz. ancak sorunla karşılaştığınızda forumlarda aratırsanız veya burada sorarsanız cevap bulabilirsiniz. Hatayla karşılaşan ve çözümü bilen birisi cevap verecektir. Hatta hata mesajında;

Exception caught by rendering library
RenderBox was not laid out: 
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
Failed assertion: line 1785 pos 12: ‘hasSize’
The relevant error-causing widget was: ListView

Render edemediğini yani çizim yapamadığını sebebinin listview olduğunu ve ‘hasSize’ değerinden kaynaklandığını söylüyor. Yani listview otomatik olarak boyutlandırılamıyor boyutunu sen belirle diyor. Expanded, flexible, sizedbox gibi widgetlar bu sorunları çözmek birebir.