NEXT 4/2008 - Szablony .NET

Konstrukcje szablonów umożliwiają zmianę wyglądu kontrolek w prosty i uniwersalny sposób. Dzięki nim możesz także zaprezentować dane pobierane z różnych źródeł danych. Z artykułu dowiesz się, jak to zrobić.

Odkąd programowanie wizualne stało się jednym z najważniejszych metod tworzenia aplikacji komputerowych, programiści łatwiej mogą konstruować aplikacje, które oprócz wielu funkcji mają intuicyjny interfejs. Niestety, począwszy od systemu Windows 95 aż do wydania .NET Framework 3.0, zestaw standardowych kontrolek znajdujących się w bibliotekach systemowych (np. MFC – Microsoft Foundation Classes czy VCL – Visual Component Library), które programista mógł wykorzystać, nie ulegał zmianie. Zapewne wielu użytkowników pamięta nudne, szare przyciski, białe pola tekstowe, listy czy pola typu kombo. .NET 3.0 wprowadza w tej materii interesujące innowacje.

Do przydatnych i atrakcyjnych wizualnie nowości można zaliczyć właściwość Opacity. Przechowuje ona liczbę z zakresu (0;1), która określa stopień przezroczystości. Jeśli zależy ci na zachowaniu bardziej tradycyjnego wyglądu, ale potrzebujesz oryginalnego dodatku do zwykłej kontrolki, wystarczy użyć opcji Bitmap- Effect. Dzięki niej możesz wykorzystać efekty znane z Photoshopa (wytłoczenie, rzucanie cienia, świecące obramowanie), dostępne z panelu Properties. Szablony bez wątpienia przydadzą się twórcom multimedialnych aplikacji, mających zainteresować użytkowników swoim wyglądem. Tworzenie oryginalnych interfejsów nie wymaga już tak głębokich ingerencji w Windows API (zestaw funkcji systemu Windows).

Nowe szaty kontrolki

Początkowo może się wydawać, że szablony nie wprowadzają niczego nowego do projektowania interfejsu. Pomysł na tworzenie własnych kontrolek i urozmaicanie ich pod względem wyglądu także nie jest nowy. Taką możliwość oferowało praktycznie każde środowisko typu RAD (np. Borland Delphi). Mimo to rozwiązanie wprowadzone w WPF (Windows Presentation Foundation) diametralnie zmienia podejście do tego zagadnienia. Do tej pory zaprojektowanie nowego wyglądu wymagało tworzenia nowej klasy-kontrolki. Natomiast w szablonie wystarczy przypisanie do jednej z właściwości (Template), którą chcesz zmienić, odpowiedniej zawartości (czyli omawianej w dalszej części artykułu treści szablonu). Stosowny kod XAML (patrz: NEXT 1/2008, str. 136) musi spełniać pewne założenia, między innymi musi on być obiektem klasy ControlTemplate. Nie jest to jednak w żadnym stopniu ograniczenie, bo szablon możesz skonstruować w bardzo prosty sposób. Przykładowy kod mógłby wyglądać tak:

<DockPanel LastChildFill=”False”
VerticalAlignment=”Center”
HorizontalAlignment=”Center”>
<Button Content="przycisk"
Width="60" Height="60"/>
<Button Content="przycisk"
FontSize="14">
<Button.Template>
<ControlTemplate TargetType="Button">
<BulletDecorator Background="Red"
VerticalAlignment="Center"" >
<BulletDecorator.Bullet>
<Ellipse Fill="Green" Width="2510"
Height="2510"/>
</BulletDecorator.Bullet>
<BulletDecorator.Child>
<ContentPresenter/>
</BulletDecorator.Child>
</BulletDecorator></ControlTemplate>
</Button.Template>
</Button>
</DockPanel>


Efekt uzyskany za pomocą tego kodu wygląda tak:

Najważniejszą rolę w zaprezentowanym kodzie pełni wspomniana wcześniej klasa ControlTemplate. Celem jest zastąpienie przycisku obiektem klasy BulletDecorator. Jej zadaniem jest przechowywanie dwóch elementów: niedużego obiektu (bulletu) i właściwej treści. W kodzie bulletem jest małe zielone kółko, zaś treść jest pobierana z przycisku. Do tego celu służy obiekt ContentPresenter. Dla kontrolek wywodzących się z klasy ContentControl, takich jak Button, pozwala on na zdefiniowanie miejsca, w którym zostanie wstawiona treść. Pozostałe elementy kodu, np. pojemnik DockPanel, mają za zadanie lepiej zaprezentować efekt końcowy i nie są konieczne w konstrukcji szablonu.

Szablon prezentuje się dosyć interesująco, ale cechuje go brak elastyczności. Określenie jakichkolwiek właściwości przycisku nie wpłynie bowiem na zmianę szablonu. Dzięki wiązaniu szablonów, czyli dynamicznemu rozszerzeniu TemplateBinding, można pobrać wartości właściwości z macierzystych kontrolek. Zmień w powyższym kodzie odpowiednie instrukcje:

<Button Background=”Yellow” Content=”przycisk”>

oraz

<BulletDecorator Background=”{TemplateBinding Background}” >

W ten sposób możesz ustawiać także inne właściwości, np. szerokość lub wysokość elementów szablonu.

Ocena:    (aby ocenić, musisz się zalogować w serwisie)

 del.icio.us |  Wykop mnie |  Digg this story |  dodajdo.com

• Kuźnia źródeł »
  SOURCEFORGE.NET
• Mapa na twojej witrynie »
  możliwości Google Maps API
• Cichy jak dysk »
  wyciszanie dysków twardych
• Dwa w jednym »
  uruchamianie Visty i XP na jednym komputerze
• Panorama 3D »
  prezentacja zdjęć w internecie