ProgressBar作為datagrid flex 3中的itemRendrer

Question

我需要將ProgressBar放在datagrid內，但什么都沒有顯示：

這是我的代碼：

數據提供者

private var provider:ArrayCollection = new ArrayCollection([
                        {data:'1',progress:"10"},
                        {data:'2',progress:"50"}]);

數據網格

<mx:DataGrid id="myGrid" width="100%"
            dataProvider="{provider}" x="0" editable="true">
            <mx:columns>
                <mx:DataGridColumn dataField="data" />

                <mx:DataGridColumn dataField="nombreUser"  >
                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:ProgressBar minimum="0" maximum="100" />
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns> 
        </mx:DataGrid>

需要您的幫助，謝謝。

Answer 1

您將需要為進度條使用manual模式。 這是Flex 3的完整工作示例。ItemRenderer CustomProgressbarItemRenderer為：

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">
    <mx:Script>
        <![CDATA[
            private function updateCurrentValue():void 
            {
                pb.setProgress(data.progress,100);
            }
        ]]>
    </mx:Script>
    <mx:ProgressBar id="pb" minimum="0" maximum="100" mode="manual" updateComplete="updateCurrentValue()"/>
</mx:Canvas>

主要應用是：

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600" xmlns:local="*">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            [Bindable]
            private var provider:ArrayCollection = new ArrayCollection([
                {data:'1',progress:"10"},
                {data:'2',progress:"40"}]);

                protected function button1_clickHandler(event:MouseEvent):void
                {
                    provider.getItemAt(0).progress = 50;
                }
        ]]>
    </mx:Script>
    <mx:VBox width="100%" height="100%">
        <mx:DataGrid id="myGrid" width="100%"
                     dataProvider="{provider}" x="0" editable="true">
            <mx:columns>
                <mx:DataGridColumn dataField="data" />
                <mx:DataGridColumn dataField="progress">
                    <mx:itemRenderer>
                        <mx:Component>
                            <local:CustomProgressbarItemRenderer/>
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
        <mx:Button label="Update" click="button1_clickHandler(event)"/>
    </mx:VBox>
</mx:Application>

單擊按鈕，它將把0th項目的進度更新為50。