更改数据网格中的颜色行 [英] change color row in datagrid

查看:29
本文介绍了更改数据网格中的颜色行的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个脚本,它已经满足我的需求,但想向我的客户发送警告信号,指出出现问题我能够将线条颜色更改为红色我正在工作

I have a script that already meets me but would like to send warning signals to my client that something is wrong I was able to change the line color to red I'm working

这可能发生在不同的线路中,而不是按顺序发生.如何应用此设置?

this can happen in diversar lines and not in sequence. How can I apply this setting?

下面的脚本:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
    import mx.controls.Alert;
    import mx.controls.TextInput;
    import mx.events.DataGridEvent;
    import mx.events.DataGridEventReason;

    [Bindable]
    var Acumula:int = 0;

    protected function checkInput(event:DataGridEvent):void
    {


        if (event.reason == DataGridEventReason.NEW_ROW || event.reason == DataGridEventReason.NEW_COLUMN)
        {
            var editor:TextInput = (event.currentTarget as DataGrid).itemEditorInstance as TextInput;
            var text:String = editor.text;
            var myEditor:TextInput =  TextInput(event.currentTarget.itemEditorInstance);


            Acumula += int(myEditor.text);
            if(int(Acumula) > int(event.itemRenderer.data.score)) 
                {                           
                    Acumula = 0;

                    event.preventDefault();

                    Alert.show(text + "ULTRAPASSOU!");

                    return;
                }

        }
    }

]]>
</mx:Script>
<mx:ArrayCollection id="arrColl">
<mx:source>
    <mx:Array>
        <mx:Object label="Student A" score="85"/>
        <mx:Object label="Student B" score="48"/>
        <mx:Object label="Student C" score="71"/>
        <mx:Object label="Student D" score="88"/>
        <mx:Object label="Student E" score="24"/>
        <mx:Object label="Student F" score="64"/>
        <mx:Object label="Student G" score="76"/>
        <mx:Object label="Student H" score="76"/>
        <mx:Object label="Student I" score="93"/>
        <mx:Object label="Student J" score="88"/>
        <mx:Object label="Student K" score="48"/>
        <mx:Object label="Student L" score="76"/>
    </mx:Array>
</mx:source>
</mx:ArrayCollection>
<mx:DataGrid x="10" y="28" dataProvider="{arrColl}" editable="true" itemEditEnd="checkInput(event)">
<mx:columns>
    <mx:DataGridColumn headerText="Column 1"  dataField="label" editable="false"/>
    <mx:DataGridColumn headerText="Column 2"  dataField="score" editable="false"/>

    <mx:DataGridColumn headerText="Column 3"  editable="true" dataField="col1">
        <mx:itemEditor>
            <mx:Component>
                <mx:TextInput restrict="0-9"/>
            </mx:Component>
        </mx:itemEditor> 
    </mx:DataGridColumn>

    <mx:DataGridColumn headerText="Column 4"  editable="true" dataField="col2">
        <mx:itemEditor>
            <mx:Component>
                <mx:TextInput restrict="0-9"/>
            </mx:Component>
        </mx:itemEditor> 
    </mx:DataGridColumn>

    <mx:DataGridColumn headerText="Column 5"  editable="true" dataField="col3">
        <mx:itemEditor>
            <mx:Component>
                <mx:TextInput restrict="0-9"/>
            </mx:Component>
        </mx:itemEditor> 
    </mx:DataGridColumn>

    <mx:DataGridColumn headerText="Column 6"  editable="true" dataField="col4">
        <mx:itemEditor>
            <mx:Component>
                <mx:TextInput restrict="0-9"/>
            </mx:Component>
        </mx:itemEditor> 
    </mx:DataGridColumn>

    <mx:DataGridColumn headerText="Column 7"  editable="true" dataField="col5">
        <mx:itemEditor>
            <mx:Component>
                <mx:TextInput restrict="0-9"/>
            </mx:Component>
        </mx:itemEditor> 
    </mx:DataGridColumn>

</mx:columns>
</mx:DataGrid>
<mx:Label x="164" y="211" text="{Acumula}"/>
</mx:Application>

以测试脚本为例,第一行的值 defalt 填充同一行中的 85 列,直到值大于 85 才会发出警报.

To test the script for example, the first row is the value defalt go filling 85 columns in the same row until the value is greater than 85 there will be an alert issued.

这次我想把这条线的颜色改成红色.

this time I want to change the color of this line to red.

推荐答案

使用 spark datagrid,您可以为其设置皮肤.在您的皮肤类中,根据某些条件设置行背景.下面的代码根据给定的条件闪烁一行.

use spark datagrid, which you can able to skin it. in your skin class set your row background depending upon some condition. below code blinks a row depends on given condition.

 <fx:Component id="rowBackground">

            <s:Rect implements="spark.components.gridClasses.IGridVisualElement">
                <fx:Declarations>
                    <s:Animate id="myBlinkingEffect" 
                               repeatCount="0" 
                               repeatBehavior="reverse"
                               target="{rowBackgroundFillColor}"
                               duration="1000"
                               >
                        <s:motionPaths>
                            <s:SimpleMotionPath property="alpha"
                                                valueFrom="1"
                                                valueTo="0"
                                                />
                        </s:motionPaths>
                    </s:Animate>

                </fx:Declarations>
                <fx:Script>
                    <![CDATA[
                        import spark.components.DataGrid;
                        import spark.components.Grid;

                        /**
                         * @private
                         */  
                        public function prepareGridVisualElement(grid:Grid, rowIndex:int, columnIndex:int):void
                        {
                            const dataGrid:DataGrid = grid.dataGrid;
                            if (!dataGrid)
                                return;

                            var item:Object;
                            if (rowIndex < grid.dataProvider.length) {
                                item = grid.dataProvider[rowIndex];  // the data item from this row


                                if ( /*your condition*/ ){
                                    rowBackgroundFillColor.color = 0xFF0000;
                                    myBlinkingEffect.play();//Blinking
                                } 

                            }

                        }
                    ]]>
                </fx:Script>  
                <s:fill>
                    <!--- @private -->  
                    <s:SolidColor id="rowBackgroundFillColor" color="0xFFFFFF" alpha="0.5"/>
                </s:fill>
            </s:Rect>
        </fx:Component>

这篇关于更改数据网格中的颜色行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆