Silverlight'a Giriş

MS Visual Studio 2010 ile Silverlight Uygulamasına Kısa Bir Giriş

Silverlight uygulamamıza MS Visual Studio 2010 ile başlayalım. Menüden File->New Project’i seçtikten sonra açılan ekranda Visual C# sekmesinin altında Silverlight alt menüsüne tıklayalım, buradan “Silverlight Application” ı seçip uygulamamıza ismini verdikten sonra “OK” butonuna tıklayınız.

Açılan diğer ekranda Proje tipi ve Silverlight için hangi versiyonu kullanacağınız seçtikten sonra devam edebilirsiniz. MVC tasarım örüntüsünden (design pattern) haberdarsanız “ASP.NET MVC Web Project” seçmenizi tavsiye edeceğim. MVC tasarım örüntüsünü bilmiyorsanız şimdilik “ASP.NET Web Application Project” proje tipini seçmenizi öneririm.

Projemiz iki farklı dizinde aşağıdaki gibi oluşturuldu. Projemiz Silverlight istemci uygulaması (client application) ve ASP.NET web sunucu uygulamasını (web server application) içermektedir. Visual Studio ile projeyi derleyince, VS otomatik olarak derlenmiş Silverlight uygulamasını web server uygulamasının içine atmaktadır.

Yukarıda da görüldüğü üzere Silverlight uygulaması Page.xaml ve App.xaml dosyalarını ve arka planda bunlarla ilişkin C# (VB, Ruby veya Python da olabilir) dosyalarını oluşturmaktadır.

XAML, Silverlight uygulamasının kullanıcı arayüz (UI) tanımlamasını deklare eden XML tabanlı bir dosyadır. App.xaml dosyası uygulamanın özel durumlarını ele almak için kullanılır. Bu özel durumlar Application_Startup, Application_Exit and Application_UnhandledException. Page.xaml, uygulama tarafından yaratılmış olup uygulama ayağa kalktığında yüklenen başlangıç UI kontrol dosyasıdır.

Projeyi derleyince, Visual Studio temelde tüm proje kodlarını derler ve .XAML dosya tiplerini standart .NET assembly dosyalarına dönüştürür. Sonra tüm bu dosyaları paketler ve web sunucu uygulaması altından dizininin altına .xap uzantılı dosya olarak diske kaydeder.

“.xap” uzantılı dosya sıkıştırma algoritması kullanılarak oluşturulan bir dosyadır. Buradaki amaç client uygulamasının indirme hacmini minimize etmektir.

Uygulamamızı kodlayalım...

MainPage.xaml dosyasının üzerine gelip sağa tıklayınca “View Code” ve “View Designer” tıklayalım. “View Code” deyince acılan dosya C#, “View Designer” deyince açılan dosya kullanıcı arayüz tanımlama dosyasıdır.

MainPage.xaml dosyasına buton ekleyelim. Buton içinde tanımlanan Click için “.cs” dosyasında otomatik aynı isim altında event handler oluşturmaktadır.

<UserControl x:Class="TigrisTeknolojiSilverlight.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

mc:Ignorable="d"

d:DesignHeight="300" d:DesignWidth="400">

<Grid x:Name="LayoutRoot" Background="White">

<Button x:Name="MyButton" Content="Tıkla Beni" Width="91" Height="25" Click="MyButton_Click">Button>

Grid>

UserControl>

ButonuMainPage.xaml.cs dosyası aşağıdaki gibidir. MyButton_Click metodunun içine butona tıklandıktan sonra butonun metnini değiştirelim.

public partial class MainPage : UserControl

{

public MainPage()

{

InitializeComponent();

}

private void MyButton_Click(object sender, RoutedEventArgs e)

{

MyButton.Content = "Tıklandı.";

}

}

Projenizi çalıştırdıktan sonra yaptığımız basit uygulamayı ve sonucunu göreceksiniz.