Как переключаться между вертикалью и макетом плитки в Flex 4.5 - PullRequest
Новая
       0

Как переключаться между вертикалью и макетом плитки в Flex 4.5

2 голосов
/ 01 сентября 2011

Мне нужно иметь список искр, который переключается между VerticalLayout и TileLayout в зависимости от выбора пользователя. Наиболее очевидным способом является создание двух списков с отдельными макетами, а затем использование состояний и атрибута «includeIn». Тем не менее, это не очень хорошее решение, потому что я хотел бы сохранить те же элементы в представлении при переключении (если пользователь выделил элемент 100 в VerticalLayout, а затем переключился на Tile, я бы хотел, чтобы элемент 100 был сразу виден в новый макет, вместо того, чтобы начинать с первого элемента).

Поэтому я попытался использовать 2 макета в одном списке и использовать решение «includeIn». Тем не менее, я получаю эту ошибку:

"В инициализаторе для« макета »несколько значений инициализатора для цели Тип spark.layouts.supportClasses.LayoutBase. "

Вот исходный код, который генерирует эту ошибку, кто-нибудь может предложить лучший способ сделать это? 

<?xml version="1.0" encoding="utf-8"?>
<s:View 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"
    >

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            [Bindable]
            public var myAC:ArrayCollection = new ArrayCollection([
                "01","02","03","04","05","06","07","08","09","10",
                "11","12","13","14","15","16","17","18","19","20",
                "21","22","23","24","25","26","27","28","29","30",
                "31","32","33","34","35","36","37","38","39","40",
                "41","42","43","44","45","46","47","48","49","50"
            ]);

            public function toggleListTileState():void
            {
                if(currentState=="ListState") currentState = "TileState"
                else currentState = "ListState";
            }
        ]]>    
    </fx:Script>

    <s:actionContent>
        <s:Button label="tile" label.TileState="list" click="toggleListTileState()"/>
    </s:actionContent>  

    <s:states> 
        <s:State name="ListState" /> 
        <s:State name="TileState" /> 
    </s:states>

    <s:List
        id="list"
        width="100%"
        height="100%"
        dataProvider="{myAC}"
        >
        <s:layout>
            <s:VerticalLayout
                includeIn="ListState"
                horizontalAlign="justify"
                useVirtualLayout="true"
                />

            <s:TileLayout
                includeIn="TileState"
                rowHeight="300"
                useVirtualLayout="true"
                />
        </s:layout>
    </s:List>

</s:View>

Спасибо

Ответы [ 2 ]

6 голосов
/ 01 сентября 2011

Вы были почти там. Вы можете сделать именно то, что вы пытались, вы просто должны написать это немного по-другому. Примерно так: 

<s:List id="list" width="100%" height="100%" dataProvider="{myAC}">
    <s:layout.ListState>
        <s:VerticalLayout horizontalAlign="justify" useVirtualLayout="true" />
    </s:layout.ListState>
    <s:layout.TileState>
        <s:TileLayout rowHeight="300" useVirtualLayout="true" />
    </s:layout.TileState>
</s:List>

Когда вы думаете об этом, это точно такой же способ записи зависимых от состояния свойств, как в этом примере: 

<s:List id="list" width.ListState="100" width.TileState="200" />

Единственное отличие состоит в том, что свойство записывается как тег (M) XML, а не как атрибут (M) XML.

2 голосов
/ 01 сентября 2011

В качестве альтернативы, вы можете объявить свои макеты с идентификаторами в части объявления вашего MXML и ссылаться на эти идентификаторы вместо того, чтобы объявлять их встроенными: 

<fx:Declarations>
    <s:VerticalLayout id="verticalLayout" horizontalAlign="justify" useVirtualLayout="true" />
    <s:TileLayout id="tileLayout" rowHeight="300" useVirtualLayout="true" />
</fx:Declarations>

<s:List id="list" 
    width="100%" height="100%" 
    dataProvider="{myAC}" 
    layout.ListState="{verticalLayout}" layout.TileState="{tileLayout}" />
...