dart 选择DropdownButtonFormField时的内容更改

我有一个DropdownButtonFormField的容器，其中包含4个项目和4个TextFormField。我想为DropdownButtonFormField中的每个项目显示一个或多个TextFormField。例如，当用户选择项目（A）时，仅显示项目（A）的文本字段以供用户输入值，或者当选择项目（B）时，则显示两个或所有文本字段。
我怎么能做到这一点。下面是部分代码。

return SingleChildScrollView(
  child: Container(
    child: Column(
        children: [
    Padding(
    padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 15),
    child: Column(
      children: [
    DropdownButtonFormField(
    decoration: InputDecoration(
    labelText: 'Calculate',
      value: selectedValue,
      onChanged: (String? newValue) {
        setState(() {
          selectedValue = newValue!;
        });
      },
      items: dropdownItems,
    ),
    SizedBox(height: 20),
    inputForm(
      title: locale.translate('AreaGeo')!,
      controller: _controller1,
      suffix: locale.translate('AreaSuffix')!,
    ),
    inputForm(
      title: locale.translate('RadiusGeo')!,
      controller: _controller2,
      suffix: locale.translate('RadiusSuffix')!,
    ),
    GestureDetector(
      onTap: () {
        loanCalculation();
        Future.delayed(Duration.zero);
        showModalBottomSheet(
          isScrollControlled: true,
          isDismissible: false,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadiusDirectional.only(
              topEnd: Radius.circular(18),
              topStart: Radius.circular(18),
            ),
          ),
          context: context,
          builder: (context) => SingleChildScrollView(
            child: Wrap(
              children: [
                Container(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      SizedBox(height: 20),
                      Center(
                        child: Container(
                          width: 80,
                          height: 5,
                          decoration: BoxDecoration(
                            color: Colors.grey[700],
                            borderRadius:
                            BorderRadius.circular(15),
                          ),
                        ),
                      ),
                      SizedBox(height: 15),
                      Padding(
                        padding: const EdgeInsets.fromLTRB(
                            20, 10, 0, 10),
                        child: Column(
                          children: [
                            result(
                                title: locale
                                    .translate('AreaGeo')!,
                                amount: area),
                            result(
                                title: locale
                                    .translate('RadiusGeo')!,
                                amount: radiusC),
                            result(
                                title:
                                locale.translate('DiameterGeo')!,
                                amount: diameter),
                            result(
                                title:
                                locale.translate('CircumferenceGeo')!,
                                amount: circumference),
                          ],
                        ),
                      ),
                      SizedBox(height: 15),
                      GestureDetector(
                        onTap: () {
                          Navigator.of(context).pop();
                        },
                        child: Padding(
                          padding: const EdgeInsets.fromLTRB(
                              30, 10, 30, 30),
                          child: Container(
                            height: 60,
                            width: double.infinity,
                            decoration: BoxDecoration(
                              color: UnitConverterApp.isDarkMode
                                  ? AppColors.accentDarkColor
                                  : AppColors.accentLightColor,
                              borderRadius:
                              BorderRadius.circular(10),
                            ),
                            child: Center(
                                child: Text(
                                  locale.translate('ReCalculate')!,
                                  style: style,
                                )),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        );
      },
      child: Container(
        height: 60,
        width: double.infinity,
        decoration: BoxDecoration(
          color: UnitConverterApp.isDarkMode
              ? AppColors.accentDarkColor
              : AppColors.accentLightColor,
          borderRadius: BorderRadius.circular(10),
        ),
        child: Center(
            child: Text(
              locale.translate('Calculate')!,
              style: style,
            )),
      ),
    ),
    ],
  ),
),
],
),
),
);

推荐的方法是什么？我应该在onchanged:里面写什么

我自己解决了，这里是完整的代码列表，如果有人在未来有同样的问题。
这里是DropDownButtonFormField

DropdownButtonFormField(
                decoration: InputDecoration(
                  labelText: 'Calculate',
                  labelStyle: TextStyle(
                    fontSize: 20,
                    color: UnitConverterApp.isDarkMode
                        ? AppColors.accentDarkColor
                        : AppColors.accentLightColor,
                  ),
                  border: const OutlineInputBorder(),
                  enabledBorder: OutlineInputBorder(
                    borderSide: BorderSide(
                        color: UnitConverterApp.isDarkMode
                            ? Colors.white30
                            : Colors.black26),
                  ),
                  focusedBorder: OutlineInputBorder(
                    borderSide: BorderSide(
                      color: UnitConverterApp.isDarkMode
                          ? AppColors.accentDarkColor
                          : AppColors.accentLightColor,
                      width: 2,
                    ),
                  ),
                ),
                value: selectedValue,
                onChanged: (String? newValue) {
                  setState(() {
                    selectedValue = newValue!;
                  });
                },
                items: dropdownItems,
              ),

项目列表

List<DropdownMenuItem<String>> get dropdownItems {
List<DropdownMenuItem<String>> menuItems = [
  DropdownMenuItem(child: Text("Area"), value: "1"),
  DropdownMenuItem(child: Text("Radius"), value: "2"),
  DropdownMenuItem(child: Text("Diameter"), value: "3"),
  DropdownMenuItem(child: Text("Circumference"), value: "4"),
];
return menuItems;}

textWidget函数

textWidget() {
final AppLocalizations locale = AppLocalizations.of(context)!;

if (selectedValue == "1") {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      SizedBox(height: 10),
      Text(
        locale.translate('RadiusConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('RadiusGeo')!,
        controller: _controller2,
        suffix: locale.translate('RadiusSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('DiameterConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('DiameterGeo')!,
        controller: _controller3,
        suffix: locale.translate('DiameterSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('CircumferenceConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('CircumferenceGeo')!,
        controller: _controller4,
        suffix: locale.translate('CircumferenceSuffix')!,
      ),
    ],
  );
} else if (selectedValue == "2") {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      SizedBox(height: 10),
      Text(
        locale.translate('AreaConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('AreaGeo')!,
        controller: _controller1,
        suffix: locale.translate('AreaSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('DiameterConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('DiameterGeo')!,
        controller: _controller3,
        suffix: locale.translate('DiameterSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('CircumferenceConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('CircumferenceGeo')!,
        controller: _controller4,
        suffix: locale.translate('CircumferenceSuffix')!,
      ),
    ],
  );
} else if (selectedValue == "3") {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      SizedBox(height: 10),
      Text(
        locale.translate('AreaConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('AreaGeo')!,
        controller: _controller1,
        suffix: locale.translate('AreaSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('RadiusConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('RadiusGeo')!,
        controller: _controller2,
        suffix: locale.translate('RadiusSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('CircumferenceConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('CircumferenceGeo')!,
        controller: _controller4,
        suffix: locale.translate('CircumferenceSuffix')!,
      ),
    ],
  );
} else if (selectedValue == "4") {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      SizedBox(height: 10),
      Text(
        locale.translate('AreaConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('AreaGeo')!,
        controller: _controller1,
        suffix: locale.translate('AreaSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('RadiusConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('RadiusGeo')!,
        controller: _controller2,
        suffix: locale.translate('RadiusSuffix')!,
      ),
      SizedBox(height: 10),
      Text(
        locale.translate('DiameterConvert')!,
        style: TextStyle(fontSize: 18),
      ),
      SizedBox(height: 10),
      inputForm(
        title: locale.translate('DiameterGeo')!,
        controller: _controller3,
        suffix: locale.translate('DiameterSuffix')!,
      ),
    ],
  );
} else {
  return Text('No Selection');
}}

dart 选择DropdownButtonFormField时的内容更改

1条答案

相关问题

热门标签

最新问答