Search code examples
flutterlistviewtextfield

Use two textfield in a row+ column in a ListView.Builder


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,
            )),
      )
      ],
    ),
  );
}

Solution

  • 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,
                )),
          ],
        ),
      );
    }