`

Flex itemRenderer渲染器

    博客分类:
  • Flex
阅读更多

<?xml version="1.0" encoding="utf-8"?>  
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">  
    <mx:DataGrid x="66.5" y="145" id="dataGrid" dataProvider="{dataXml.children()}">  
        <mx:columns>  
            <mx:DataGridColumn headerText="标签" dataField="@label"/>  
            <mx:DataGridColumn headerText="值" dataField="@value">  
                <mx:itemRenderer>  
                    <mx:Component>  
                        <mx:VBox>  
                         <mx:Script>
                            <![CDATA[
                            [Bindable]  
                                    public var comboSource:Array=["true","false","zhongli"];  
                                    /**初始化下拉框渲染器**/ 
                                    private function init():void 
                                    {  
                                        trace(data.@value);  
                                        if(data.@value=="true")  
                                        {  
                                            comboItem.selectedIndex=0;  
                                        }  
                                        else  if(data.@value=="false")
                                        {  
                                            comboItem.selectedIndex=1;  
                                        }  
                                        else{
                                         comboItem.selectedIndex=3;  
                                        }
                                    }  
                                      
                                    private function onComboClosed():void 
                                    {  
                                        data.@value=comboItem.text;  
                                    }   
                            ]]>
                        </mx:Script>
                            <mx:ComboBox dataProvider="{comboSource}" editable="true" creationComplete="init();" id="comboItem" close="onComboClosed();"/>  
                        </mx:VBox>  
                    </mx:Component>  
                </mx:itemRenderer>  
            </mx:DataGridColumn>  
        </mx:columns>  
    </mx:DataGrid>  
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;  
            [Bindable]  
            protected var dataXml:XML=<info>  
                <aa label="24" value="false"/>  
                <aa label="55" value="false"/>  
                <aa label="23" value="true"/>  
                <bb label="bb" value="false"/>  
                <bb label="b1" value="zhongli"/>  
            </info>;  
              
            private function onButtonClicked():void 
            {  
                Alert.show(dataXml.toXMLString(),"datasource");  
            }

        ]]>
    </mx:Script>
    <mx:Button x="66" y="115" label="Button" click="onButtonClicked()"/>  
      
</mx:Application>

分享到:
评论

相关推荐

    flex itemRenderer 渲染机制的概念和使用

    itemRenderer通常与List、DataGrid等数据绑定组件一起使用,通过设置其`itemRenderer`属性来指定自定义的渲染器类。 ### 二、itemRenderer的使用 1. **创建itemRenderer组件** 要创建一个itemRenderer,首先需要...

    flex中渲染器简介

    Flex 渲染器是Flex框架中的一个重要特性,主要用于在列表控件如List、DataGrid、Tree等中定制数据显示。在Flex中,渲染器允许开发者自定义列表中每一项的外观和行为,以此来提高用户体验和视觉吸引力。本系列将深入...

    内渲染器_ItemRenderer

    内渲染器(ItemRenderer)是Flex、Flash Builder或者ActionScript等富互联网应用程序开发中的一个重要概念,主要用于自定义组件列表项的显示方式。在基于Adobe Flex的项目中,它允许开发者根据需要为数据列表(如...

    flex中的渲染器(itemrenderer)

    flex中经常会使用到渲染器,这里简要介绍一下渲染器的一些知识

    Flex ItemRenderer

    Flex ItemRenderer 是Adobe Flex框架中的一个重要概念,它主要用于自定义MX和Spark组件列表视图(如List、DataGrid等)中的每一项显示样式。ItemRenderer允许开发者根据数据项的内容个性化呈现,提供更丰富的用户...

    Flex项呈示器ItemRenderer

    在默认情况下,Flex提供了一些基本的渲染器,如Label、Icon等,但往往不能满足复杂的界面设计需求。此时,开发者可以通过自定义ItemRenderer来实现更丰富的数据显示,比如在列表中添加图片、文本、按钮等元素,或者...

    flex4做的itemrenderer呈现器

    `data`对象是ItemRenderer的默认属性,它包含了与当前渲染项关联的数据。 3. **样式和布局**: Flex4支持丰富的样式和布局管理。为了模仿雅虎聊天界面,可能需要添加背景色、边框,以及适当的内边距。例如: ``...

    flex 自定义dataGrid渲染器.根据数据变色

    自定义渲染器是Flex组件定制的一部分,它可以让我们对UI元素的显示方式有更大的控制力。在这个场景中,我们创建了一个针对DataGrid的自定义Label渲染器,这个渲染器能够根据数据显示不同的颜色,以突出关键信息或者...

    flex+as3项目渲染器的使用

    在Flex和AS3开发中,项目渲染器(ItemRenderer)是一个关键的概念,它允许开发者自定义数据项在UI组件中的显示方式。项目渲染器通常用于数据网格、列表或其他可滚动的容器,使得数据显示更加丰富和交互性更强。下面...

    Flex内联itemRenderer

    内联itemRenderer则意味着我们可以在不影响整个应用结构的情况下,直接在MXML代码中定义和使用这些渲染器,而不是将其作为一个独立的类文件。 在Flex中,我们可以使用MX或Spark组件库来创建itemRenderer。MX组件库...

    Flex中itemRenderer的使用简介

    此外,避免在ItemRenderer中使用不必要的计算或重渲染操作。 6. **使用vvList.mxml**: 虽然没有提供`vvList.mxml`的具体内容,但通常这个文件可能是一个包含列表组件的示例,其中使用了我们刚刚创建的`...

    Flex4_DataGrid_Tree_条目渲染器_源码

    总之,了解并熟练掌握Flex4的DataGrid和Tree组件,以及如何自定义条目渲染器,对于构建用户界面和提升用户体验至关重要。这不仅涉及到数据绑定、事件处理,还涵盖了组件的可扩展性和自定义性,是Flex开发中的重要...

    解决flex的tilelist中的滚动条下滑,乱渲染问题。

    这是因为Flex的ItemRenderer重用机制,当一个ItemRenderer不再可见(被滚动出视口)时,它会被复用到其他位置,如果没有正确处理选中状态,就会导致渲染混乱。 解决这个问题的关键在于ItemRenderer的初始化和数据...

    flex datagrid 添加按钮

    - 将自定义的列渲染器设置到需要显示按钮的列上,例如:`&lt;mx:DataGridColumn dataField="someField" itemRenderer="path.to.CustomButtonRenderer"/&gt;`,这里的`path.to.CustomButtonRenderer`是自定义渲染器类的...

    flex tree 中渲染checkBox

    自定义渲染器是Flex中扩展组件外观和行为的一种方式。在这个文件中,你需要定义一个继承自`mx.controls.treeClasses.TreeItemRenderer`的类,并覆盖`createChildren`方法来添加CheckBox组件。然后,你需要实现`set ...

    Flex 定制ItemRender详细解释

    - 重写`set data(value:Object)`方法,根据传入的数据对象更新渲染器的显示。 3. **使用自定义ItemRenderer**: - 在需要自定义渲染的列表或组合框组件上设置`itemRenderer`属性,指向自定义ItemRenderer类。 - ...

    ItemRenderer的用法

    1. **创建渲染器类**:在Flex或Flash Builder中,创建一个新的MXML或AS类,继承自相应的`ItemRenderer`基类。 2. **定义界面**:在MXML文件中,定义UI组件,如Label、Button等,并设置它们的数据绑定属性,确保它们...

    flex 中tree渲染checkbox

    接下来,我们需要在Tree组件上设置itemRenderer属性,使其使用我们刚创建的自定义渲染器: ```xml &lt;mx:Tree id="tree" dataProvider="{treeData}" itemRenderer="com.myapp.renderers.TreeChkItemRenderer"/&gt; ``` ...

    itemRenderer 提前加载问题

    这个标题暗示了开发者可能遇到的一个常见问题,即ItemRenderer(项渲染器)在实际需要之前就被加载,这可能导致性能下降或者不必要的资源消耗。 ItemRenderer是Flex和ActionScript中的关键组件,用于自定义列表或...

    Flex 的树加线条

    在Tree组件的XML声明中,通过`&lt;mx:tree&gt;`标签可以配置属性,例如设置`itemRenderer`属性为“TreeItemLinesRenderer”,这样就指定了一个自定义的渲染器,该渲染器负责在树节点之间绘制线条。 在Flex中,创建自定义...

Global site tag (gtag.js) - Google Analytics