Как установить ширину метки внутри itemrenderer для списка искр в жидком макете?

В имеющемся у меня гибком проекте, рассчитанном на 100% масштабирование до веб-окна, у меня есть список искр. И у меня есть простое средство визуализации элементов, которое принимает данные и отображает имя и сообщение. Подумайте об этом как о простом дисплее программы обмена мгновенными сообщениями. Проблема в том, что для моего ярлыка msg_txt я хочу дать ему ширину, равную ширине родительского списка, в котором он находится.

Я попытался отключить horizontalScrollPolicy, также попробовал width = "{this.parent.parent.width}" (а также this.parent.width) для метки искры внутри средства визуализации элементов.

и в ярлыке я пробовал такие вещи, как left = "0" right = "0" maxWidth = "{this.width}", но на самом деле ничего не помогает.

Как я могу сделать эту метку максимальной шириной списка, в котором она находится, И убедиться, что она меняет размер, если размер браузера и размер списка изменится?

вот список:

<s:List id="chat_content" width="100%" height="100%"
                alternatingItemColors="[#EEEEEE,#E6E6E6]" contentBackgroundColor="#EEEEEE"
                horizontalScrollPolicy="off" itemRenderer="renderers.ActiveChatItemRenderer">
        </s:List>

вот рендерер предметов:

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Script>
        <![CDATA[
            import mx.core.FlexGlobals;
            import mx.events.FlexEvent;

            import spark.components.List;

            override public function set data(value:Object):void {
                super.data = value;
                if (data == null)
                    return;

                if(data.systemMsg)
                {

                }
                if(data.name)
                {
                    name_label.text=data.name;
                }
                if(data.icon)
                {

                }
                if(data.msg)
                {
                    msg_txt.text=data.msg;
                }




            }





        ]]>
    </fx:Script>

    <s:states>
        <s:State name="normal" />
        <s:State name="hovered" />
        <s:State name="selected" />
    </s:states>

    <s:HGroup id="container" horizontalAlign="left" verticalAlign="top" paddingTop="10" paddingBottom="10">
        <s:VGroup horizontalAlign="center" verticalAlign="middle"
                  width="100">
            <s:Label id="name_label" fontWeight="bold" text="Name: "
                     fontSize="18"/>
        </s:VGroup>
        <s:Label id="msg_txt" text="msg text here" width="{this.parent.parent.width}"/>


    </s:HGroup>

</s:ItemRenderer>

width flash actionscript-3 apache-flex itemrenderer
person brybam    schedule 29.06.2011    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Пробовали ли вы программно использовать percentWidth и percentHeight после создания объекта itemRenderer (creationComplete)?

or

Я еще не пробовал:

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark" width="100%" height="100%">
person Mc-    schedule 29.06.2011
comment
Вот и все! Спасибо! (поместив width = 100% height = 100% в объявление ItemRenderer) - person brybam; 30.06.2011
comment
Я не уверен, почему это работает. Размер дочерних элементов всегда зависит от родителя; и в этом случае List определяет размеры рендереров. Я думал, что itemRenderers всегда имеют размер, равный 100% ширины класса List. (Минус полосы прокрутки, отступы и другие подобные значения) - person JeffryHouser; 30.06.2011
comment
Спасибо. Семь лет спустя я занимаюсь именно этим. - person Olin Kirkland; 12.07.2018

arrow_upward
0
arrow_downward

Установите свойства ширины в процентах для дочерних элементов itemRenderer:

<s:HGroup id="container" horizontalAlign="left" verticalAlign="top" paddingTop="10" paddingBottom="10" width="100%">
    <s:VGroup horizontalAlign="center" verticalAlign="middle"
              width="100">
        <s:Label id="name_label" fontWeight="bold" text="Name: "
                 fontSize="18"  width="100%"/>
    </s:VGroup>
    <s:Label id="msg_txt" text="msg text here" width="{this.parent.parent.width}"  width="100%"/>
</s:HGroup>

Я не понимаю, какой макет вы собираетесь использовать. Поскольку в коде всего две метки; зачем тебе две группы? Если вы хотите отобразить два элемента рядом, вы можете использовать что-то вроде этого:

<s:Label id="name_label" fontWeight="bold" text="Name: " fontSize="18"  width="100" x="0" y="0"/>
<s:Label id="msg_txt" text="msg text here" width="{this.parent.parent.width}"  width="100%" x="{name_label.x + name_label.width}" y="0"/>

Который, как я подозреваю, даст вам похожий макет без использования дополнительных групп.

person JeffryHouser    schedule 29.06.2011
comment
Причина, по которой я использую 2 группы, заключается в том, что я играл с разными раскладками. В любом случае, я попробовал ваше предложение, я установил ширину метки и ширину Hgroup на 100% ... Вы могли подумать, что это сработает, но это не так. метка по-прежнему выходит за пределы ширины компонента списка и никогда не прерывается. Я бы попытался использовать текстовую область / поле ввода, но размер текстовой области не изменяется в зависимости от введенного текста, как это делает этикетка. - person brybam; 30.06.2011