为什么我的列表视图不使用setstate更新

时间:2019-02-03 18:27:34

标签: dart flutter

在下面的代码中,我有窗口小部件列表,并在listview中使用,即在setstate中使用list.add()添加窗口小部件,列表也未更新,我不知道发生了什么。为什么我的列表没有更新

以下是代码

class EditorPageState extends State<EditorPage> {

List<Widget> obj = List<Widget>();

GlobalKey formkey= GlobalKey<FormState>();



@override
Widget build(BuildContext context) {

obj.add( TextFormField(
        textCapitalization: TextCapitalization.sentences,
        maxLength: 50,
        decoration: InputDecoration(
          labelText: "TITLE",
          hintText: "UR ARTICLE NAME"
        ),
      ));
      obj.add(TextFormField(decoration: InputDecoration(
          labelText: "Article's Propic",
          hintText: "Only image Url is Accepted"
        ),));

return Scaffold(
  appBar: AppBar(title: Text("data"),),
body: Form(
  key: formkey,
  child:Stack(
    children: <Widget>[
      Padding(
        padding: const EdgeInsets.only(bottom: 50),
        child: ListView(
                shrinkWrap: true,
                  children: obj
              ),
      ),
            Container(
              height: MediaQuery.of(context).size.height,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  SizedBox(),
                  Container(
                    alignment: Alignment.bottomCenter,
                    height: 50,width: MediaQuery.of(context).size.width,
      color: Colors.black38,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(icon: Icon(Icons.format_bold),color: Colors.white,onPressed: (){
                    setState(() {
                      obj.add(TextFormField(
                      style: TextStyle(fontWeight: FontWeight.bold),
                      decoration: InputDecoration(
                        labelText: "heading"
                      ),
                    ));
                    });
          },),
          IconButton(icon: Icon(Icons.add),
          onPressed: (){
                    setState(() {
                      obj.add(TextFormField(
                      style: TextStyle(fontWeight: FontWeight.bold),
                      decoration: InputDecoration(
                        labelText: "Start again here"
                      ),
                    ));
                    });
          }
          ),
          IconButton(icon: Icon(Icons.add_a_photo),
          onPressed: (){

          }
          ),
          IconButton(icon: Icon(Icons.delete),
          onPressed: (){

          },
          )
        ],
      ),
      ),
                ],
              ),
            ),
    ],
  ),
      ),

);

} }

以上代码是statefulwidget广告的全屏对话框 多数民众赞成在那我可以知道为什么我的列表没有更新

1 个答案:

答案 0 :(得分:0)

那么您将需要实现一个ListViewBuilder来做到这一点,请拆分您的布局创建,您的构建方法将不可读。我对您的布局进行了一些更改以提高可读性,并且源代码中包含一些注释来帮助您了解我的工作。希望对您有所帮助,您可以根据需要调整此代码。

class EditorPageState extends State<EditorPage> {

  List<Widget> obj = List<Widget>();
  GlobalKey formkey= GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    obj.add( TextFormField(
      textCapitalization: TextCapitalization.sentences,
      maxLength: 50,
      decoration: InputDecoration(
          labelText: "TITLE",
          hintText: "UR ARTICLE NAME"
      ),
    ));

    obj.add(TextFormField(decoration: InputDecoration(
        labelText: "Article's Propic",
        hintText: "Only image Url is Accepted"
    ),));

    return Scaffold(
      appBar: AppBar(title: Text("data"),),
      //you can use this property to easily create a bottom navigation
      bottomNavigationBar: _buildBottomNavigator(), // this method return BottomNavigation layout

      body: Padding(
        padding: EdgeInsets.symmetric(horizontal: 16.0),
        child: Form(
          key: formkey,
          /// here your question answer... you need implemet a listView builder
          /// in every build this will create a new ListView getting itens of a especific list
          child : ListView.builder(
              itemCount: obj.length, // number of items in your list

              //here the implementation of itemBuilder. take a look at flutter docs to see details
              itemBuilder: (BuildContext context, int Itemindex){
                return obj[Itemindex]; // return your widget
              }),
        ),
      ),
    );
  }

  //create your bottom navigation layout
  Widget _buildBottomNavigator(){
    return Container(
      color: Colors.black54,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(icon: Icon(Icons.format_bold),color: Colors.white,onPressed: (){
            setState(() {
              obj.add(TextFormField(
                style: TextStyle(fontWeight: FontWeight.bold),
                decoration: InputDecoration(
                    labelText: "heading"
                ),
              ));
            });
          },),

          IconButton(icon: Icon(Icons.add),
              onPressed: (){
                print("on pressed");
                setState(() {
                  obj.add( TextFormField(
                    style: TextStyle(fontWeight: FontWeight.bold),
                    decoration: InputDecoration(
                        labelText: "Start again here"
                    ),
                  ));
                });
              }
          ),
          IconButton(icon: Icon(Icons.add_a_photo),
              onPressed: (){

              }
          ),
          IconButton(icon: Icon(Icons.delete),
            onPressed: (){

            },
          )
        ],
      ),
    );
  }