Tworzenie strategii dialogu przyjaznego MVVM

Próbuję stworzyć strategię obsługi popup forms do wykorzystania w dowolnej części mojej aplikacji. Jak na razie rozumiem, że będę potrzebował jednego UserControl w korzeniu mojego głównego okna. Będzie to związane z własnym ViewModel, który będzie obsługiwać wiadomości, które są wysyłane w aplikacji.

Używam MVVM Light i jestem całkiem nowy w klasie Messenger.

Wyobraź sobie scenariusz Master / Details, w którym lista obiektów a jest zawarta w ListBox. Wybranie jednej z tych pozycji i kliknięcie przycisku Edytuj spowoduje wyświetlenie UserControl, która obejmuje cały ekran. Użytkownik może edytować wybrany element i kliknąć OK, aby zatwierdzić zmianę.

Chcę, aby UserControl, który jest otwarty, był "ogólny" w taki sposób, że mogę rzucić na niego dowolną (prawdopodobnie ViewModel)... aby renderować model widoku za pomocą DataTemplate i obsłużyć wszystkie zmiany obiektu. Kliknięcie OK spowoduje wywołanie zwrotne do klasy wysyłającej i utrzyma zmianę tak jak wcześniej.

Niektóre sytuacje gdzie to by się przydało...

  1. wyświetlanie komunikatów o błędach bez wymaganego wejścia użytkownika (poza OK, aby je zamknąć)
  2. wyświetlanie formularza edycji dla pozycji danych
  3. okna dialogowe potwierdzenia (podobnie jak standardowy MessageBox)

Czy ktoś może podać jakieś próbki kodu, Jak mogę to osiągnąć?

Author: Kieren Johnstone, 2011-07-06

3 answers

Podczas projektowania interfejsu użytkownika z MVVM celem jest oddzielenie obaw widoku od obaw modelu widoku. Idealnie, model widoku nie powinien polegać na żadnych komponentach widoku. Jednak jest to idal i inną zasadą MVVM jest to, że powinieneś zaprojektować swoją aplikację zgodnie z życzeniem.

W obszarze oferującym usługę pokazującą okna dialogowe występują dwa różne podejścia:

  1. implementacja usługi DialogService w widoku (np. zobacz http://geekswithblogs.net/lbugnion/archive/2011/04/13/deep-dive-mvvm-samples-mix11-deepdivemvvm.aspx{[7]próbka 03).
  2. implementacja komponentu usługowego, który nie jest dołączony do widoku (np. Zobacz http://blog.roboblob.com/2010/01/19/modal-dialogs-with-mvvm-and-silverlight-4/)

Oba podejścia opierają się na interfejsie, który definiuje funkcjonalność usługi. Wdrożenie tej usługi jest następnie wtryskiwane do ViewModel.

Również, czy oba podejścia mają swoje specyficzne zalety i wady.

  • pierwsze podejście działa również dobrze dla WP7, jednak wymaga wspólnej klasy bazowej widoku, ponieważ zawiera ona implementację usługi widoku.
  • drugie podejście działa dobrze dla SilverLight i WPF i appleals, ponieważ utrzymuje usługę oddzielnie od widoku i nie nakłada żadnych restrykcji na widok.

Innym możliwym rozwiązaniem jest użycie wiadomości, aby wyświetlić okna dialogowe.

Niezależnie od używanego podejścia staraj się, aby Widok i model ViewModel nie były sprzężone za pomocą wzorca IOC (inversion of control), tzn. zdefiniuj interfejs tak, aby można było korzystać z różnych implementacji. Aby powiązać usługi z ViewModel należy użyć injection, tzn. przekazać usługę do konstruktora ViewModel lub ustawić właściwość.

 21
Author: AxelEckenberger,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-10-14 09:13:12

Ostatnio zacząłem uczyć się MVVM dla aplikacji WPF, którą tworzyłem, użyłem tego Artykuł jako podstawy do wyświetlania okien dialogowych, jeśli pobierasz przykładowy projekt, to jest to właściwie całkiem fajna metoda oddzielona od siebie, jest ładnie abstrakcyjna i aby uzyskać widok, przekazujesz instancję viewmodel. Rozszerzyłem go nieco na własne środki, użyłem również MessageBox WPFExtendedToolkit dla ostrzeżeń, błędów itp, ponieważ standardowy MessageBox win32 jest fugly.

W odniesieniu do form dynamicznych następnie będziesz chciał zbadać ItemsControl, a w Twoim widoku modele mają zbiór pozycji danych, które muszą być edytowane przez użytkownika, aby ItemsControl był związany z. Mam okno dialogowe do edycji akcji i ich parametrów w systemie workflow designer, gdzie lista dialogowa akcji była całkowicie dynamiczna. Zostało to zrobione przez wystawienie kolekcji moich elementów z ich typów danych, więc mogłem następnie użyć DataTemplateSelector, aby wybrać DataTemplates, które zawierały odpowiednie typy kontrolki, np. datatype DateTime pokazywały DatePicker.

Hope That Helps

 7
Author: Paulie Waulie,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-07-06 11:17:35

Z punktu widzenia programisty wchodzącego do "utrzymania" tego generycznego kodu, brzmi to jak ból. Z tego, co opisałeś, nadałbym formularzowi i dialogowi ten sam model widoku i stworzył konkretny szablon XAML dla okna dialogowego, które chcesz pokazać.

 2
Author: Ritch Melton,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-07-06 11:25:35