Ordenar los elementos de un ArrayCollection en Flex
En el siguiente tip mostraré como ordenar un ArrayCollection en Flex. Esto nos puede ser necesario a la hora de mostrar su contenido. Para mostrar esto utilizaré como ejemplo los resultados (hasta este momento) de las votaciones de los premios Cristalab 2008.
Supongamos que tenemos este ArrayCollection:
- public var premioPopular:ArrayCollection = new ArrayCollection([
- {claber: "Eldervaz", votos: 6},
- {claber: "Freddie", votos: 13},
- {claber: "XKlibur", votos: 3},
- {claber: "TheParrot", votos: 7},
- {claber: "M@U", votos: 1},
- {claber: "Mariux", votos: 4},
- {claber: "JaLeRu", votos: 1},
- {claber: "Pley", votos: 1},
- ]);
Y asignamos este ArrayCollection a un componente PieChart para mostrar los resultados:
- <mx:VBox width="25%" horizontalCenter="0" verticalCenter="0">
- <mx:Label text="Claber más Popular" fontWeight="bold" fontSize="18"/>
- <mx:HBox width="100%" height="100%">
- <mx:Legend id="legend1" dataProvider="{pie1}"/>
- <mx:PieChart id="pie1" dataProvider="{premioPopular}" showDataTips="true" width="150" height="150">
- <mx:series>
- <mx:PieSeries field="votos" nameField="claber"/>
- </mx:series>
- </mx:PieChart>
- </mx:HBox>
- </mx:VBox>
Daría este resultado:
Como podemos ver, los resultados aparecen en el orden en que están colocados dentro del ArrayCollection. Pero de esta manera en el Legend no sabemos quien es el que obtuvo más votos.
En este caso podríamos haber ordenado el ArrayCollection manualmente, pero para casos más complejos nos resultaría más fácil ordenarlo por código. Para ello utilizaremos la clase SortField y la clase Sort.
Crearemos una instancia de la clase SortField, y le pasaremos como propiedad el nombre del parámetro que queremos ordenar del ArrayCollection. También indicaremos si el parámetro a ordenar es un dato numérico o no.
- var sortField:SortField = new SortField();
- sortField.name = "votos";
- sortField.numeric = true;
También crearemos una instancia de la clase Sort y le pasaremos referencia del objeto SortField creado. Aqui ejecutaremos el método reverse() para que la ordenación de elementos sea de mayor a menor (por defecto es de nemor a mayor).
- var sort:Sort = new Sort();
- sort.fields = [sortField];
- sort.reverse();
Ahora pasaremos este objeto al ArrayCollection, y ejecutaremos el método refresh() que hará que el Array se ordene segun los parámetros indicados.
- premioPopular.sort = sort;
- premioPopular.refresh();
Este es es resultado:
Compártelo:
Visto 9.789 veces
Mmm… Los objetos SWF están embebidos en un tamaño mas pequeño o algo, porque salen las barras de desplazamiento U_U
Muy sencillo y práctico
Fíjate que me senté a ver tu tutorial (Por cierto muy útil) y me encontré con mi Nick. No sabia que alguien había votado por mi en los premios Clab. :O