ProgressBar作为datagrid flex 3中的itemRendrer

时间:2015-05-11 08:58:06

标签: actionscript-3 flex datagrid actionscript progress-bar

我需要在数据网格中放入progressBar,但没有显示任何内容:

这是我的代码:

的DataProvider

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>

需要你帮助的人, 提前谢谢。

1 个答案:

答案 0 :(得分:0)

您需要使用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。