Как создать несколько событий в одном списке во Flex?

Question

Может кто-нибудь показать пример того, как создать несколько событий смены представлений в одном списке в flex?

Я хочу, чтобы каждый элемент в списке превратился в совершенно уникальный файл представления. Вместо 10 элементов в списке все переходят в 1 новое представление, но с разной информацией генерируется, я хочу 10 различных видов, по 1 на элемент в списке.

Я не могу найти примеров того, как это сделать, и я пытался сделать это какое-то время. Это для мобильного приложения. Спасибо!

<fx:Script>
<![CDATA[
import spark.events.IndexChangeEvent;
protected function myList_changeHandler(event:IndexChangeEvent):void {
navigator.pushView(views.EmployeeView,myList.selectedItem);
}
protected function myList2_changeHandler(event:IndexChangeEvent):void {
navigator.pushView(views.EmployeeView2,myList.selectedItem);
}
protected function myList3_changeHandler(event:IndexChangeEvent):void {
navigator.pushView(views.EmployeeView3,myList.selectedItem);
}           
]]>
</fx:Script>

<s:List width="100%" height="100%" labelField="firstName">
<s:ArrayCollection>
<fx:Object id="myList" change="myList_changeHandler(event)" firstName="Bill"/>
<fx:Object id="myList2" change="myList2_changeHandler(event)" firstName="Dave"/>
<fx:Object id="myList3" change="myList3_changeHandler(event)" firstName="Mary"/>
</s:ArrayCollection>
</s:List>

Answer 1

Вам не хватает нескольких вещей здесь. Во-первых, вам нужно прослушать событие изменения в компоненте List:

<s:List id="myList" width="100%" height="100%" labelField="firstName" change="myListChange(event)">

Далее необходимо создать метод для изменения вида:

protected function myListChange( event:IndexChangeEvent ):void
{
    var newView:Class;

    // You can decide a different view based on the newIndex property of the event
    // There could be many better ways than a switch statement - this is for brevity
    switch ( event.newIndex )
    {
        case 0:
            newView = EmployeeView0;
            break;
        case 1:
            newView = EmployeeView1;
            break;
        default:
            newView = OtherEmployeeView;
            break;
    }

    navigator.pushView(newView,myList.selectedItem);
}