按钮宽度中的额外像素

Question

<s:Button id="btn1" label="1" width="18" includeInLayout="true" visible="true" click="onSmallBtnClick();" />
<s:Button id ="btn2" label="2" width="18" includeInLayout="true" visible="true" click="onSmallBtnClick();" />
<s:Button id ="btn3" label="3" width="18" includeInLayout="true" visible="true" click="onSmallBtnClick();" />
<s:Button id="bigButton" label="bigButton" width="72" includeInLayout="false" visible="false" />

private function onSmallBtnClick():void {
    hideBtn(btn1);
    hideBtn(btn2);
    hideBtn(btn3);
    showBtn(bigButton);
}

private function showBtn(button:Button):void {
    button.visible = true;
    button.includeInLayout = true;
}

private function hideBtn(button:Button):void {
    button.visible = false;
    button.includeInLayout = false;
}

大家好，在上面的 Flex 代码中，我的界面上有 4 个四个按钮。界面应以可见的小按钮 1、2、3 和不可见的大按钮开始。单击任一小按钮时，大按钮将代替 3 个小按钮出现。小按钮的宽度设置为 18，而大按钮的宽度设置为 72。

我的问题是，bigButton 的宽度不应该是 54，因为 18x3 = 54？或者按钮中是否有一些我应该知道的填充？在这个live docs 页面中，它说..

默认情况下，Flex 会拉伸 Button 控件的宽度以适应 它的标签、任何图标以及图标周围 6 像素的内边距。你可以 通过显式设置 width 属性覆盖此默认宽度 Button 控件的特定值或其百分比 父容器。如果指定百分比值，按钮 在其最小和最大宽度之间调整大小作为其大小 父容器发生变化。

这可能是问题吗？因为我有 3 个按钮，并且图标周围的填充占用 6x3 = 18 像素。按钮之间似乎没有任何间隙。所以我很想知道额外的 18 个像素是从哪里来的。

谢谢。

Answer 1

一旦我没有看到任何为按钮设置的 x 或 left 东西，我猜你使用类似 HGroup 或任何其他带有 HorizontalLayout 的容器。 它有一个名为gap 的属性，该属性默认为6。 但是不会加18px，会加12px...

尝试将所有按钮的minWidth 设置为0。