Show form based on item selected in DropdownButtonFormField flutter-CodePudding

I am using this dropdownbuttonform to allow user to make selection from a list of items. When user select Item 1, I want to show a form for the user to enter the details. I don't know if DropdownButtonFormField is the right widget to use and how to go about it.

This is a snippet of my drop down form

             List items = ['Item 1', 'Item 2' 'Item 3', 'Item 4'];



               DropdownButtonFormField(
                

                 value: selectedStatus,

                   onChanged: ( value) {
                   setState(() {
                     selectedStatus = value.toString();
                     });
                   },

                   selectedItemBuilder: (context) => status.map((item) {
                    return DropdownMenuItem(
                      value: item,
                      child: Text(
                        item,
                        style: TextStyle(
                          color: Color(0xFF0E0E0E),
                          fontSize: 14,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    );
                  }).toList(),

                  decoration: InputDecoration(
                    border: InputBorder.none,
                    filled: true,
                    fillColor: Colors.white,
                   ),
                  items: status.map((status) {
                    return DropdownMenuItem<String>(
                      value: status,
                      child: Text(
                        status,
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 14,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    );
                  }).toList(),
                  
                ),

CodePudding user response：

You can use conditional if to present the new widget. like

   child: Column(
        children: [
            DropdownButtonFormField(..),
           if (selectedStatus == items[0]) TextFormField()

Demo

List items = ['Item 1', 'Item 2', 'Item 3', 'Item 4'];

  String? selectedStatus;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Form(
        child: Column(
          children: [
            DropdownButtonFormField(
              value: selectedStatus,
              onChanged: (value) {
                setState(() {
                  selectedStatus = value.toString();
                });
              },
              items: items.map((status) {
                return DropdownMenuItem<String>(
                  value: status,
                  child: Text(
                    status,
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: 14,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                );
              }).toList(),
            ),

            //or you can use `Item 1`
            if (selectedStatus == items[0]) TextFormField()
          ],
        ),
      ),
    );
  }
}