Flutter中如何设置PinFieldAutoFill的选中与启用状态边框颜色

要实现选中（聚焦）和启用状态的边框颜色区分，你可以利用BoxLooseDecoration的strokeColorBuilder属性，通过PinListenBuilder根据组件状态动态返回对应颜色：

PinFieldAutoFill(
  currentCode: codevalue,
  autoFocus: true,
  focusNode: myfocusnode,
  codeLength: 6,
  // 可选：添加enabled属性控制组件启用/禁用
  // enabled: _isEnabled,
  cursor: Cursor(
    width: 2,
    height: 20,
    color: Colors.red,
    radius: Radius.circular(1),
    enabled: true,
  ),
  textInputAction: TextInputAction.done,
  decoration: BoxLooseDecoration(
    radius: Radius.circular(10.0),
    bgColorBuilder: FixedColorBuilder(Color.fromARGB(255, 255, 255, 255)),
    // 动态设置边框颜色
    strokeColorBuilder: PinListenBuilder(
      onPinChange: (pin) {},
      builder: (context, pin, isFocused) {
        // 若设置了enabled属性，替换为_isEnabled判断
        bool isEnabled = true;
        
        if (isFocused && isEnabled) {
          // 选中（聚焦）状态的边框颜色
          return Colors.blue;
        } else if (isEnabled) {
          // 启用但未聚焦状态的边框颜色
          return Colors.black;
        } else {
          // 禁用状态的边框颜色
          return Colors.grey.shade400;
        }
      },
    ),
    gapSpace: 16,
  ),
)

核心说明： #

• PinListenBuilder的builder方法提供了isFocused参数，直接判断组件是否处于聚焦状态。
• 如果需要手动控制组件启用/禁用，给PinFieldAutoFill添加enabled属性后，在builder中结合该值判断即可。

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