如何在Flex 4.6移動項目中制作動態列表組件？

Question

我如何更改Flex 4.6移動項目中的列表組件，當按下一個項目時，它將動態調整大小並顯示文章說明和按鈕

這是預覽： https : //lh4.ggpht.com/GObdGVeDrLW_A-4_ZwuXzh21UY_JyT1P4RdpY6KYYMkW2L8rA08apQllt8cDpcM14w

謝謝

Answer 1

在列表中使用ItemRenderer。 在該項目渲染器中，您可以使用標簽，組，列表按鈕以及所需的任何東西

例如，這是主要清單

<s:List id="t_list"  width="100%" height="100%" itemRenderer="itemrenderer.ticketItemRenderer_One" contentBackgroundAlpha="0" left="5" right="5">
    <s:layout>
        <s:VerticalLayout gap="4" horizontalAlign="right" />
    </s:layout>
</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"  height="65" autoDrawBackground="false" click="itemrenderer1_clickHandler(event)"  >

    <fx:Style source="creobill.css" />

    <fx:Script>
        <![CDATA[

            import assets.triangle_white;

            import views.utilities;
        /*  open
            awaiting
            closed
            in progress */


            protected function itemrenderer1_clickHandler(event:MouseEvent):void
            {
            //  this.parentApplication.accountVN.pushView(utilities);
            }

        ]]>
    </fx:Script>


    <s:BitmapImage source="{triangle_white}" height="10" x="10" y="20" width="10" alpha="1" rotation="90" smooth="true" smoothingQuality="high"/>
    <s:Rect top="0" bottom="0" right="0" left="10" x="10" radiusY="4" radiusX="4" alpha="1" >
        <s:fill>
            <s:LinearGradient >
                <s:GradientEntry color="#ffffff" />
            </s:LinearGradient>
        </s:fill>
    </s:Rect>    
    <s:VGroup left="13" right="6" top="3" bottom="3" x="5" gap="2" horizontalAlign="center"  verticalAlign="middle">

    <s:HGroup  width="100%" height="50%" horizontalAlign="left" verticalAlign="middle">
        <s:Label id="t_subject" width="100%" height="100%" fontWeight="bold" styleName="content"
                 text="{data.subject}" />

    </s:HGroup> 



    <s:HGroup width="100%" height="50%" horizontalAlign="left" verticalAlign="middle">
        <s:Label id="y_list_replier" width="70%" height="100%" fontStyle="italic" styleName="content"
                 text="{data.lastreplier}" verticalAlign="middle"/>
        <s:Label id="t_status" width="30%" color="#373737" fontWeight="bold" styleName="labels"
                 text=" {data.ticketstatustitle}" textAlign="right"/>
    </s:HGroup>
        <s:Label id="t_last_update" width="100%" color="#585858" fontWeight="bold" styleName="labels"
                 text="Updated: {data.lastactivity}" textAlign="right" verticalAlign="middle"/>
</s:VGroup>
</s:ItemRenderer>

這樣，您可以添加按鈕並設置click方法以顯示或隱藏所需的組件