Actionscript 3 具有HTML样式浮动的Flex容器

我正在使用Flex4和Spark组件构建一个移动应用程序，我有一个HGroup，用来包含我的所有元素。当屏幕加载时，它会拉入一小部分将要显示的文本，并循环浏览所有单词，查看其中是否有关键字。当它循环时，我将每个单词放入它自己的标签元素中，如果单词是关键字，它将更改一些样式并添加一个单击事件以显示关于该单词的描述

所有内容都可以正常运行，但是当所有内容都附加到HGroup时，结果只有一行，并且大部分文本都被完全截断，因为它不会包装内容

我的问题是-有没有一种方法可以设置或扩展HGroup以允许在其子元素上包装内容

下面是我所拥有的一些代码片段：

MXML容器：

<s:VGroup id="answerData" width="580" height="700" horizontalAlign="center" paddingTop="5">
<s:HGroup id="theLabel" color="white" width="580" fontSize="25" paddingBottom="20" />
<s:HGroup id="theText" color="white" width="580" fontSize="25" maxWidth="580" />
</s:VGroup>

至于创建标签：

public static function setKeyWords(someText:String, theGroup:Group, theDictionary:Array, theView:Object):void {
        theGroup.removeAllElements();
        var textArray:Array = someText.split(' ');
        for(var i:int = 0, l:int = textArray.length; i < l; i++) {
            if(checkForWord(theDictionary, textArray[i].toString())) {
                var theLink:Label = new Label();
                theLink.text = textArray[i].toString();
                theLink.setStyle("color", "0xFFFF00");
                theLink.setStyle("fontWeight", "bold");
                theLink.maxWidth = 580;
                var tmpDescrip:String = theDescription;
                theLink.addEventListener(MouseEvent.CLICK, function(evt:MouseEvent):void {
                    showToolTip(tmpDescrip, theView);
                });
                theGroup.addElement(theLink);
            } else {
                var someLabel:Label = new Label();
                someLabel.maxWidth = 580;
                someLabel.text = textArray[i].toString();
                theGroup.addElement(someLabel);
            }
        }
    }

public静态函数setKeyWords（someText:String，theGroup:Group，theDictionary:Array，theView:Object）：void{
组。removeAllElements（）；
var textArray:Array=someText.split（“”）；
for（变量i:int=0，l:int=textArray.length；i

我不能完全理解你的问题

如果您的意思是标签被截断，则可能需要设置percentWidth并使用maxDisplayedLines包裹标签：

someLabel.maxDisplayedLines = 10; someLabel.maxDisplayedLines=10； 如果您想在组布局中添加列和行，请使用TileGroup/TileLayout

---

如果您组的子组包含必须浮动的复合内容，则某种类型的includeInLayout=false可能会有所帮助。

如果希望文本以几行为一块显示，请使用mx:text并设置宽度。

---

要在HGroup上方显示某些内容，最简单的方法是不使用HGroup，只在其上方创建透明的容器（画布）。在那里，您可以自由地显示任何内容（只需进行数学运算以正确定位即可）。

我遇到的问题是，我在一个VGroup中有多个标签，需要它们进行包装，而不是超出容器设置的宽度。我试图将关键词整合到文本的动态段落中。我不能使用mx:Text，因为我需要每个单词都是自己的组件，允许自定义样式和鼠标单击，即使该单词是关键字。此外，label max lines解决方案也不起作用，因为我在一个VGroup中处理多个标签，VGroup需要包装其子项而不是标签标签。我也不能使用TileGroup，因为它看起来不正确，将一个段落分解成一个表格式的组件，其中每个单词都在它自己的列/行中

我使用的解决方案是对生成的标签中的每个字符进行计数，并将其添加到一个变量中，以确定何时需要创建一个新的HGroup，该HGroup保存标签并位于VGroup中。我必须这样做，因为我无法确定标签的宽度，直到它呈现，因为它是动态生成的。这是无法做到的，因为它的渲染点太晚了，我无法移动所有东西，因为用户可以看到所有发生的事情，这肯定不是期望的效果

以下是我用来解决此问题的代码，以防其他人遇到此问题：

public static function setKeyWords(someText:String, theGroup:Group, theDictionary:Array, theView:Object):void {
        theGroup.removeAllElements();
        var textArray:Array = someText.split(' ');
        var theCount:int = 0;
        var theHGroup:HGroup = new HGroup();
        var breakNum:int = 40;
        theHGroup.percentWidth = 100;
        for(var i:int = 0, l:int = textArray.length; i < l; i++) {
            theCount += textArray[i].toString().length;
            if(theCount >= breakNum) {
                theGroup.addElement(theHGroup);
                theHGroup = new HGroup();
                theHGroup.percentWidth = 100;
                theCount = 0;
            }
            if(checkForWord(theDictionary, textArray[i].toString())) {
                theCount += 1;
                var theLink:Label = new Label();
                theLink.text = textArray[i].toString();
                theLink.setStyle("color", "0xFFFF00");
                theLink.setStyle("fontWeight", "bold");
                theLink.maxWidth = 580;
                //theLink.includeInLayout = false;
                var tmpDescrip:String = theDescription;
                theLink.addEventListener(MouseEvent.CLICK, function(evt:MouseEvent):void {
                    showToolTip(tmpDescrip, theView, 'keywords');
                });
                theHGroup.addElement(theLink);
            } else {
                theCount += 1;
                var someLabel:Label = new Label();
                someLabel.maxWidth = 580;
                someLabel.text = textArray[i].toString();
                //someLabel.includeInLayout = false;
                theHGroup.addElement(someLabel);
            }
        }
        if(theCount > 0)
            theGroup.addElement(theHGroup);
    }

public静态函数setKeyWords（someText:String，theGroup:Group，theDictionary:Array，theView:Object）：void{
组。removeAllElements（）；
var textArray:Array=someText.split（“”）；
变量计数：int=0；
var theHGroup:HGroup=newhgroup（）；
var-breakNum:int=40；
hGroup.percentWidth=100；
for（变量i:int=0，l:int=textArray.length；i=breakNum）{
添加元素组（theHGroup）；
theHGroup=新HGroup（）；
hGroup.percentWidth=100；
计数=0；
}
if（checkForWord（字典，textary[i].toString（））{
计数+=1；
var theLink:Label=新标签（）；
theLink.text=textary[i].toString（）；
链接设置样式（“颜色”，“0xFFFF00”）；
链接设置样式（“字体权重”、“粗体”）；
theLink.maxWidth=580；
//link.includeInLayout=false；
var tmpDescrip:String=描述；
link.addEventListener（MouseEvent.CLICK），函数（evt:MouseEvent）：void{
显示工具提示（tmpDescrip，theView，“关键字”）；
});
组加法（链接）；
}否则{
计数+=1；
var someLabel:Label=新标签（）；
someLabel.maxWidth=580；
someLabel.text=textArray[i].toString（）；
//someLabel.includeInLayout=false；
hGroup.addElement（someLabel）；
}
}
如果（计数>0）
添加元素组（theHGroup）；
}

这可能不是最有效的方法，但它确实有效，而且在Iphone上执行所需的时间也很短