Aplikacje cross-platform w Xamarin z MvvmCross
Przewodnik po MvvmCross: jak tworzyć utrzymywalne i testowalne aplikacje mobilne w Xamarin. Architektura (PCL + projekty natywne), App, Setup, ViewModel, DI, wiązania, nawigacja i widoki dla Android i iOS.
Mateusz Kopta
Dlaczego warto wybrać MvvmCross
Budując mobilne aplikacje w Xamarin, można łączyć różne podejścia do współdzielenia kodu (Shared Project lub Portable Class Library). Zamiast składać architekturę od zera, praktyczniej jest sięgnąć po sprawdzony framework. Wśród popularnych rozwiązań, takich jak Xamarin.Forms, ReactiveUI, FreshMvvm i Prism, MvvmCross wyróżnia się dobrym kompromisem między wysoką jakością UX a dużym procentem współdzielonego kodu.
MvvmCross dostarcza strukturę projektu, mechanizmy działania, zestaw bibliotek, komponentów i pluginów, co znacząco przyspiesza rozwój i ułatwia testowanie.
Czym jest MvvmCross
MvvmCross to framework do tworzenia aplikacji cross-platform zgodnych z wzorcem MVVM (Model-View-ViewModel). Wspiera wiele typów projektów .NET:
- Xamarin.Android - Xamarin.iOS - Xamarin.Mac - WinRT (Windows 8.1, Windows Phone 8.1) - Universal Windows Platform (UWP) - Windows Presentation Foundation (WPF)
Dodatkowo oferuje mechanizmy data binding także dla platform korzystających natywnie z modelu MVC.
Architektura rozwiązania w MvvmCross
Typowa aplikacja składa się z dwóch części:
- Część wspólna (PCL): zawiera ViewModel-e, modele oraz interfejsy usług specyficznych dla platform. To tutaj mieszkają logika biznesowa, dostęp do bazy i warstwa komunikacji z usługami sieciowymi.
- Projekty natywne dla każdej platformy: dostarczają interfejs użytkownika oraz implementacje usług platformowych zdefiniowanych w interfejsach PCL.
Dobrą praktyką jest dodanie dodatkowej biblioteki PCL, aby oddzielić logikę biznesową od warstwy dostępu do danych. Zakres współdzielonego kodu zależy od rodzaju aplikacji: im więcej korzystasz z natywnego API, tym mniej kodu przeniesiesz. W biznesowych aplikacjach często da się współdzielić 70–80% rozwiązania.
Jak zacząć
- Utwórz rozwiązanie z co najmniej jedną biblioteką PCL i projektem natywnym dla każdej wspieranej platformy. - Dodaj do wszystkich projektów pakiet NuGet MvvmCross Starter Pack. - Wykonaj podstawowe kroki konfiguracyjne opisane w plikach w katalogu ToDo-MvvmCross. - Dokumentacja i materiały wideo są dostępne na GitHub.
Najważniejsze elementy frameworka
App
W każdej aplikacji istnieje jedna klasa App dziedzicząca po MvxApplication. W metodzie Initialize rejestrujesz typy i wskazujesz punkt startowy aplikacji (RegisterAppStart z docelowym ViewModel-em). Do rejestracji zależności służy kontener Mvx, który udostępnia m.in. metody do rejestracji singletonów i fabryk dla interfejsów.
Setup
Klasa Setup działa jak bootstrapper i znajduje się w każdym projekcie natywnym. Na Androidzie dziedziczy po MvxAndroidSetup. Jej zadania to utworzenie instancji App oraz dopasowanie frameworka do specyfiki platformy. W Setup rejestrujesz usługi platformowe poprzez Mvx.RegisterType, nadpisujesz metody inicjalizujące i, w razie potrzeby, konfigurujesz śledzenie błędów i logowanie (CreateDebugTrace). Dzięki Inversion of Control ViewModel-e mogą korzystać z natywnych funkcji bez łamania separacji warstw.
ViewModel
ViewModel to miejsce na stan i zachowania widoku. Baza MvxViewModel implementuje INotifyPropertyChanged i INotifyCollectionChanged oraz dostarcza metody SetProperty i RaisePropertyChanged, aby automatycznie odświeżać UI po zmianach danych. Komendy tworzy się zwykle przez MvxCommand. Do nawigacji między ekranami służy ShowViewModel. Zależności (np. repozytoria) są wstrzykiwane automatycznie przez kontener Mvx zgodnie z zarejestrowanymi interfejsami.
Własności, komendy i nawigacja
- Własności ViewModel-a zgłaszają zmiany przez RaisePropertyChanged, co aktualizuje powiązane elementy UI. - Komendy MvxCommand kapsułkują akcje użytkownika i reguły ich dostępności. - Metody nawigacyjne (np. ShowViewModel) upraszczają przechodzenie między ekranami, przekazywanie parametrów i zarządzanie cyklem życia widoków.
Definiowanie interfejsu użytkownika
Na Windows (WPF, WinRT, UWP) data binding jest natywnym elementem platformy, więc widoki tworzy się zgodnie z domyślnymi praktykami tych środowisk.
Na Android i iOS, gdzie dominuje MVC, MvvmCross dostarcza warstwę wiązań, która łączy ViewModel z widokiem bez nadmiernej logiki w kontrolerach i aktywnościach.
- Android: korzystasz z MvxActivity lub MvxFragment, a powiązania definiujesz w XML/AXML lub w kodzie przez BindingSet. - iOS: używasz MvxViewController lub MvxTableViewController, a powiązania konfigurujesz przez Fluent Binding API lub poprzez łączenie outletów z właściwościami ViewModel-a.
Dzięki temu zachowujesz czysty podział odpowiedzialności: logika prezentacji pozostaje w ViewModel-ach, a widoki skupiają się na renderowaniu i obsłudze cyklu życia.
Pluginy i rozszerzenia
MvvmCross oferuje bogaty ekosystem pluginów (np. do nawigacji, wiadomości, lokalizacji, dialogów czy konwersji wartości). Pozwalają one szybko dodać wspólne funkcje bez pisania duplikatów kodu dla każdej platformy.
Dobre praktyki projektowe
- Oddziel logikę biznesową od warstwy dostępu do danych w osobnych bibliotekach PCL. - Definiuj kontrakty jako interfejsy w części wspólnej, a implementacje dostarczaj w projektach natywnych. - Minimalizuj logikę w widokach i kontrolerach; trzymaj ją w ViewModel-ach. - Stosuj wstrzykiwanie zależności przez kontener Mvx, aby ułatwić testowanie jednostkowe. - Projektuj ViewModel-e tak, by były niezależne od platformy i łatwe do mockowania.
Podsumowanie
MvvmCross ułatwia tworzenie nowoczesnych, testowalnych i utrzymywalnych aplikacji cross-platform w Xamarin. Jasna struktura (App, Setup, ViewModel), kontener DI Mvx, mechanizmy wiązań oraz gotowe pluginy pozwalają szybko budować rozwiązania z wysokiej jakości UX przy dużym współdzieleniu kodu między platformami.
Potrzebujesz wsparcia technologicznego?
Porozmawiajmy o Twoim projekcie — od discovery po wdrożenie.
Umów konsultacjęChcesz wiedzieć więcej?
Sprawdź inne artykuły lub porozmawiajmy o Twoim projekcie
Wszystkie artykuły Zaprojektujmy Twoją aplikację AI