Silverlight 2.0 Uygulamalarında farklı XAML dosyaları kullanmak.

0 dakikada yazıldı

4930 defa okundu

Düzenle

Bir Silverlight uygulamasında birden çok XAML dosyası kullanarak
dosyalar arasında geçiş yapmak isteyebilirsiniz. Fakat bu noktada
maalesef sizi ufak bir sorun bekliyor. Herhangi bir Silverlight
uygulamasının ana görsel elementini maalesef ki değiştirme şansınız yok.
Ana görsel element olarak bahsettiğimiz şey aslında Silverlight 2.0
uygulamasının XAML koduna ait "Root Element" oluyor. Söz konusu root
element sadece uygulama ilk çalıştırılırken belirlenebiliyor. Peki bu
durumda nasıl bir çözüm geliştirebiliriz?

Root Elementi bir Container olarak kullansak?

Uygulamamızın ana elementini bir Grid yapsak ve içerisinde XAML
dosyalarımızı birer UserControl olarak yerleştirsek, böylece istediğimiz
zaman Grid içerisindeki elementlerini değiştirerek farklı XAML dosyaları
yükletemez miyiz? Güzel bir fikre benziyor. Deneyip görelim.

İlk olarak içerisinde basit bir şekilde iki adet XAML dosyası içeren
yeni bir Silverlight 2.0 projesi yaratıyoruz. Bu dosyalardan birinde
sadece bir TextBlock varken diğerinde bir TextBlock ve bir de Button
olarak. İlk dosyadaki Button'a basıldığında ikinci dosyanın yüklenmesini
sağlayacağız. Gelin önce dosyalarımızın XAML kodlarına hızlıca bir göz
atalım.

[Page.xaml]

<UserControl

    xmlns="http://schemas.microsoft.com/client/2007"

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

    x:Class="SilverlightApplication4.Page"

    Width="640" Height="480">

 

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

        <TextBlock x:Name="etiket" Margin="146,120,270,225" TextWrapping="Wrap" FontSize="72">

            <Run FontFamily="Portable User Interface" FontSize="14.666666984558106" FontStretch="Normal" FontStyle="Normal" FontWeight="Normal" Foreground="#FF000000" Text="1"/>

        </TextBlock>

        <Button Height="30"
HorizontalAlignment="Left" Margin="169,0,0,78" VerticalAlignment="Bottom" Width="105"
Content="Button" x:Name="Dugme"/>

    </Grid>

</UserControl>

[Page2.xaml]

<UserControl

    xmlns="http://schemas.microsoft.com/client/2007"

    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"

    x:Class="SilverlightApplication4.Page2"

    d:DesignWidth="640" d:DesignHeight="480">

 

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

        <TextBlock Margin="154,113,206,172" TextWrapping="Wrap">

            <Run FontFamily="Portable User Interface" FontSize="14.666666984558106" FontStretch="Normal" FontStyle="Normal" FontWeight="Normal" Foreground="#FF000000" Text="2"/>

        </TextBlock>

    </Grid>

</UserControl>

Herhangi bir Silverlight 2.0 projesinde ilk açılacak olan XAML
dosyasının sınıfı App.xaml ile beraber çalışan code-behind dosyasına
belirlenir. Bu dosyayı  WPF uygulamalarında app.xaml'a veya ASP.NET
uygulamalarındaki Global.asax'a benzetebilirsiniz. App.xaml uygulama ile
ilgili global işlemlerin yapıldığı yerdir. İlk olarak app.xaml
dosyasının code-behind kısmına geçerek uygulamanın OnStartUp
durumuna özel bir kod yazacağız.

Private Sub OnStartup(ByVal o As
Object, ByVal e As
EventArgs) Handles Me.Startup

    Dim BirGrid As New
System.Windows.Controls.Grid

    BirGrid.Children.Add(New Page)

    Me.RootVisual = BirGrid

End Sub

Yukarıdaki kod içerisinde ilk olarak bir Silverlight 2.0 Grid
kontrolü yaratıyoruz. Unutmayın ki WPF'de de oluğu gibi Grid
kontrolleri birer DataGrid değiller. Grid kontrolleri HTML'deki
karşılığı ile table diyebileceğimiz container kontrollerinden
sadece biri. Yarattığımız Grid kontrolü içerisine Page.xaml
dosyamızı yüklemek için Page.xaml'a ait code-behind'daki sınıfından bir
kopya yaratarak Grid'imizin children listesine ekliyoruz. Son olarak da
uygulamamızın ana / root elementini Grid kontrolü olarak tanımlıyoruz.
Böylece bundan sonra ana elementi değiştirmeden doğrudan Grid
içerisindeki kontrolleri değiştirerek aslında tüm uygulama arayüzünü de
değiştirmiş olacağız.

Gelelim Page.xaml dosyamızın code-behind kısmına ve bakalım Page.xaml
içerisinde bulunan düğmemize basıldığında nasıl olacak da uygulama
arayüzünden page.xaml'ı kaldırarak page2.xaml'ı yükleyeceğiz.

Private Sub Dugme_MouseLeftButtonDown(ByVal sender As Object,
ByVal e As
System.Windows.Input.MouseButtonEventArgs) Handles Dugme.MouseLeftButtonDown

    Dim Root As Grid = CType(Me.Parent, Grid)

    Root.Children.Clear()

    Root.Children.Add(New Page2)

End Sub

Yapmamız gereken aslında şu an içerisinde olduğumuz Page.xaml dosyasının
parent elementini bularak içerisindekileri silmek. Bunun için
Me.Parent ile Gridimizi yakalıyoruz ve sonrasında children.clear
ile sayfadaki herşeyi siliyoruz. Son olarak da Page2.xaml dosyamıdan bir
kopya yaratarak aynı Grid'in içerisine ekliyoruz. Böylece Silverlight
2.0 uygulamamızın içerisinde artık başka bir XAML dosyası yüklemiş
olduk.

Hepinize kolay gelsin.