Debugowanie aplikacji w Silverlight 5 

Autor: Tomasz Kowalczyk

Opublikowano: 2012-08-13

Jest to kolejna część z cyklu artykułów, które przedstawiają możliwości Silverlight 5. Poniższy tekst pozwoli zapoznać się z jedną z najbardziej oczekiwanych możliwości najnowszego wydania Frameworka – XAML Debugging. Pod tą tajemniczą nazwą kryje się możliwość stawiania breakpointów w plikach z rozszerzeniem *.xaml, podczas debugowania aplikacji.

Po przeczytaniu tego artykułu dowiesz się:

• co to jest XAML Debugging,
• jak ustawiać breakpointy w plikach *.xaml.

Wprowadzenie

Po zapoznaniu się z poprzednim artykułem, zapewne każdy zabrał się z zapałem do pracy i zaczął testować nowe możliwości Bindingu, dostępne w Silverlight 5. Warto zaznaczyć, że w miarę zwiększania się stopnia zaawansowania projektów, mogą pojawić się błędy, które ciężko wykryć, gdyż związane są bezpośrednio z bindowaniem danych, ustawianych jako DataContext w tworzonej aplikacji.

W tej sytuacji, z pomocą przychodzi nam nowa funkcja, dostępna w Silverlight 5 – XAML Debugging, która pozwala stawiać break point, bezpośrednio w plikach *.xaml, i śledzić proces wykonywania instrukcji, tak jak podczas analizowania kodu, zawartego w plikach *.cs.

Implementacja

Aby w prosty sposób zobrazować działanie w/w funkcji, utworzona została klasa Webcast.cs, która pozwala powoływać obiekty opisujące Webcasty, dostępne na portalu channel9.msdn.com.

Kod źródłowy opisywanej klasy przedstawiony został poniżej:

public class Webcast
    {
        public string Description { get; set; }
        public DateTime ReleaseDate { get; set; }
        public Uri Link { get; set; }

        public Webcast(string description, DateTime releasedate, Uri link)
        {
            Description = description;
            ReleaseDate = releasedate;
            Link = link;
        }
    }

Zawiera ona trzy podstawowe atrybuty, opisujące pojedynczy Webcast, czyli:

• Description – opis Webcastu,
• ReleaseDate – data wydania,
• Link – adres Webcastu.

Następnie, w pliku MainPage.xaml.cs została przywołana metoda zdarzeniowa MainPage_Loaded, która uruchamiana w momencie wczytania strony głównej. W tej metodzie powołany został przykładowy obiekt Webcast, przypisany do DataContext strony:

public MainPage()
        {
            InitializeComponent();
            Loaded += new RoutedEventHandler(MainPage_Loaded);
        }

        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            this.DataContext =
                new Webcast("Advanced Features in Silverlight 5",
                            new DateTime(2011, 4, 14),
                            new Uri("https://channel9.msdn.com/Events/MIX/MIX11/MED12", UriKind.Absolute)
                    );
        }

Kolejnym krokiem jest odpowiednia definicja pliku MainPage.xaml, w którym skorzystano ze znanego już sposobu Bindingu danych do konkretnych kontrolek:

<StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Description}" />
            <TextBlock Name="txtReleaseDate" Text="{Binding ReleseDate}" />
            <HyperlinkButton Content="Watch the video" NavigateUri="{Binding Link}" TargetName="_blank" />
        </StackPanel>

Po uruchomieniu tak przygotowanej aplikacji, widać że uruchamia się ona poprawnie - Rys. 1. Pierwsze uruchomienie. Pojawia się natomiast pytanie, dlaczego nie jest wyświetlana data wydania Webcastu? Kompilator nie wyświetlił błędu, wszystko powinno więc być w porządku, jak się okazuje – nie do końca.

Rys. 1. Pierwsze uruchomienie.

Aby wyśledzić błąd, należy przejść do edycji pliku MainPage.xaml i ustawić breakpoint w linijce, w której należy spodziewać się nieprawidłowego działania:

<TextBlock Name="txtReleaseDate" Text="{Binding ReleseDate}" />

Należy uruchomić ponownie aplikację poprzez naciśnięcie klawisza F5. Następnie, trzeba dokładnie przeanalizować wiadomości, jakie wysyła kompilator, który sygnalizuje błąd, związany z niemożnością odnalezienia atrybutu definiującego datę wydania Webcastu - Rys. 2. Śledzenie błędu.

Rys. 2. Śledzenie błędu.

Po chwili zastanowienia zdajemy sobie sprawę z literówki popełnionej w pliku MainPage.xaml, dotyczącej nazwy atrybutu obiektu Webcast. Po poprawieniu nazwy i ponownym uruchomieniu projektu, błąd już nie pojawia się, a w przeglądarce widać pożądany efekt, przedstawiony na Rys. 3. Efekt końcowy.

Rys. 3. Efekt końcowy.

Powyższy przykład przedstawia praktyczne zastosowanie niezwykle przydatnej funkcji Silverlight 5 – XAML Debugging, dzięki której programista może teraz wyśledzić błędy, trudne do zlokalizowania we wcześniejszych wersjach.

Podsumowanie

W tym artykule dowiedzieliśmy się, jak korzystać z XAML – Debugging oraz poznaliśmy zalety, jakie wnosi ta funkcja podczas tworzenia oprogramowania w technologii Silverlight 5.

W następnym artykule omówione zostanie zagadnienie tworzenia grafiki 3D z wykorzystaniem XNA 3D API.