Xamarin – Custom ListView Control

Kontynuując pisanie aplikacji do długów, zajmiemy się jej główną funkcjonalnością – listą. Standardowy ListView zdecydowanie mi nie odpowiada, bo chciałbym aby każdy element składał się z kilku napisów. Nic nie stoi na przeszkodzie utworzenia własnej kontrolki (jeśli ktoś pisał pod WPF / Windows Phone powinien kojarzyć motyw User Control, w Xamarin nazywa się to Custom Control).

Przygotowałem sobie reprezentację pojedynczego wpisu. Każda osoba na liście powinna posiadać takie informacje jak: kim jest, ile pieniążków mi wisi, kiedy pożyczała, (opcjonalny) komentarz na co, oraz czy na pewno jest mi winna, czy może to ja mam komuś oddać hajs?

Standardowy projekt Xamarin posiada wcześniej utworzony plik layoutu Main.axml. Potrzebujemy lekko go zmodyfikować, aby mieć dostęp do naszej listy. Bardzo ważne jest zrobienie Build’a po dodaniu nowych kontrolek do widoków. Dzięki temu będziemy się mogli później do nich odwołać w code behind poprzez np. Resources.Id.appDataListView.

Następnym etapem będzie dodanie nowego widoku – odpowiedzialnego za pojedynczy wiersz.

Poza XML’em widocznym poniżej, musimy stworzyć także 3 pozostałe TextView dla właściwości Amount, When i Comment. Nie chcę zaśmiecać posta kompletnym kodem pliku, dlatego zachęcam do odwiedzenia GIT’a z projektem. Dodatkowo ustawiam ID na LinearLayout, aby później pomalować go na zielono lub czerwono.

Cała magia zaczyna się tutaj. ListView potrzebuje adaptera, który powie mu jak ma się zachowywać. Dodajemy więc nową klasę, a po dziedziczeniu implementujemy standardowe abstrakcyjne metody, takie jak Count czy GetItemId.

Najważniejszą funkcją jest tutaj jednak GetView. To w tym miejscu wpisujemy odpowiednie dane do kontrolek. Jako że komentarz jest opcjonalny – ukrywam go jeśli nie jest wpisany. Na samym końcu ustawiam zielony lub czerwony kolor na całym wierszu.

Pozostało nam jedynie podpiąć przykładowe dane do naszej listy, aby sprawdzić czy wszystko działa. W tym miejscu można także nadać nazwę ‚aktywności’ (nie, jeszcze nie wiem co to znaczy).

Jestem zadowolony z efektu końcowego. Następnym etapem będzie nauka układania layoutu, ponieważ nazwa, kwota i data powinny być obok siebie w jednym rzędzie. Muszę się także nauczyć standardowych jednostek, takich jak np. textSize=”20sp”.