Flutter中csc_picker添加BoxDecoration后下拉框处于禁用状态如何解决

问题根因 #

• csc_picker组件内置的默认装饰会默认配置手势透传和下拉状态联动逻辑，当你传入自定义BoxDecoration直接覆盖组件的decoration属性时，会打断组件内部的状态关联逻辑，导致州/省份、城市二级、三级下拉被默认置为未激活状态，触发不可交互的问题。
• 若你在外层容器添加自定义BoxDecoration时未配置手势透传，外层容器会拦截点击事件，也会导致下拉框无法响应操作。

修复方案 #

方案1：外层容器加装饰，保留组件内置decoration配置（推荐） #

不直接修改csc_picker的内置decoration参数，在外层套Container实现自定义装饰效果，示例代码如下：

Container(
  // 自定义装饰写在外层容器
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(8),
    border: Border.all(color: Colors.grey.shade300),
    color: Colors.white,
  ),
  padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
  child: CSCPicker(
    // 仅修改下拉框的输入样式，不覆盖整体decoration
    dropdownDecoration: const InputDecoration(
      border: InputBorder.none,
      contentPadding: EdgeInsets.zero,
    ),
    // 其余原有配置保持不变：onCountryChanged、onStateChanged、onCityChanged等
  ),
)

方案2：自定义内置decoration时手动开启下拉激活状态 #

如果你确实需要直接修改csc_picker的内置decoration，需要手动指定三个下拉框的禁用状态为false，打断组件默认的状态联动限制，示例代码如下：

CSCPicker(
  // 你的自定义装饰
  decoration: BoxDecoration(
    // 自定义属性：圆角、边框、背景色等
  ),
  // 手动开启所有下拉框的激活状态
  disableCountry: false,
  disableState: false,
  disableCity: false,
  // 其余原有配置保持不变
)

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