FlexPaginator Released! ;)

Chyba każdy programista zetknął się z problemem paginacji czy to na tworzonej przez siebie stronie internetowej, czy też(jak w moim przypadku) w aplikacji flex-owej.
W rozwiązaniach tworzonych w pracy zazwyczaj duże ilości danych prezentowałem za pomocą kontrolki DataGrid w połączeniu z paginatorem udostępnionym pod adresem – link. Jednak wciąż rosnąca ich ilość szybko sprawiła, że wygrzebana w czeluściach internetu kontrolka przestała spełniać oczekiwania. Postanowiłem zmierzyć się z paginacją i stworzyć samodzielnie komponent, który znacznie ułatwił by, a w szczególności przyśpieszył poruszanie się po tysiącach stron udostępnianych danych. Właściwie żeby być szczerym do rozpoczęcia pracy nad kontrolką zachęcił mnie Redliquid, a jej obecny wygląd-funkcjonalność jest w 100% jego pomysłem. :) Zaprezentowany flex-paginator jest zbudowany jeszcze na bazie kontrolek udostępnianych we Flex-ie 3 – planuję jednak jego dalszy rozwój, a więc poprawę wszelkich znalezionych błędów ;), a przy odrobinie większej ilości wolnego czasu przepisanie całości z wykorzystaniem dobrodziejstw Flex-a 4.

Diabeł tkwi w szczegółach, a więc poniżej prezentuję opis kilku najważniejszych opcji FlexPaginator-a.

Do pliku swc paginatora niezbędne jest dołączenie pliku css o nazwie StyleButtons.css, który odpowiada za wygląd wszystkich przycisków. Najważniejsze właściwości paginatora, które powinny zostać ustawione
w kodzie ActionScript lub po stronie mxml-a to:

  • totaItems – ilość wszystkich elementów
  • itemsPerPage – ilość elementów wyświetlanych na stronie
  • pageToDisplay – ilość wyświetlonych przycisków z numerami stron – ustawienie parzystej liczby wyświetlanych stron, skutkuję zamianę jej na nieparzystą ich ilość (takie „zachowanie” wynika z działania paginatora)

Opcjonalna jest natomiast właściwość:

  • selectedPage – numer zaznaczonej strony, po utworzeniu kontrolki domyślnie zostaje zanaczona środkowa strona/przycisk spośród aktualnie wyświetlonych.

Moja kontrolka paginacji zawiera przyciski umożliwiające odpowiednio:

  • skok o jedną stronę do przodu lub do tyłu
  • skok o wybraną ilość stron – wartości w wyświetlonym menu są wygenerowane automatycznie, ta para przycisków pojawia się tylko w przypadku gdy całkowita ilość stron przekracza 50.
  • skok na koniec i początek.

Dodatkowo obsługa zdarzenia „selectedPageChanged” daje możliwość odczytu aktualnie zaznaczonej strony. Wygenerowany paginator wyświetla nieparzystą liczbę stron,
a aktualnie zanaczony numer strony jest podkreślony

Przykładowy kod z zaznaczoną stroną nr 3 oraz plik css odpowiadający za poniższy wygląd paginatora pod linkiem

Wszelkiego rodzaju błędy, sugestię co mogę poprawić lub co zrobiłem tragicznie proszę zgłaszać na code-google (gdzie udostępnie kod projektu oraz plik swc – zakładka Download) lub w komentarzach pod tym czy też kolejnymi wpisami dotyczącymi FlexPaginator-a. ;)

  1. Na razie brak komentarzy.

  1. Na razie brak trackbacków