Home > Back-end >  Use two textfield in a row column in a ListView.Builder
Use two textfield in a row column in a ListView.Builder

Time:01-20

I want to use a homemade widget with two text fields inside a row and a column. One of the textfield should be able to resize the widget, but when I use the widget inside a ListView.Builder, nothing appears until I assign a size to the main container.

This is my widget :

    import 'package:flutter/material.dart';
import 'functions/cardsFunctions.dart';


Widget concept(String type, String title, String description, int index, setState, String id) {
  String titre = '';
  return Container(
    child: Column(
      /// the complete block
      children: [
        Expanded(
          child: Row(
            /// title and three dots
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Expanded(
                child: TextFormField(
                  textAlign: TextAlign.justify,
                  enableSuggestions: true,
                  maxLength: 75,
                  onChanged: (String text) {
                    titre = text;
                  },
                ),
              ),
              SizedBox(height: 50,
                child: PopupMenuButton(
                    offset: const Offset(-50, 0),
                    itemBuilder: (context) => [
                             PopupMenuItem(
                              onTap: () {
                                updateCard( 'hello', titre, id);
                              model();
                              },
                            child: const ListTile(
                                leading: Icon(Icons.update_rounded),
                                title: Text('Update')),
                          ),
                           PopupMenuItem(
                             onTap: () {deleteCard(id, index);},
                            child:  const ListTile(
                                leading: Icon(Icons.delete_forever_rounded),
                                title: Text('Delete')),
                          ),
                        ]),
              ),
            ],
          ),
        ),
        /// description
        const SizedBox(height: 10
        ),
        const Expanded(
        child: TextField(
            maxLines: null,
            textAlign: TextAlign.justify,
            enableSuggestions: true,
            maxLength: 2000,
            decoration:  InputDecoration(
              hintText: 'What is it ?',
              border: InputBorder.none,
            )),
      )
      ],
    ),
  );
}

CodePudding user response:

You need to remove Expanded widget. Here is the widget structure,

Widget concept(String type, String title, String description, int index,
    setState, String id) {
  String titre = '';
  return Container(
    child: Column(
      /// the complete block
      children: [
        Row(
          /// title and three dots
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Expanded(
              child: TextFormField(
                textAlign: TextAlign.justify,
                enableSuggestions: true,
                maxLength: 75,
                onChanged: (String text) {
                  titre = text;
                },
              ),
            ),
            SizedBox(
              height: 50,
              child: PopupMenuButton(
                  offset: const Offset(-50, 0),
                  itemBuilder: (context) => [
                        PopupMenuItem(
                          onTap: () {},
                          child: const ListTile(
                              leading: Icon(Icons.update_rounded),
                              title: Text('Update')),
                        ),
                        PopupMenuItem(
                          onTap: () {},
                          child: const ListTile(
                              leading: Icon(Icons.delete_forever_rounded),
                              title: Text('Delete')),
                        ),
                      ]),
            ),
          ],
        ),

        /// description
        const SizedBox(height: 10),
        TextField(
            maxLines: null,
            textAlign: TextAlign.justify,
            enableSuggestions: true,
            maxLength: 2000,
            decoration: InputDecoration(
              hintText: 'What is it ?',
              border: InputBorder.none,
            )),
      ],
    ),
  );
}

  • Related