Flutter DropdownButton设isDense=true后文本底部截断的解决方法

方案1：自定义DropdownMenuItem的内边距 #

isDense: true会强制压缩DropdownMenuItem的垂直空间，导致文本没有足够高度显示。直接给DropdownMenuItem设置上下内边距，就能给文本留出完整显示的空间：

DropdownButton(
  isDense: true,
  isExpanded: true,
  value: controller.selected,
  items: controller.menuList 
      .map(
        (e) => DropdownMenuItem(
          value: e,
          // 自定义上下内边距，根据字体大小调整数值
          padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 16),
          child: Text(
            e,
            style: widget.menuTextStyle ??
                kTextMainStyle.copyWith(
                  fontSize: kTextMiddleSize,
                ),
            overflow: TextOverflow.ellipsis,
          ),
        ),
      )
      .toList(),
  onChanged: (value) {
    controller.onChanged(value as String);
  },
)

方案2：用SizedBox固定文本高度 #

给Text包裹一个SizedBox，设置合适的高度（根据你的字体大小调整），确保文本垂直方向有足够空间：

DropdownButton(
  isDense: true,
  isExpanded: true,
  value: controller.selected,
  items: controller.menuList 
      .map(
        (e) => DropdownMenuItem(
          value: e,
          child: SizedBox(
            // 高度根据字体大小设置，比如16号字体设24左右
            height: 24,
            child: Text(
              e,
              style: widget.menuTextStyle ??
                  kTextMainStyle.copyWith(
                    fontSize: kTextMiddleSize,
                  ),
              overflow: TextOverflow.ellipsis,
              // 让文本垂直居中，避免偏移
              alignment: Alignment.centerLeft,
            ),
          ),
        ),
      )
      .toList(),
  onChanged: (value) {
    controller.onChanged(value as String);
  },
)

方案3：放弃isDense，直接控制DropdownButton的内边距 #

如果不需要依赖isDense的其他特性，直接通过buttonPadding调整DropdownButton的整体上下内边距，同样能缩小和标题的间距，且不会压缩文本空间：

DropdownButton(
  // 移除isDense
  // isDense: true,
  // 自定义上下内边距来缩小间距
  buttonPadding: const EdgeInsets.symmetric(vertical: 0, horizontal: 16),
  isExpanded: true,
  value: controller.selected,
  items: controller.menuList 
      .map(
        (e) => DropdownMenuItem(
          value: e,
          child: Text(
            e,
            style: widget.menuTextStyle ??
                kTextMainStyle.copyWith(
                  fontSize: kTextMiddleSize,
                ),
            overflow: TextOverflow.ellipsis,
          ),
        ),
      )
      .toList(),
  onChanged: (value) {
    controller.onChanged(value as String);
  },
)

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