[WPF] Caliburn.Micro: Window Manager

Window Manager, jak nazwa wskazuje, służy do zarządzania trzema rodzajami okienek. Serwis ten dodawany jest do kontenera IoC w bootstrapperze przy zainstalowaniu Caliburna w naszym projekcie. Dostępne rodzaje okienek to:

• Window - niezależne osobne okno z paskiem do zamykania, minimalizowania itd.
• Popup - nie blokuje okna - rodzica, brak paska do zamykania
• Dialog - blokuje okno - rodzic, dostępny pasek do zamykania

Każde osobne okienko powinno być osobnym widokiem z własnym ViewModelem. W ViewModelu można obsłużyć zdarzenie zamknięcia okienka.

public class PopupPersonViewModel : Screen
{
    public Person Entity { get; set; }

    public PopupPersonViewModel(Person person)
    {
        Entity = person;
    }

    public override void TryClose(bool? dialogResult)
    {
        IoC.Get<IEventAggregator>().Publish(new PersonUpdatedMessage(){Entity = Entity});
        base.TryClose(dialogResult);
    }
}

Samo otwarcie okna jest bardzo proste:

public void OpenWindow()
{
    dynamic settings = new ExpandoObject();
    settings.WindowStartupLocation = WindowStartupLocation.Manual;
    _windowManager.ShowWindow(new PopupPersonViewModel(Entity), null, settings);
}

[HTML|JS|CSS] jQuery : Zdarzenia

Korzystając z biblioteki jQuery, programista ma do dyspozycji zdarzenia JavaScript, ale nie musi się do nich dowiązywać w kodzie HTML. Cała obsługa zdarzeń realizowana jest w pliku .js. Dzięki selektorom programista może dowiązać się do wielu zdarzeń za pomocą jednego selektora.

Zdarzenia można pogrupować w 4 kategorie.

• Zdarzenia dokumentu (okna)

//po zaladowaniu dokumentu HTML
$(document).ready(function(){
   console.log('event ready');
 });
//po zaladowaniu wszystkich zasobow
$(window).load(function(){
   console.log('event load');
 });
//po zamknieciu okna przegladarki 
//lub przejsciu do nowej strony 
//za posrednictwem paska adresu lub odnosnika
$(window).bind('unload', function(){
   console.log('event unload');
 });
//zmiana rozmiaru okna
$(window).bind('resize', function(){
   console.log('event resize');
 });
//po scrollowaniu
$(document).scroll(function(){
   console.log('event scroll');
 });

• Zdarzenia myszy

$(document).ready(function(){
   console.log('event ready');

   //MOUSE EVENTS

   $('.events').click(function(){
 console.log('event click');
 });

   $('.events').bind('dblclick', function(){
    console.log('event dblclick');
 });

   $('.events').bind('mousedown', function(){
    console.log('event mousedown');
 });

   $('.events').bind('mouseup', function(){
    console.log('event mouseup');
 });

   $('.events').bind('mouseenter', function(){
    console.log('event mouseenter');
 });

   $('.events').bind('mouseleave', function(){
    console.log('event mouseleave');
 });

   $('.events').bind('mousemove', function(){
    console.log('event mousemove');
 });
   //usuniecie kursora myszy z okreslonego elementu
   //i jego elementu nadrzednego
   $('.events').bind('mouseout', function(){
    console.log('event mouseout');
 });
   //umieszczenie kursora myszy w obrebie 
   //okreslonego elementu i jego elementu nadrzednego
   $('.events').bind('mouseover', function(){
    console.log('event mouseover');
 });

 });

• Zdarzenia formularzy

$(document).ready(function(){
   console.log('event ready');

   //FORM EVENTS

   //edytowanie zawartosci
   $('.myform').bind('change', function(){
    console.log('event change');
 });
   //aktywowanie za pomoca Tab lub zaznaczenia
   $('.myform').bind('focus', function(){
    console.log('event focus');
 });
   //dezaktywowanie na rzecz innego elementu
   $('.myform').bind('blur', function(){
    console.log('event blur');
 });
   //zaznaczenie tekstu wewnatrz formularza
   $('.myform').bind('select', function(){
    console.log('event select');
 });
   //po zatwierdzeniu formularza elementem input
   //o typie submit 
   $('.myform').bind('submit', function(){
    console.log('event submit');
 });
   //po zatwierdzeniu formularza elementem input
   //o typie reset 
   $('.myform').bind('reset', function(){
    console.log('event reset');
 });

 });

• Zdarzenia klawiatury

$(document).ready(function(){   

   //KEYBOARD EVENTS

   //nacisniecie klawisza
   $('.myform').bind('keydown', function(){
    console.log('event keydown');
 });

   //jednokrotne lub wielokrotne nacisniecie
   $('.myform').bind('keypress', function(){
    console.log('event keypress');
 });

   //zwolnienie klawisza
   $('.myform').bind('keyup', function(){
    console.log('event keyup');
 });
 });

[WPF] Aplikacje wykorzystujące NavigationWindow

WPF wspiera tworzenie aplikacji, które przypominają strony internetowe, a więc takich, gdzie możemy przechodzić między stronami, lub wracać do poprzednio odwiedzonych. Komponentem, który wspiera takie zachowanie jest Page. Strony mogą być osadzane w dwóch kontenerach : Navigation Window oraz Frame. Zachowują się one podobnie, z tą różnicą, że NavigationWindow zawiera pasek do nawigacji. Aby rozpocząć, zamiast obiektu typu Window w App.xaml jako StartupUri podajemy obiekt typu Navigation Window. W samym NavigationWindow w xaml podajemy jako Source URI do startowej strony, np. Source="FirstPage". Wewnątrz strony można zwyczajnie, jak w UserControl układać kontrolki wewnątrz grida, należy jedynie mieć świadomość o braku zdarzeń OnClosed i OnClosing.

<NavigationWindow x:Class="Navigation_Based_Applications.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Source="MainPage.xaml" Height="350" Width="525">
   
</NavigationWindow>

Pomiędzy stronami można przechodzić, korzystając z metody Navigate klasy NavigationService.

this.NavigationService.Navigate(new SecondPage());

Przechodzić można nie tylko do kontrolek typu Page, ale także do stron www, podając adres jako Uri :

this.NavigationService.Navigate(new Uri("http://www.codeproject.com"));

W efekcie uaktywni nam się pasek nawigacji w NavigationWindow. Będziemy mogli przechodzić do przodu / do tyłu, lub wybrać jedną z odwiedzonych stron z listy. Przechodzić do przodu i do tyłu można również z poziomu kodu, za pomocą metod:

            this.NavigationService.GoBack();
            this.NavigationService.GoForward();
        

Aby uniknąć wyjątku należy sprawdzić, czy okno ma gdzie nawigować (properties CanGoBack i CanGoForward z NavigationService).