更改数据网格中的颜色行

Question

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

这可能发生在不同的行中，而不是按顺序发生。如何应用此设置？

以下脚本：

<?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>

以测试脚本为例，第一行是默认值，在同一行中填充 85 列，直到值大于 85 才会发出警报。

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

Answer 1

使用 spark 数据网格，您可以对其进行蒙皮。在您的皮肤类中，根据某些条件设置您的行背景。下面的代码闪烁一行取决于给定的条件。

 <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>