Сетка данных Spark с флажком не обновляется корректно - PullRequest
Новая
       30

Сетка данных Spark с флажком не обновляется корректно

0 голосов
/ 27 мая 2011

Флажки обновляются правильно, когда я выбираю одну или несколько строк сетки данных, но когда я выбираю флажок в первый раз, флажок не обновляется, пока указатель не выйдет из строки сетки данных.Как я могу это исправить? 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx">
    <s:DataGrid id="dg" x="344" y="48" selectionMode="multipleRows" requestedRowCount="4">
        <s:columns>
            <s:ArrayList>
                <s:GridColumn>
                    <s:itemRenderer>
                        <fx:Component>
                            <s:GridItemRenderer>
                                <fx:Script>
                                    <![CDATA[
                                        import mx.controls.Alert;
                                        import spark.components.DataGrid;

                                        override public function prepare(hasBeenRecycled:Boolean):void
                                        {
                                            cb.selected = grid.selectionContainsIndex(rowIndex);
                                        }
                                    ]]>
                                </fx:Script>
                                <s:CheckBox id="cb" label="" horizontalCenter="0"/>
                            </s:GridItemRenderer>
                        </fx:Component>
                    </s:itemRenderer>
                </s:GridColumn>
                <s:GridColumn dataField="dataField1" headerText="Column 1"></s:GridColumn>
                <s:GridColumn dataField="dataField2" headerText="Column 2"></s:GridColumn>
                <s:GridColumn dataField="dataField3" headerText="Column 3"></s:GridColumn>
            </s:ArrayList>
        </s:columns>
        <s:typicalItem>
            <fx:Object dataField1="Sample Data" dataField2="Sample Data" dataField3="Sample Data"></fx:Object>
        </s:typicalItem>
        <s:ArrayList>
            <fx:Object dataField1="data1" dataField2="data1" dataField3="data1"></fx:Object>
            <fx:Object dataField1="data2" dataField2="data2" dataField3="data2"></fx:Object>
            <fx:Object dataField1="data3" dataField2="data3" dataField3="data3"></fx:Object>
            <fx:Object dataField1="data4" dataField2="data4" dataField3="data4"></fx:Object>
        </s:ArrayList>
    </s:DataGrid>
</s:Application>

Ответы [ 4 ]

2 голосов
/ 21 октября 2011

Измените это: 

 <s:CheckBox id="cb" label="" horizontalCenter="0"/>

На: 

<s:CheckBox id="cb" label="" horizontalCenter="0" enabled="false"/>

Я просто рекомендую использовать свойство enabled.

Я думаю, что отправленное «событие щелчка» изи checkbox, и gridColumn, затем возвращаемая функция не позволяла друг другу.

Если для свойства enabled установлено значение false, ваше событие щелчка отправляется только на gridColumn, тогда использование cb.selected=grid.selectionContainsIndex(rowIndex); правильно занимает место, если вы хотите показать флажоквключен, вы можете использовать CSS или skinclass

1 голос
/ 05 октября 2016

В итоге я просто сделал это: 

            <s:GridColumn dataField="myBoolean" headerText="Returned" width="55">
                <s:itemRenderer>
                    <fx:Component>
                        <s:GridItemRenderer>
                                <s:CheckBox id="cb1" selected="{data.myBoolean}" change="{data.myBoolean=cb1.selected}"/>                                                           
                        </s:GridItemRenderer>
                    </fx:Component>
                </s:itemRenderer>
            </s:GridColumn>
1 голос
/ 02 февраля 2012

Самый простой способ - просто использовать выбранное состояние рендеринга, как предложено RIAStar. Однако, если вы используете глобальный скиннинг, выполнение пользовательского чертежа не работает, используйте либо контейнер с скином, либо, как я только что поставил, флажок, но не заставляйте его отвечать на команды мыши. Для множественного выбора, пока ваша сетка настроена на несколько строк или столбцов, вы можете просто захватывать события мыши и нажимать клавишу ctrl, которая заставляет их обрабатывать множественный выбор. 

<s:GridItemRenderer 
    mouseDown="mouseDownHandler(event)"
    mouseUp="mouseUpHandler(event)"
    buttonMode="true"
    mouseChildren="false"
    useHandCursor="true"
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark"
    >

    <s:states>
        <s:State name="normal"/>
        <s:State name="selected"/>
    </s:states>

    <fx:Script>
        <![CDATA[
            protected function mouseUpHandler(event:MouseEvent):void {
                event.ctrlKey = true;
            }

            protected function mouseDownHandler(event:MouseEvent):void {
                event.ctrlKey = true;
            }
        ]]>
    </fx:Script>

    <s:CheckBox 
        id="check"
        selected.normal="false"
        selected.selected="true"
        horizontalCenter="0"
        verticalCenter="0"
        />

</s:GridItemRenderer>
0 голосов
/ 27 мая 2011

Вы можете просто подделать CheckBox, нарисовав форму CheckBox в ItemRenderer и использовать состояния, чтобы показать галочку. 

<s:GridItemRenderer>
    <s:states>
        <s:State name="normal" />
        <s:State name="hovered" />
        <s:State name="selected" />
    </s:states>

    <!-- checkbox graphics -->
    <s:Group width="16" height="16" horizontalCenter="0" verticalCenter="0">
        <s:Rect left="0" right="0" top="0" bottom="0">
            <s:fill>
                <s:SolidColor color="0xffffff" />
            </s:fill>
            <s:stroke>
                <s:SolidColorStroke color="0xa9aeb2" />
            </s:stroke>
        </s:Rect>

        <!-- tick, only shown when selected -->
        <s:Rect includeIn="selected" width="8" height="8" horizontalCenter="0" verticalCenter="0">
            <s:fill>
                <s:SolidColor color="0x90b40c" />
            </s:fill>
        </s:Rect>
    </s:Group>
</s:GridItemRenderer>

Это упрощенная графика для флажка, но вы можете взять код из свечи CheckBoxSkin и скопировать / вставить его в itemrenderer. Возможно, придется изменить некоторые названия штатов.

Это не отменяет выбор одной строки, хотя при нажатии CheckBox уже выбранной строки, если вы не удерживаете клавишу CTRL . Это поведение по умолчанию для компонента DataGrid. Боюсь, вам придется создать свой собственный подкласс DataGri d, если вы хотите предотвратить такое поведение.

Еще одна важная вещь: установка свойства selected для itemrenderers не меняет selectIndices DataGrid. Следовательно, в следующем цикле commitProperties() значение, установленное в рендере, будет переопределено DataGrid.

Старый ответ: (до редактирования)

Класс ItemRenderer (и, следовательно, класс GridItemRenderer) имеет свойство selected. Таким образом, вы можете привязать свойство selected флажков к itemrenders, вот так: 

<s:CheckBox selected="{selected}" horizontalCenter="0" />

Вы должны создать отдельный класс ItemRenderer, чтобы он работал, но вместо встроенного. Если вы абсолютно хотите использовать встроенный способ, вы всегда можете переопределить установщик selected. 

<s:GridItemRenderer>
  <fx:Script>
  <![CDATA[
      override public function set selected(value:Boolean):void {
          super.selected = cb.selected = value;
      }
  ]]>
  </fx:Script>
  <s:CheckBox id="cb" horizontalCenter="0"/>
</s:GridItemRenderer>
...