How to create outline DropdownMenuItem on flutter

Question

Example Dropdown

I created DropdownButtonFormField but DropdownMenuItem has cover DropdownButtonFormField after tap. So, I want to DropdownMenuItem output below DropdownButtonFormField

My code:

  Widget genderPicker(BuildContext context){
    print(_gender);
    return DropdownButtonFormField<String>(
      isExpanded: false,
      hint: Text('Select Gender'),
      validator: (val) => val == null ? 'Gender is required' : null,
      onSaved: (val) => _gender = val,
      autovalidate: true,
      decoration: InputDecoration(
        prefixIcon: Icon(
          Icons.people,
          color: Theme.of(context).brightness == Brightness.light
            ? Colors.grey.shade700
            : Colors.white70),
        border: OutlineInputBorder(
          borderSide: BorderSide(color: Colors.black),
          borderRadius: BorderRadius.all(Radius.circular(30.0))
        )),
      items: genderList.map((value) {
        return DropdownMenuItem<String>(
          child: Text(value), value: value);
      }).toList(),
      value: _gender,
      onChanged: (newValue) {
        setState(() {
          _gender = newValue;
        });
      },
    );
  }

Answer 1

It seems that you need to use Stack for the position of your widget.

You can give exact position of your widget.

Positioned(
  right: 40.0,
  top: 40.0,
  child: Container(
    color: Colors.pink,
    height: 150.0,
    width: 150.0,
  ),
)

For more check this .