如何在Flutter中创建自定义下拉框

import 'package:flutter/material.dart';
import 'package:dropdown_formfield/dropdown_formfield.dart';

class CustomDropdown extends StatefulWidget {
  @override
  _CustomDropdownState createState() => _CustomDropdownState();
}

class _CustomDropdownState extends State<CustomDropdown> {
  String _selectedOption;

  final List<Map<String, dynamic>> _options = [
    {'value': 'option1', 'display': 'Option 1'},
    {'value': 'option2', 'display': 'Option 2'},
    {'value': 'option3', 'display': 'Option 3'},
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Custom Dropdown'),
      ),
      body: Container(
        padding: EdgeInsets.all(16.0),
        child: Column(
          children: [
            DropDownFormField(
              titleText: 'Select an option',
              hintText: 'Please choose one',
              value: _selectedOption,
              onChanged: (value) {
                setState(() {
                  _selectedOption = value;
                });
              },
              dataSource: _options,
              textField: 'display',
              valueField: 'value',
            ),
            SizedBox(height: 16.0),
            Text('Selected option: $_selectedOption'),
          ],
        ),
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: CustomDropdown(),
  ));
}