После добавления пользовательского TreeItemRenderer глючит прокрутка Flex Tree - PullRequest
Новая
       8

После добавления пользовательского TreeItemRenderer глючит прокрутка Flex Tree

0 голосов
/ 04 июня 2011

У меня следующий код - как TreeItemRenderer 

<?xml version="1.0" encoding="utf-8"?>
<mx:TreeItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                     xmlns:s="library://ns.adobe.com/flex/spark" 
                     xmlns:mx="library://ns.adobe.com/flex/mx"
                     xmlns:solar="*">
    <fx:Script>
        <![CDATA[
            import mx.containers.Canvas;
            import mx.containers.VBox;
            import mx.controls.Alert;
            import mx.controls.Button;
            import mx.controls.CheckBox;
            import mx.controls.Tree;
            import mx.controls.listClasses.BaseListData;
            import mx.controls.treeClasses.TreeListData;
            import mx.core.mx_internal;
            use namespace mx_internal;

            protected var buttonBox : VBox;

            override protected function createChildren() : void
            {
                super.createChildren();
                setStyle( "verticalAlign", "top" );

                this.addEventListener( MouseEvent.CLICK, mouseHandler );
            }

            protected function mouseHandler( event : MouseEvent ) : void
            {

                if( data.@buttonsVisible == "true" )
                    data.@buttonsVisible = "false"
                else
                    data.@buttonsVisible = "true";

                showButtons();
            }

            private function showButtons() : void
            {
                if(  true )
                {
                    if( buttonBox == null )
                    {
                        buttonBox = new VBox();
                        buttonBox.setStyle( "verticalGap", 0 );
                        addChild( buttonBox );

                        var b1 : Button     = new Button();
                        b1.percentWidth = 100;
                        b1.label        = "block";
                        buttonBox.addChild( b1 );

                        var b2 : Button     = new Button();
                        b2.percentWidth = 100;
                        b2.label        = "block1";
                        buttonBox.addChild( b2 );

                        var b3 : Button     = new Button();
                        b3.percentWidth = 100;
                        b3.label        = "block";
                        buttonBox.addChild( b3 );
                    }
                }
                else 
                    if( buttonBox != null )
                    {
                        removeChild( buttonBox );
                        buttonBox = null;
                    }
                invalidateSize();
                invalidateDisplayList();
            }

            override public function set listData( value : BaseListData ) : void
            {
                super.listData = value;

                if( listData )
                {
                    showButtons();
                }
            }

            override protected function measure() : void
            {
                super.measure();

                if( buttonBox != null )
                {

                    //buttonBox.visible = buttonBox.includeInLayout =( !isOpening && isOpen ) ;
                    var b : Boolean = false;

                    if( data.@buttonsVisible != null )
                        b = data.@buttonsVisible == "true";

                    buttonBox.visible = buttonBox.includeInLayout = b;

                    if( buttonBox.visible )
                    {
                        buttonBox.y     = measuredHeight;
                        measuredHeight += buttonBox.measuredHeight;
                    }
                }
            }

            override protected function updateDisplayList( unscaledWidth : Number, unscaledHeight : Number ) : void 
            {
                super.updateDisplayList( unscaledWidth, unscaledHeight );

                if( buttonBox != null )
                {
                    buttonBox.x = 40;
                    buttonBox.setActualSize( unscaledWidth - buttonBox.x, unscaledHeight );
                }
            }

        ]]>
    </fx:Script>
</mx:TreeItemRenderer>

Код приложения следующий: 

<?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" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <mx:Tree x="289" y="0" width="377" height="599" labelField="@label" itemRenderer="iRR"  variableRowHeight="true">
    <mx:dataProvider>
        <fx:XMLList xmlns="">
            <folder state="unchecked" label="Marketing Collateral" isBranch="true" >
                <folder state="unchecked" isBranch="true" label="Media, PR, and Communications" >
                    <folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
                    <folder state="unchecked" isBranch="false" label="Articles Reprints" />
                    <folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
                    <folder state="unchecked" isBranch="false" label="Press Kits" />
                    <folder state="unchecked" isBranch="false" label="Press Releases" />
                    <folder state="unchecked" isBranch="false" label="Quick Hits" />
                    <folder state="unchecked" isBranch="false" label="Rep Talking Points" />
                    <folder state="unchecked" isBranch="false" label="Special Updates" />
                    <folder state="unchecked" isBranch="false" label="White Papers" />
                    <folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
                    <folder state="unchecked" isBranch="false" label="Articles Reprints" />
                    <folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
                    <folder state="unchecked" isBranch="false" label="Press Kits" />
                    <folder state="unchecked" isBranch="false" label="Press Releases" />
                    <folder state="unchecked" isBranch="false" label="Quick Hits" />
                    <folder state="unchecked" isBranch="false" label="Rep Talking Points" />
                    <folder state="unchecked" isBranch="false" label="Special Updates" />
                    <folder state="unchecked" isBranch="false" label="White Papers" />
                    <folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
                    <folder state="unchecked" isBranch="false" label="Articles Reprints" />
                    <folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
                    <folder state="unchecked" isBranch="false" label="Press Kits" />
                    <folder state="unchecked" isBranch="false" label="Press Releases" />
                    <folder state="unchecked" isBranch="false" label="Quick Hits" />
                    <folder state="unchecked" isBranch="false" label="Rep Talking Points" />
                    <folder state="unchecked" isBranch="false" label="Special Updates" />
                    <folder state="unchecked" isBranch="false" label="White Papers" />
                    <folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
                    <folder state="unchecked" isBranch="false" label="Articles Reprints" />
                    <folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
                    <folder state="unchecked" isBranch="false" label="Press Kits" />
                    <folder state="unchecked" isBranch="false" label="Press Releases" />
                    <folder state="unchecked" isBranch="false" label="Quick Hits" />
                    <folder state="unchecked" isBranch="false" label="Rep Talking Points" />
                    <folder state="unchecked" isBranch="false" label="Special Updates" />
                    <folder state="unchecked" isBranch="false" label="White Papers" />
                </folder>
                <folder  state="unchecked" isBranch="true" label="Forms and Applications" >
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                </folder>
                <folder  state="unchecked" isBranch="true" label="Forms and Applications" >
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                </folder>
                <folder  state="unchecked" isBranch="true" label="Forms and Applications" >
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                    <folder state="unchecked" isBranch="false" label="Applications" />
                    <folder state="unchecked" isBranch="false" label="Forms" />
                </folder>
            </folder>
        </fx:XMLList>
    </mx:dataProvider>
    </mx:Tree>
</s:Application>
  • Код в основном работает немного, но после открытия нескольких элементов - он не работает, и прокрутка становится ошибочной. Пожалуйста, помогите.

Ответы [ 3 ]

3 голосов
/ 04 июня 2011

Попробуйте Spark Tree , он основан на Spark List и свободен от всех ошибок MX Tree.

2 голосов
/ 21 августа 2011

Я думаю, что ваша проблема связана с основами работы ItemRenderers.

Обратите внимание, что ItemRenderers перерабатываются, поэтому при прокрутке списка новые создатели ItemRenderers не создаются.

Чтобы продвигать это поведение, ваши ItemRenderers должны быть строго связаны своими данными, а любые индивидуальные изменения должны быть такими же обратимыми.

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

Или, чтобы быть более конкретным; наличие оператора if, который проверяет отрицательное значение и меняет фон на красный, недостаточно, если за ним не следует оператор else, который меняет фон на его цвет по умолчанию.

Так вот, я не изучил ваш код досконально, но, судя по описанному вами поведению, это было бы моим лучшим выбором. Надеюсь, это поможет вам или кому-то еще.

2 голосов
/ 06 июня 2011 
<?xml version="1.0" encoding="utf-8"?>
<s:MXTreeItemRenderer 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:states>
        <s:State name="normal" />            
        <s:State name="hovered" />
        <s:State name="selected" />
    </s:states>
    <s:HGroup left="0" right="0" top="0" bottom="0" verticalAlign="middle">
        <s:Rect id="indentationSpacer" width="{treeListData.indent}" percentHeight="100" alpha="0">
            <s:fill>
                <s:SolidColor color="0xFFFFFF" />
            </s:fill>
        </s:Rect>
        <s:Group id="disclosureGroup">
            <s:BitmapImage source="{treeListData.disclosureIcon}" visible="{treeListData.hasChildren}" />
        </s:Group>
        <s:BitmapImage source="{treeListData.icon}" />
        <s:Label id="labelField" text="{treeListData.label}" paddingTop="2"/>
    </s:HGroup>
</s:MXTreeItemRenderer>
...