如何删除 Flex 4 TextArea 组件的边框（spark 主题光环）

Question

使用 Flex 3 SDK，您只需将 borderThickness 样式设置为 0，或将 borderStyle 设置为 none。 对于 Flex 4 SDK 和 Spark 主题，这没有效果。

Answer 1

尝试类似的方法：

borderVisible="false"

Answer 2

如果您想从 spark TextArea 中删除边框，可以使用以下几种方法：
要使所有 Spark TextAreas 没有边框，您可以这样做：

s|TextArea {
  borderVisible : false;
}

您还可以制作一个简单的样式，然后仅将它们应用到特定的 Spark TextAreas，如下所示：

.noBorder {
  borderVisible : false;
}
...
<s:TextArea styleName="noBorder"/>

您可以通过创建完成将其关闭，如下所示：

<s:Application ...
  creationComplete="onCreationComplete()"/>
...
private function onCreationComplete() : void {
  mySparkTextArea.setStyle('borderVisible', false);
}
...
<s:TextArea id="mySparkTextArea"/>
</s:Application>

最后，您可以制作皮肤，根据 DrMaxmAd 的建议，如下所示：

...
<!-- border/fill --> 
<s:Rect left="0" right="0" top="0" bottom="0">
    <s:stroke>
        <s:SolidColorStroke color="#5C5C5C" weight="1" alpha="0"/>            
    </s:stroke>
    <s:fill>
        <s:SolidColor color="#FFFFFF"/>
    </s:fill>
</s:Rect>
...

Answer 3

我还没有涉足 Flash Builder 4，但我知道在 Flex 3 中您可以修改如下内容（当其他方式不可能时）：

var tb:TextInput = new TextInput();
tb.getChildAt(0).setStyle(...);

可能想尝试一下，您通常只需要找到正确的子元素。

编辑：这是您的答案

Answer 4

您必须将 borderSkin 设置为 null

<mx:TextArea borderSkin={null} />

Answer 5

Jeol，您的答案适用于 MX 组件，对于 Flex 4 Spark textarea 组件，您设置 borderVisible="false" 并在代码 lblMessage.setStyle("contentBackgroundAlpha", 0); 中设置

另外，如果你这样做，你可能希望黑客让该死的东西自动调整其内容...设置 heightInLines="{NaN}"

<s:TextArea borderVisible="false" focusEnabled="false" width="100%" id="lblMessage" heightInLines="{NaN}"  editable="false" selectable="true" lineBreak="toFit" verticalScrollPolicy="off" horizontalScrollPolicy="off" />

protected function OnCreationComplete(objEvent:Event):void{
   lblMessage.setStyle("contentBackgroundAlpha", 0);
 }

...感谢 RobotLegs，它太棒了！

Answer 6

好吧，我已经尝试了上面的代码，但它对我的 Flex Hero SDK 4.5 不起作用，所以我选择了 textArea 并创建了一个新的自定义皮肤并将边框 alpha 更改为 0。

<!-- border/fill --> 
    <s:Rect left="0" right="0" top="0" bottom="0">
        <s:stroke>
            <s:SolidColorStroke color="#5C5C5C" weight="1" alpha="0"/>            
        </s:stroke>
        <s:fill>
            <s:SolidColor color="#FFFFFF"/>
        </s:fill>
    </s:Rect>

简单而甜蜜

Answer 7

在 Flex 3 中： TextArea 组件的边框可以通过使用以下两个属性/属性进行控制：

• borderSkin="{null}"
• focusAlpha="0"

Focus alpha 确保即使 TextArea 处于打开状态也不会显示边框已选择。