Flutter DropdownButton图标蓝色背景自定义问题咨询

问题核心在于图标容器尺寸未合理设置、DropdownButton点击区域未覆盖蓝色背景，同时状态更新方式有误。以下是修复后的代码：

Container(
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(10),
    color: Colors.white,
  ),
  child: Padding(
    padding: const EdgeInsets.only(left: 16.0),
    child: StatefulBuilder(builder: (context, miniState) {
      return DropdownButtonHideUnderline(
        child: DropdownButton(
          key: Key(widget.formKey),
          focusColor: Colors.transparent,
          isExpanded: true, // 让按钮占满父容器宽度，确保图标背景对齐右侧圆角
          icon: Container(
            width: 48, // 固定宽度保证点击区域足够
            height: double.infinity, // 高度撑满父容器，让蓝色背景覆盖右侧垂直区域
            decoration: const BoxDecoration(
              borderRadius: BorderRadius.only(
                topRight: Radius.circular(10),
                bottomRight: Radius.circular(10),
              ),
              color: AppColor.primaryBlue,
            ),
            alignment: Alignment.center, // 让图标居中显示
            child: const Icon(
              Icons.arrow_drop_down,
              color: Colors.white,
            ),
          ),
          value: widget.selectedItem,
          onChanged: (String? value) => miniState(() { // 使用StatefulBuilder的局部状态更新方法
            widget.selectedItem = value!;
            widget.onValueChanged.call(value);
          }),
          items: widget.items.map((String value) {
            return DropdownMenuItem<String>(
              value: value,
              child: Row(
                children: [Text(value), const SizedBox(width: 4.0)],
              ),
            );
          }).toList(),
        ),
      );
    }),
  ),
)

关键改动说明：

• 添加isExpanded: true：让DropdownButton占满父容器宽度，确保图标容器的右侧圆角与外层Container的圆角对齐。
• 给图标Container设置width: 48和height: double.infinity：固定宽度保证点击区域覆盖蓝色背景，高度撑满让背景完整填充右侧垂直空间，同时用alignment: Alignment.center让图标居中。
• 替换setState为miniState：在StatefulBuilder的回调中，需使用它提供的局部状态更新方法，而非全局setState。

内容的提问来源于stack exchange，提问作者Dennis