Question

我正在使用一个list元素，其中variableRowHeight和word-wrap设置为true，如下例所示：

http://blog.flexexamples.com/2007/10/27/creating-multi-line-list-rows-with-variable-row-heights/

当我使用鼠标滚轮滚动列表时，listItems中的文本也会滚动。我知道这与textField的高度有关......但我不确定如何最好地解决这个问题。任何想法都表示赞赏！

我遇到的问题也出现在上面的示例中。

Answer 1

好的，经过一番工作后解决了。以为我会把它放在别人身上：

这可以通过扩展List元素和ListItemRenderer并修改几行来简单解决：

首先，扩展List元素：

package au.com.keeghan.controls {
    import mx.controls.List;
    import mx.core.ClassFactory;

    public class ExtendedList extends List{
        public function ExtendedList(){
            super();

            itemRenderer = new ClassFactory(ExtendedListItemRenderer);
        }
    }
}

现在我们要扩展新创建的项呈示器（ExtendedListItemRenderer）。因为实际上没有那么多代码需要，我们可以把它放在同一个.as文件中。我们这样做是通过将它声明为内部类，并将其定位在上面的包之外...就在结束括号之下：

import mx.controls.listClasses.ListItemRenderer;

internal class AsOneListItemRenderer extends ListItemRenderer{

    override protected function measure():void{
        super.measure();

        var w:Number = 0;

        if (icon)
            w = icon.measuredWidth;

        // Guarantee that label width isn't zero
        // because it messes up ability to measure.
        if (label.width < 4 || label.height < 4)
        {
            label.width = 4;
            label.height = 16;
        }

        if (isNaN(explicitWidth))
        {
            w += label.getExplicitOrMeasuredWidth();
            measuredWidth = w;
            measuredHeight = label.getExplicitOrMeasuredHeight();
        }
        else
        {
            measuredWidth = explicitWidth;

            label.setActualSize(Math.max(explicitWidth - w, 4), label.measuredHeight + 3);
            label.validateNow();
            label.height = label.textHeight + 5;
            measuredHeight = label.getExplicitOrMeasuredHeight() + 3;          

            if (icon && icon.measuredHeight > measuredHeight){
                measuredHeight = icon.measuredHeight;
            }
        }
    }
}

现在，上面的大部分代码实际上只是从ListItemRenderer中复制而来，魔术发生在底层...特别是这些行：

label.setActualSize(Math.max(explicitWidth - w, 4), label.measuredHeight + 3);
label.validateNow();
label.height = label.textHeight + 5;
measuredHeight = label.getExplicitOrMeasuredHeight() + 3;

我在这里所做的就是为标签添加一些高度，以及整体测量的高度，这最终导致了这个问题。

这个解决方案的唯一缺点是你会在listItem元素下面获得更多的填充，但是你仍然可以通过使用verticalAlign和padding css属性来使它看起来很好。

滚动列表元素也会导致文本元素滚动

1 个答案: