Utorak, 11. veljače, 2014. Komentiraj

MVVM Light Toolkit

MVVM Light Toolkit

MVVM Light Toolkit predstavlja skup alata koji su tu da vam pomognu i ubrzaju razvoj MVVM aplikacija za Windows Phone, Windows Store, WPF i Silverlight.

Od samih početaka razvoja korisničkih sučelja, razvijaju se oblikovni obrasci koje koristimo kao temelj, odnosno „blueprint“  za rješenje klasičnih problema. Kako razdvojiti korisničko sučelje od logike? Zašto bi uopće težili razdvajanju? Budući da razdvajanjem naše komponente nisu vezane uz specifično korisničko sučelje i vizualne elemente, omogućeno nam je lakše testiranje komponenti, komponente se mogu ponovno rabiti za upravljanje drugim korisničkim sučeljima, logički razdvajamo konceptualno različite dijelove, a naš kôd postaje prepoznatljiv i lakše shvatljiv drugim osobama koje su upoznate s obrascem.

Model-View-ViewModel

Model-View-ViewModel (MVVM) je oblikovni obrazac koji nam omogućuje da uspješno odvojimo logiku od prezentacije elemenata unutar XAML/C# aplikacija. Sastavne jedince obrasca su View, ViewModel i Model.

  • View – sadrži definiciju vizualnih elemenata koji se znaju prikazati korisniku. Ne sadrži nikakvu prezentacijsku logiku, sadržaj koji prikazuje dobiva od ViewModela preko mehanizma za povezivanje podataka (engl. databinding). Uz prikaz podataka, pojedini elementi na Viewu znaju reagirati na korisničke akcije, ali samo tako da obradu tih akcija delegiraju ViewModelu (odgovarajućem ICommand objektu). Primjerice, pritisak na gumb za spremanje podataka aktivira odgovarajuću naredbu unutar ViewModela.
  • ViewModel – model podataka za prikaz na Viewu. Sadrži ona svojstva i ponašanja koja se trebaju na neki način prezentirati na korisničkom sučelju. Putem mehanizma za povezivanje podataka, View spajamo na konkretna svojstva i ponašanja ViewModela te promjene na jednoj strani rezultiraju automatsku delegaciju promjene na drugoj. Budući da se View spaja na konkretna svojstva i akcije, ViewModel ne treba referencu na View.
  • Model – izvor podataka i ponašanja naše aplikacije. Svaki ViewModel dohvaća samo informacije i ponašanja bitne za njegovu svrhu.

 

MVVMKljučan dio obrasca je već spomenuti mehanizam povezivanja podataka.  Svaki ViewModel mora implementirati INotifyPropertyChanged ugovor koji omogućuje da u slučaju promjene nekog svojstva, vizualni element na korisničkom sučelju povezan s tim svojstvom može uloviti informaciju o promjeni te dobiti priliku da se izmjeni. Povezivanje podataka može biti dvosmjerno, tako da izmjene na korisničkom sučelju mogu delegirati promjene do ViewModela i obrnuto. Osim podataka, View može povezati svoje akcije s odgovarajućim akcijama na ViewModelu.

Uz MVVM, neki od poznatijih UI oblikovnih obrazaca su Model View Controller (MVC) i njegova varijanta Model View Presenter (MVP).

MVVM Light Toolkit

Glavna ideja ovog skupa alata je da se ubrza i olakša razvoj MVVM-a u XAML/C# projektima. Radi se o open source projektu raspoloživom na http://mvvmlight.codeplex.com/.  Kao i slične implementacije, MVVM Light nam pomaže da razdvojimo našu prezentaciju od modela što nam omogućava da pišemo kod koji se lakše održava i čita.

Pogodnosti koje nam MVVM Light Toolkit donosi:

  • ViewModelBase class – Implementacija bazne funkcionalnosti ViewModela. Implementira već spomenuti INotifyPropertyChanged ugovor koji nam omogućava da se propagiraju promjene na svojstvima do zainteresiranih strana. Svi ViewModeli trebaju naslijediti ovu klasu.
  • IsInDesignMode – Property unutar ViewModelBase klase koji nam daje mogućnost da definiramo različita ponašanja ovisno o stanju aplikacije. Primjerice, prilikom dizajniranja zgodno je vidjeti inicijalizirane elemente u kontrolama pa  možemo napuniti naše kolekcije dummy podacima kako bi unutar Visual Studija ili Blenda mogli vidjeti konkretne rezultate.
  • RelayCommand – Implementacija ICommand ugovora. U konstruktoru prima referencu na metodu koja se izvodi prilikom aktiviranja komande. Vizualni elementi mogu vezati svoje akcije na takve RelayCommand objekte unutar ViewModela. Primjerice, gumb može vezati svoju OnClick akciju na odgovarajući RelayCommand objekt koji će znati obraditi takav događaj.
  • DispatcherHelper class – static klasa preko koje možemo izvršiti određenu akciju direktno na UI dretvi metodom CheckBeginInvokeOnUI. Najčešći primjer korištenja je kada kod asinkronog poziva web servisa za dohvat podataka želimo iz strane dretve javiti korisničkom sučelju da su novi podaci u sustavu.
  • Messenger class – Klasa koja služi za komunikaciju različitih komponenti unutar aplikacije. Komponente se mogu registrirati na primanje određenih poruke. Kada se određen tip poruke generira u sustavu, registrirane strane će biti obaviještene. Messenger je zgodan kada događaj na jednom ViewModelu treba aktivirati određenu akciju na drugom udaljenom ViewModelu. Poruke mogu biti bilo što, od običnih primitiva do kompleksnih objekata. Radi se o zgodnoj funkcionalnosti koju treba razumno koristiti budući da kod lako postaje nečitljiv (dobro dokumentirati!).
  • Project templates – predložak za izradu MVVM projekata ugrađen u Visual Studio i Blend.
  •  Item templates – View, ViewModel predlošci ugrađeni unutar Visual Studija.

Ako smo vas zainteresirali, upute za instalaciju, iduće korake i dokumentaciju možete pronaći na službenom blogu autora http://www.galasoft.ch/mvvm/ .

 

 

 

Podijeli s prijateljima

Ostavite komentar

  1. Vaša e-mail adresa neće biti objavljena. Obavezna polja su označena s *
  2. Možete koristiti sljedeće HTML tagove i atribute: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Real Time Web Analytics