Silverlight kategorisindeki makaleler 1. sayfa

20 Kas 2009

Silverlight 4 Beta ile Yazdırma (Printing) İşlemi

Kategori:
Silverlight
Etiketler:
Silverlight 4 Silverlight
0 Yorum

Silverlight 4 Beta ile birlikte gelen yeniliklerden biri de silverlight uygulamarına gelen yazdırma (printing) desteği. Silverlight 4 Beta ile birlikte yazdırma işlemi yapmak için System.Windows.Printing namespace’i altında yer alan PrintDocument sınfını kullanacağız. Bu sınıf ile uygulamanın tamamını yada belli bir UI Elementin yazdırılmasını sağlayabiliyoruz. Şimdi bu sınıfa ait üyeleri detaylı olarak inceleyelim.

PrintPage Event’i, yazdırılacak olan UI elementin belirlendiği event.

StartPrint Event’i, yazdırma işlemi başladığında çalışacak olan event.

EndPrintEvent’i, yazdırma işlemi sona erdiğinde yada herhangi bir hata meydana geldiğinde çalışacak olan event. (Kartuş bittiğinde yada yazıcıya ulaşılamadığında vb. gibi sebeplerden hata alabiliriz)

DocumentName özelliği, yazdırma kuyruğunda (print queue) gösterilen dokümanın adı.

Print Metodu, print dialog ekranını açarak yazdırma işleminin başlatılmasını sağlar.

Yazdırma işlemini yapacağımız sınıfı ve üyeleri inceledikten sonra örneğimize geçebiliriz. Visual Studio 2010 ile yeni bir silverlight projesi oluşturalım. Ekranımızda bir TextBlock ve bir Button ekleyelim. TextBlock içerisinde yer alan text’i yazıcıya göndererek yazdırılmasını sağlayalım.

[XAML]

<UserControl x:Class="PrintIslemi.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"Height="200" Width="500">
<Grid x:Name="LayoutRoot" Background="White">
<TextBlock Margin="15,16,15,62" TextWrapping="Wrap" FontWeight="Bold" FontSize="40" x:Name="txtMetin">Silverlight İle Yazdırma İşlemi</TextBlock>
<Button Height="23" HorizontalAlignment="Left" Margin="413,165,0,0" x:Name="btnYazdir" Content="Yazdır" VerticalAlignment="Top" Width="75" />
</Grid>
</UserControl>

Şimdi Yazdırma işlemine başlayabiliriz. PrintDocument sınıfını kullanabilmemiz için ilk olarak System.Windows.Printing namespaceni ekleyelim ve PrintDocument sınıfının bir örneğini alalım. Yazdırma işlemi butona tıkladığında başlayacak.

[C#]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Printing; // Unutmuyoruz !

namespace PrintIslemi
{

    public partial class MainPage : UserControl
    {
        // Yazdırma işlemi için PrintDocument sınıfının örneğini alalım.
        private PrintDocument PrintDocument = new PrintDocument();

        public MainPage()
        {
            InitializeComponent();
            PrintDocument.StartPrint += new EventHandler<StartPrintEventArgs>(PrintDocument_StartPrint);
            PrintDocument.EndPrint += new EventHandler<EndPrintEventArgs>(PrintDocument_EndPrint);
            PrintDocument.PrintPage += new EventHandler<PrintPageEventArgs>(PrintDocument_PrintPage);
            btnYazdir.Click += new RoutedEventHandler(btnYazdir_Click);
        }

        void PrintDocument_PrintPage(object sender, PrintPageEventArgs e)
        {
            e.HasMorePages = false; // Yazdırılacak başka sayfa varmı?
            e.PageVisual = txtMetin; // Herhangi bir UI element;
            e.PrintableArea = new Size(txtMetin.Width, txtMetin.Height);// Yazıdırılacak alanın size’ı
        }

        void btnYazdir_Click(object sender, RoutedEventArgs e)
        {
            PrintDocument.DocumentName = "Silverligt 4 Beta ile Yazdırma İşlemi";// Yazdırma kuyruğunda gösterilecek olan metin
            PrintDocument.Print();// Yazdırma işlemini için print dialog ekranını açar ve yazdırma işleminin başlatılmasını sağlar.
        }

        void PrintDocument_EndPrint(object sender, EndPrintEventArgs e)
        {
            // Yazdırma işleminde bir hata geldiğinde yada sona erdiğinde çalışacak olan event..
            if (e.Error == null) // Hata yoksa
            {
                MessageBox.Show("Yazdırma işlemi sona erdi...");
            }
            else // Hata varsa
            {
                MessageBox.Show("Bir hata meydana geldi...");
            }
        }

        void PrintDocument_StartPrint(object sender, StartPrintEventArgs e)
        {
            // Yazdırma işlemi başladığında çalışacak olan event..
            MessageBox.Show("Yazdırma işlemi başlıyor...");
         }
    }
}

Yazdırma işlemini başlatmak için butona tıklayalım.

Yazıcımız var ama biz yine de Microsoft XPS Document Writer’ı seçelim :)

Yazdırma kuyruğuna bakacak olursak kuyruktaki dökümanın adını PrintDocument sınıfının DocumentName özelliği ile belirtmiştik. Şimdi XPS dökümanını açalım bakalım.

Bu kadar J

Bu makalenin de sonuna geldik başka bir makale de görüşmek üzere. Silverlight ile kalın ;)

Sem GÖKSU
www.semgoksu.com | www.yazilimgunlugu.com
sem.goksu@yazilimgunlugu.com

Kaynaklar
Silverlight 4 Beta SDK

19 Kas 2009

Silverlight 4 Beta ile WebCam ve Mikrofon Erişimi

Kategori:
Silverlight
Etiketler:
Silverlight 4 Silverlight
8 Yorum

Merhaba arkadaşlar bu makalemizde Silverlight 4 Beta ile birlikte gelen mikrofon ve webcam gibi capture aygıtlarına nasıl erişileceğine bakacağız.

Silverlight’ın ilk üç versiyonunda müthiş yenilikler geldi ve kullanım oranı her versiyon ile birlikte katlanarak arttı. Hala eksik olan birşeyler vardı, bunların başında WebCam ve Mikrofon erişimi geliyordu. Silverlight 4 Beta ile birlikte müjdeli haber geldi ve artık silverlight ile WebCam ve Mikrofon erişimi mümkün! Hemde kullanımı son derece basit. Uygulamaya geçmeden önce Silverlight 4 Beta için gerekli olan araçları indirip kuralım.

- Visual Studio 2010 Beta 2 yada Visual Web Developer Express 2010 Beta 2
- Silverlight 4 Beta Tools for Visual Studio 2010
- Windows Runtime yada Mac Runtime
- Microsoft Expression Blend for .NET 4 Preview

Araçları kurduktan sonra örneğimiz için Visual Studio 2010 ile yeni bir Silverlight projesi başlatalım. Formumuza Webcam’den gelen görüntüyü göstermek için Rectangle nesnesi, Ses ve kamera aygıtlarını listelemek için iki adet combobox nesnesi, camerayı başlatmak-durdurmak ve cameradaki görüntünün resmini almak için bir adet button ve image nesnesi ekleyelim. XAML kodumuz aşağıdaki gibi oldu.

[XAML]

CaptureSource nesnesi, sistemdeki görüntü ve sesin istemcinin browserında yayınlanmasını sağlar. (Hatta yayın sırasında bir karenin yakalanmasını sağlıyor J).

CaptureSource nesnesinin Start metodunu kullanarak görüntünün capture edilmesini sağlıyoruz. Stop medodu ise capture işleminin durdurulmasını sağlıyor. State isimli enum ile CaptureSource nesnesinin capture durumunu kontrol edebiliriz. AudioCaptureDevice özelliği sistemde yer alan ilişkili bir ses aygıtını, VideoCaptureDevice özelliği de sistemde yer alan ilişkili bir görüntü aygıtını temsil eder.

CaptureDeviceConfiguration nesnesi, sistemde yer alan ses ve görüntü aygıtlarına erişmemizi sağlar. Ayrıca kullanıcının bu aygıtlara erişime izin verip vermediğini kontrol eden üyeleri vardır.

[C#]

public partial class MainPage : UserControl
{
    public CaptureSource CaptureSource { get; set; }

    public MainPage()
    {
        InitializeComponent();
        // Kontrolllerin eventlerini oluşturalım
        this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        this.btnStart.Click += new RoutedEventHandler(btnStart_Click);
        this.btnStop.Click += new RoutedEventHandler(btnStop_Click);
        this.btnTake.Click += new RoutedEventHandler(btnTake_Click);
    }

    void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        // İlk yükleme de sistem de yer alan aygıtları ilgili kontrollere yüklüyoruz.
        AygitlariYukle();
    }

    private void AygitlariYukle()
    {
        // CaptureSource Nesnesinin örneğini alalım.
        CaptureSource = new CaptureSource();

        // Ses aygıtlarını combobox'a yükleyelim. GetAvailableAudioCaptureDevices() Metodu sisteme yer alan ses aygıtlarını getiriyor.
        cmbAudioSources.ItemsSource = CaptureDeviceConfiguration.GetAvailableAudioCaptureDevices();
        cmbAudioSources.DisplayMemberPath = "FriendlyName";

        // Kamera aygıtlarını combobox'a yükleyelim. GetAvailableVideoCaptureDevices() Metodu sisteme yer alan kamera aygıtlarını getiriyor.
        cmbVideoSources.ItemsSource = CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices();
        cmbVideoSources.DisplayMemberPath = "FriendlyName";
    }

    void btnStart_Click(object sender, RoutedEventArgs e)
    {
        // CaptureSource nesnesi başlatılmadıysa...
        if (CaptureSource.State != CaptureState.Started)
        {
            // Seçtiğimiz ses aygıtını CaptureSource nesnesinin AudioCaptureDevice özelliğine bağlayalım.
            CaptureSource.AudioCaptureDevice = (AudioCaptureDevice)cmbAudioSources.SelectedItem;
            // Seçtiğimiz kamera aygıtını CaptureSource nesnesinin VideoCaptureDevice özelliğine bağlayalım.
            CaptureSource.VideoCaptureDevice = (VideoCaptureDevice)cmbVideoSources.SelectedItem;

            // VideoBrush nesnesi oluşutralım ve SetSource metoduna CaptureSource'u parametre olarak geçelim.
            VideoBrush vb = new VideoBrush();
            vb.SetSource(CaptureSource);
            // Player isimli kontrol de kameradan gelen görüntüyü gösterelim...
            player.Fill = vb;

            // İstemci aygıtlara erişimi izni verdiyse capture işlemini başlatalım.
            if (CaptureDeviceConfiguration.AllowedDeviceAccess || CaptureDeviceConfiguration.RequestDeviceAccess())
            {
                CaptureSource.Start();
            }
        }
    }

    void btnStop_Click(object sender, RoutedEventArgs e)
    {
        // Kamera görüntüsünü capture ediliyorsa.
        if (CaptureSource.State != CaptureState.Stopped)
        {
            // Capture işlemini durduralım.
            CaptureSource.Stop();
        }
    }

    void btnTake_Click(object sender, RoutedEventArgs e)
    {
    // Kamera görüntüsü capture ediliyorsa.
        if (CaptureSource.State== CaptureState.Started)
        {
            CaptureSource.AsyncCaptureImage((rsm) =>
            {
                image.Source = rsm; // Yakalanan kamera görüntüsünü Image nesnesine bağlayalım
            });
        }
    }
}

Uygulamamızı çalıştırdığımızda aşağıdaki gibi bir uyarı çıkacaktır. (Kamera ve Ses aygıtınıza erişime izin vermemizi istiyor) Evet diyerek devem edelim.

Sistemimizde yer alan ses ve kamera aygıtını seçerek kameradan görüntü almaya başlayalım.

Oynat dediğimizde:)

Birde resim yakalayalım :)

Bu makalenin de sonuna geldik başka bir makale de görüşmek üzere. Silverlight ile kalın ;)

Örnek uygulama için tıklayınız

Sem GÖKSU
www.semgoksu.com | www.yazilimgunlugu.com
sem.goksu@yazilimgunlugu.com

Kaynaklar
Silverlight 4 Beta SDK

11 Nis 2009

Silverlight 3 Beta - Lokal Mesajlaşma (Local Messaging)

Merhaba arkadaşlar, bu makalemizde Silverlight 3 Beta ile birlikte gelen Lokal Mesajlaşma (Local Messaging) işleminin nasıl yapıldığını inceleyeceğiz.

Silverlight 3 Beta ile birlikte gelen Local Messaging(Lokal Mesajlaşma) özelliği ile iki Silverlight uygulaması arasında iletişim kurup birbirlerine mesajlar göndermesini sağlayabiliyoruz. İster bir sayfada ki iki Silverlight uygulaması arasında, ister sekmeler(tab) arasında ki sayfaların içerisinde yer alan Silverlight uygulamalarında ve istersek farklı browserlar da bulunan Silverlight uygulamalarının birbirleriyle haberleşmesini sağlayıp buna bağlı olarak çeşitli işlemler yapıp birbirleri arasında veri alışveriş yapabiliyoruz. Yani Internet Explorer da çalışan bir Silverlight uygulaması, Safari de çalışan Silverlight uygulamasına bir mesaj gönderebiliyor. Safari de çalışan uygulama da bu mesaja bağlı olarak işlemler yapabiliyor. System.Windows.Messaging namespace’i altında mesaj göndermek ve mesajı almak için 2 sınıf var. Mesajı göndermek için LocalMessageSender, Mesajı almak için LocalMessageReceiver sınıfını kullanıyoruz.

Yeni bir Silverlight uygulaması oluşturalım. Bu uygulama bizim için başka bir uygulama ile iletişim kurup o uygulamaya mesaj gönderecek. Bu uygulama içinde bir TextBox ve bir de Button olsun. Butona bastığımızda TextBox’a girilen bilgiyi diğer uygulamaya göndereceğiz.

[XAML]

Butona tıklandığında mesaj gönderme işlemini yapacağız, bunun için ilk olarak Click eventini oluşturalım. Bu Event içinde mesajı gönderebilmemiz için postaci isminde LocalMessageSender nesnesi oluşturalım. LocalMessageReceiver nesnesinin SendAsync metodunda alıcıya göndereceğimiz bilgiyi bildiriyoruz. Mesaj gönderildiğinde tetiklenen SendCompleted isminde bir event var. Bu eventinin eventargument’in Response özelliği ile mesajı alanın bize gönderdiği cevabı alabiliriz.

[C#]

namespace Silverlight30LocalMessaging
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
            // Button için Click Eventini oluşturalım.
            this.btnGonder.Click += new RoutedEventHandler(btnGonder_Click);
        }

        void btnGonder_Click(object sender, RoutedEventArgs e)
        {
            // Local Messaging özelliğini kullanabilmemiz için System.Windows.Messaging namespace’i altında yer alan Local MessageSender sınıfını kullanıyoruz. Yapıcı metotda alıcı için bir isim belirtiyoruz.
            System.Windows.Messaging.LocalMessageSender postaci = new System.Windows.Messaging.LocalMessageSender("Adres");
            // Gönderilecek olan mesajı SendAsync metodu ile gönderiyoruz.
            postaci.SendAsync(txtMessage.Text);
            // Mesaj yerine gettiğinde çalışacak olan eventi oluşturalım.
            postaci.SendCompleted += new EventHandler<System.Windows.Messaging.SendCompletedEventArgs>(postaci_SendCompleted);
        }

        // Mesaj yerine gettiğinde çalışacak olan event. Mesajı alan silverlight uygulaması geriye bir yanıt gönderebilir, e.Response özelliği ile alıcının bize yolladığı bu yanıtı verir.
        void postaci_SendCompleted(object sender, System.Windows.Messaging.SendCompletedEventArgs e)
        {
            MessageBox.Show(e.Response);
        }
    }
}

Mesajı gönderdik, mesajı alacak bir alıcı yani başka bir Silverlight uygulamasına ihtiyacımız var. Bunun için bir Silverlight uygulaması daha oluşturalım. Bu uygulamada sadece TextBlock olsun. TextBlock kontrolünün text özelliğinde gönderilen mesajı görüntüleyeceğiz.

[XAML]

Uygulama çalıştığında Mesajları alabilmek için alici adında LocalMessageReceiver nesnesi oluşturalım. LocalMessageReceiver nesnesinin gönderilen mesajları alabilmesi için Listen metodunu çağırmamız gerekir. Uygulamaya Mesajlar asenkron olarak gelecektir, Mesaj geldiğinde haberdar olabilmemiz için MessageReceived isimli bir event var. Bu event ile gelen mesajı alıp, mesajı gönderene cevap gönderebiliriz. Gelen mesajı almak için MessageReceived eventinin argümanları arasında Message isimli bir özellik var. Mesajı gönderene cevap göndermek için de Response özelliğini kullanabiliyoruz

[C#]

namespace Silverlight30LocalMessagingAlici
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
            // Uygulama çalıştığında çalışacak olan event.
            this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        }

        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            // Uygulama çalıştığında mesajın alınabilmesi için LocalMessageReceiver nesnesini oluşturalım. Yapıcı metodunda gönderen tarafında bildirilen adresi bildiriyoruz.
            System.Windows.Messaging.LocalMessageReceiver alici = new System.Windows.Messaging.LocalMessageReceiver("Adres");
            // Alıcıyı mesajları alabilmesi için açıyoruz. Alici dinlemeye başladı…
            alici.Listen();
            // Mesaj geldiğinde çalışacak olan eventi oluşturalım.
            alici.MessageReceived += new EventHandler<System.Windows.Messaging.MessageReceivedEventArgs>(alici_MessageReceived);
        }

        void alici_MessageReceived(object sender, System.Windows.Messaging.MessageReceivedEventArgs e)
        {
            // Mesaj geldi, EventArgument’de Response isimli bir özellik var. Bu özellik mesajı gönderene bir yanıt gönderiyor.
            e.Response = "Teşekkürler, Mesaj alındı !";
            // EventArgument’in Message özelliği bize gönderilen mesajı veriyor.
            tbAlici.Text = e.Message;
            // EventArgument’in SenderDomain özelliği mesajı gönderen uygulamanın adresini veriyor.
            // e.SenderDomain;
        }
    }
}

Şimdi uygulamalarımızı test edelim, iki uygulamayı da çalıştıralım.

Resim 1

Farklı browserlar da test edelim, Chrome’da mesajı gönderen uygulamayı çalıştıralım.

Resim 2

Bu makalenin de sonuna geldik başka bir makale de görüşmek üzere. Silverlight ile kalın ;)

Sem GÖKSU
www.semgoksu.com | www.yazilimgunlugu.com
sem.goksu@yazilimgunlugu.com

Kaynaklar
msdn.com
silverlight.net

01 Nis 2009

Silverlight 3 Beta - Assembly Caching(Önbellekleme)

Merhaba arkadaşlar, bu makalemizde Silverlight 3 Beta ile birlikte gelen Assembly Caching (Önbellekleme) özelliğini inceliyor olacağız.

Silverlight 2.0 ile birlikte Silverlight uygulamaları XAP dosyalarında dağıtılmaya başlamıştı. XAP dosyalarının (aslında ZIP dosyası) içerisinde Silverlight uygulamamızda kullandığımız assemly(DLL) ’ler yer alıyordu ve bu yüzden XAP dosyalarının boyutu da büyüyordu. Silverlight 3 Beta ile birlikte Assembly Caching özelliği geldi ve Silverlight uygulamalarına Referans edilen assembly dosyaları XAP dosyası içinde değil de kullanıcının makinesine internet üzerinden(microsoft.com’dan) indirilip kullanılıyor. XAP dosyasının içinde assembly’ler yer almayacağı için XAP dosyasının da boyutu da küçülüyor. Bunun dezavantajı da var, eğer o anda internet bağlantımız yoksa Silverlight uygulamamız çalışmayacaktır

Yeni bir Silverlight uygulaması oluşturalım ve projemizi derleyip oluşan XAP dosyasını inceleyelim. (XAP dosyasını Win Zip ya da Win Rar ile açabiliriz)

Resim 1

ZAP dosyamız 290 KB görünüyor. Şimdi XAP dosyasının içindeki dosyalara bakalım.

Resim 2

Projemize referans olarak eklediğimiz Assembly(DLL)’ler XAP dosyası içerisinde yer alıyor. Boyut olarak da bir hayli büyümüş ve daha da büyüyebilir. Son olarak XAP içerisinde yer alan AppManifest.XAML dosyasını açalım ve inceleyelim.

<Deployment xmlns=http://schemas.microsoft.com/client/2007/deployment
xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
EntryPointAssembly="SL30AssemblyCaching" EntryPointType="SL30AssemblyCaching.App"
RuntimeVersion="3.0.40307.0">
    <Deployment.Parts>
        // Referans gösterdiğimiz Assembly’ler…
        <AssemblyPart x:Name="SL30AssemblyCaching" Source="SL30AssemblyCaching.dll" />
        <AssemblyPart x:Name="System.ComponentModel.DataAnnotations" Source="System.ComponentModel.DataAnnotations.dll" />
        <AssemblyPart x:Name="System.ComponentModel" Source="System.ComponentModel.dll" />
        <AssemblyPart x:Name="System.Data.Services.Client" Source="System.Data.Services.Client.dll" />
        <AssemblyPart x:Name="System.Json" Source="System.Json.dll" />
        <AssemblyPart x:Name="System.Windows.Ria" Source="System.Windows.Ria.dll" />
        <AssemblyPart x:Name="System.Xml.Linq" Source="System.Xml.Linq.dll" />
    </Deployment.Parts>
</Deployment>

Silverlight 3 Beta ile gelen Assembly Caching özelliğini kullanalım. Bu özelliği kullanabilmemiz için Silverlight uygulaması üzerinde sağ tıklayarak properties’i açalım. Açılan pencerede “Reduce Xap size by caching framework assamblies” seçeneğini seçelim. (Default olarak seçili gelmiyor)

Resim 3

Şimdi projemizi tekrar derleyelim ve XAP dosyasını tekrar inceleyelim.

Resim 4

Dosya boyutu 63 KB’a düşmüş, XAP Dosyasını açalım ve içindeki dosyalara bakalım.

Resim 5

Son olarak XAP içindeki AppManifest.XAML dosyasına da açıp bakalım, içeriğinin değiştiğini göreceğiz.

<Deployment xmlns=http://schemas.microsoft.com/client/2007/deployment
xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
EntryPointAssembly="SL30AssemblyCaching" EntryPointType="SL30AssemblyCaching.App"
RuntimeVersion="3.0.40307.0">
    <Deployment.Parts>
        <AssemblyPart x:Name="SL30AssemblyCaching" Source="SL30AssemblyCaching.dll" />
        <AssemblyPart x:Name="System.Windows.Ria" Source="System.Windows.Ria.dll" />
        </Deployment.Parts>
    <Deployment.ExternalParts>
    // Referans gösterdiğimiz assembly’ler uygulama browser da çalıştığı anda indirilecek.
    <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkID=142565" />
        <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkID=141727" />
        <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkId=142566" />
        <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkId=142567" />
        <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkId=142576" />
    </Deployment.ExternalParts>
</Deployment>

XAP içinde yer alan assembly’ler artık burada yer almıyor. Assembly yerine indirileceği linkler yer alıyor. Silverlight uygulaması browser da çalıştığında Silverlight uygulaması bu linkleri kullanılarak ilgili assembly dosyalarını kullanıcının makinesine microsoft.com’dan indirecek.

Silverlight uygulması derlenirken bu linkleri C:\program files\microsoft sdks\silverlight\v3.0\libraries\client klasöründeki *.extmap.xml dosyalarından alıyor. Eğer burada ilgili dosya yoksa XAP içerisine assembly'nin kendisini atıyor.

<?xml version="1.0"?>
<manifest xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
    <assembly>
        <name>System.Windows.Controls.Data.DataForm</name>
        <version>2.0.5.0</version>
        <publickeytoken>31bf3856ad364e35</publickeytoken>
        <relpath>System.Windows.Controls.Data.DataForm.dll</relpath>
      <extension downloadUri="http://go.microsoft.com/fwlink/?LinkID=142573"/>
    </assembly>
</manifest>

31 Mar 2009

Silverlight 3 Beta - Data Kontrolleri ile İş Uygulamaları Geliştirme

Merhaba arkadaşlar, bu makalemizde Silverlight 3 Beta ile birlikte gelen DataForm kontrolü ile DataGrid kontrolünü birlikte kullanarak bir iş uygulaması geliştireceğiz.

Silverlight 3 Beta ile birlikte data kontrollerinin çok geliştirildiğini önceki yazılarımda özellikle vurgulamıştım. Bu makalemizde de bu data kontrollerini kullanarak bir iş uygulaması geliştireceğiz. Uygulamamızda kategoriler ve bu kategoriler ait ürünlerin listelendiği bir uygulama geliştireceğiz. DataForm kontrolünde kategorileri, DataGrid kontrolünde de bu kategoriye ait olan ürünleri listeleyeceğiz. Eğer bu kontroller ile ilgili yeterince bilgimiz yoksa öncelikle aşağıdaki makaleleri okumanızı öneririm.

DataGrid Kontrolü
DataGrid Kontrolü Kolon Yapıları
Web-Servisten Gelen Verinin Listelenmesi
DataForm Kontrolüne Genel Bakış

Yeni bir Silverlight projesi oluşturalım. Örneğimizde SQL Server 2005 örnek veritabanı olan AdventureWorks’u kullanacağız. Silverlight da doğrudan veritabanı erişimi olmadığı için XML Web servisi ile veriyi alacağız. Bunun için projemize web servisi ekleyelim. Servisimizin içinde Urun ve Kategori için iki nesne ve iki metot oluşturalım. İlk metot kategoriler için ikincisi de ürünler için olacak.

[WebService1.asmx]

publicclass WebService1 : System.Web.Services.WebService
{
    public class Kategori // Kategoriler için Entity
    {
        public int KategoriID { get; set; }
        public string KategoriAdi { get; set; }
    }

    public class Urun // Ürünler için Entity
    {
        public int UrunID { get; set; }
        public string UrunAdi { get; set; }
        public decimal ListeFiyati { get; set; }
    }

    [WebMethod]
    public List<Kategori> KategorileriGetir()// Web servisten geriye dönecek olan kategori listesi
    {
        List<Kategori> kategoriler = new List<Kategori>();
        SqlConnection cnn = new SqlConnection("server=.; DataBase=AdventureWorks; uid=sa; pwd=sa12345");
        SqlCommand cmd = new SqlCommand("Select ProductSubCategoryID, Name From Production.ProductSubCategory", cnn);
        cnn.Open();
        SqlDataReader dr = cmd.ExecuteReader();
        while (dr.Read())
        {
            kategoriler.Add(new Kategori() { KategoriID = dr.GetInt32(0), KategoriAdi = dr.GetString(1) });
        }
        cnn.Close();
        return kategoriler;
    }

    [WebMethod]
    public List<Urun> UrunleriGetir(int ProductSubcategoryID)//Web servisten geriye dönecek olan Ürün Listesi. Parametre olarak CategoryID’yi aldı.
    {
        List<Urun> urunler = new List<Urun>();
        SqlConnection cnn = new SqlConnection("server=.; DataBase=AdventureWorks; uid=sa; pwd=sa12345");
        SqlCommand cmd = new SqlCommand("Select ProductID, Name, ListPrice From Production.Product Where ProductSubCategoryID=@ProductSubCategoryID", cnn);
        cmd.Parameters.AddWithValue("@ProductSubcategoryID", ProductSubcategoryID);
        cnn.Open();
        SqlDataReader dr = cmd.ExecuteReader();
        while (dr.Read())
        {
            urunler.Add(new Urun() { UrunID = dr.GetInt32(0), UrunAdi = dr.GetString(1), ListeFiyati = dr.GetDecimal(2) });
        }
        cnn.Close();
        return urunler;
    }
}

Servisimiz hazır. Şimdi Silverlight uygulamamıza dönelim. Silverlight formumuza bir DataGrid ve DataForm ekleyelim. DataForm kontrolünün fieldlarını istersek kendimiz de oluşturabiliriz. Bunun için AutoGenerateFields özelliğini false yapalım ve fieldlarını kendimiz belirleyelim. Aynı şekilde DataGrid kontrolünün de kolonlarının otomatik olarak oluşmasını engelleyelim ve kolonlarını kendimiz belirleyelim.

[XAML]

<UserControl xmlns:dataControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.DataForm" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="SL3DataFormGridVew.MainPage"
xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x=" http://schemas.microsoft.com/winfx/2006/xaml"
Width="500" Height="360">
// Animasyon da olsun
<UserControl.Resources>
    // Silverlight 3 Beta ile gelen easing animasyonları kullanalım.
    <Storyboard x:Name="oyna">
        <DoubleAnimation Storyboard.TargetName="dgUrunler" Storyboard.TargetProperty="Opacity" From=".2" To="1" Duration="00:00:01">
            // DoubleAnimastion’ın EasingFunction isimli dependency bir property’si var. Bu Property herhangi bir easing animasyonu atayabiliriz.
            <DoubleAnimation.EasingFunction>
                <QuarticEase EasingMode="EaseInOut"></QuarticEase>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
    </Storyboard>
</UserControl.Resources>
<Canvas x:Name="LayoutRoot" Background="White">
    // Kategorilerin listeleneceği DataForm Kontrolü. AutoGenerateFields özelliğini false yaptık ve içerisinde ki fieldlar otomatik olarak oluşturulmasını engelledik.
    <dataControls:DataForm x:Name="dgKategoriler" AutoGenerateFields="False" Width="480" Canvas.Top="10" Canvas.Left="10" Height="150">
        // DataForm kontrolünün fiedlarını belirliyoruz.
        <dataControls:DataForm.Fields>
            // Yeni bir field ekliyoruz.
            // FieldLabelContent => Kontrolün etiket bilgisi
            // isReadOnly => Bu fieldda yer alan Kontrol sadece okunabilir olacak
            // Binding => Verikaynağından gelen değeri bağlıyoruz.
            // FieldLabelPosition => Kontrolün eiketi nerede görünsün
            <dataControls:DataFormTextField FieldLabelContent="Kategori ID" IsReadOnly="True" Binding="{Binding KategoriID}" FieldLabelPosition="Top">
            </dataControls:DataFormTextField>
            <dataControls:DataFormTextField FieldLabelContent="Kategori Adı" Binding="{Binding KategoriAdi}" FieldLabelPosition="Top">
            </dataControls:DataFormTextField>
        </dataControls:DataForm.Fields>
    </dataControls:DataForm>
     // Kategoriye ait ürünlerin yer aldığı DataGrid Kontrolü. AutoGenerateColumns özelliğini false yaparak kolonların otomatik olarak oluşturulmasını engelledik.
    <data:DataGrid x:Name="dgUrunler" AutoGenerateColumns="False" Canvas.Top="170" Canvas.Left="10" Width="480" Height="180">
        // Datagrid’e kolonları ekleyelim
        <data:DataGrid.Columns>
            // Header => Kolonum başlık bilgisi
            // Binding => Verikaynağından gelen değeri bağlıyoruz.
            <data:DataGridTextColumn Header="Ürün ID" Binding="{Binding UrunID}"></data:DataGridTextColumn>
            <data:DataGridTextColumn Header="Ürün Adı" Binding="{Binding UrunAdi}"></data:DataGridTextColumn>
            <data:DataGridTextColumn Header="Liste Fiyatı" Binding="{Binding ListeFiyati}"></data:DataGridTextColumn>
        </data:DataGrid.Columns>
    </data:DataGrid>
</Canvas>
</UserControl>

Dizayn olarak her şey hazır. Artık Web servise bağlanıp verileri çekebiliriz. Bunun için Silverlight projemize gelelim ve sağ tıklayarak “Add Service Reference” diyelim. Discover butonuna tıkladığımız da servisi otomatik olarak bulacaktır. OK butonuna basalım ve servisi ekleyelim.

Resim 1

Servise bağlandıktan sonra yapmamız gereken tek şey servisten gelen veriyi kontrollere bağlamak olacak.

[C#]

public partial class MainPage : UserControl
{
    // Web Servis’in örneğini oluşturalım
    WebService1SoapClient servis = new WebService1SoapClient();
    public MainPage()
    {
        InitializeComponent();
        // Uygulama ilk yüklendiğinde çalışan Loaded event listenerini oluşturalım.
        this.Loaded += span style='color: blue'>new RoutedEventHandler(MainPage_Loaded);
        // Hatırlayacak olursanız, Web servisleri varsayılan olarak Asenkron olarak çalışıyordu. Burada Servisten kategorilerin getirildiğinde çalışacak olan event listeneri oluşturalım.
        servis.KategorileriGetirCompleted += new EventHandler<SL3DataFormGridVew.ServiceReference1.KategorileriGetirCompletedEventArgs>(servis_KategorileriGetirCompleted);
        // DataForm kontrolünden kategoriler arasında geçerken çalışacak olan event listeneri luşturalım.
dgKategoriler.CurrentItemChanged += new EventHandler<EventArgs>(dgKategoriler_CurrentItemChanged);
        // Servisten Ürünler getirildikten sonra çalışacak olan event listeneri oluşturalım.
        servis.UrunleriGetirCompleted += new EventHandler<UrunleriGetirCompletedEventArgs>(servis_UrunleriGetirCompleted);
    }

    void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        // Servise Kategorileri getirecek olan metot için istekte bulunuyoruz.
        servis.KategorileriGetirAsync();
    }

    void servis_KategorileriGetirCompleted(object sender, SL3DataFormGridVew.ServiceReference1.KategorileriGetirCompletedEventArgs e)
    {
        // Gelen sonucu DataForm’un ItemsSource özelliğine bağlıyoruz.
        dgKategoriler.ItemsSource = e.Result;
    }

    void dgKategoriler_CurrentItemChanged(object sender, EventArgs e)
    {
        // Seçili olan elemanı bir kategori nesnesine atadık. Object döndüğü içinde cast ettik.
        Kategori kategori = (Kategori)dgKategoriler.CurrentItem;
        // Servise Ürünleri getirecek olan metot için istekte bulunuyoruz.
        servis.UrunleriGetirAsync(kategori.KategoriID);
    }

    void servis_UrunleriGetirCompleted(object sender, UrunleriGetirCompletedEventArgs e)
    {
        // Ürünler geldiğinde animasyonu oynatalım.
        oyna.Begin();
        // Gelen sonucu datagarid’in ItemsSource özelliğine bağlıyoruz.
        dgUrunler.ItemsSource = e.Result;
    }
}

Sonuca bakalım,

Resim 2

İstediğimiz gibi kayıtlar arasında gezinebilir ve ürünlerin de değiştiğini ve animasyonun da çalıştığını görebiliriz.. Bu makalenin de sonuna geldik başka bir makale de görüşmek üzere. Silverlight ile kalın ;) Makale de kullandığımız örneği indirmek için tıklayınız

Sem GÖKSU
www.semgoksu.com | www.yazilimgunlugu.com
sem.goksu@yazilimgunlugu.com

Kaynaklar
msdn.com
silverlight.net