30 Oca 2009 Silverlight DataGrid Kontrolü – Web Servisten Gelen Verinin Listelenmesi Kategori: Silverlight Etiketler: Silverlight 2 Yorum Merhaba arkadaşlar bu makalemiz de DataGrid kontrolüne web servisten gelen verileri bağlayıp DataGrid’in kolonlarını özelleştireceğiz.Konuya başlamadan önce eğer Silverlight’ta web servisleri ile uğraşmadıysanız Silverlight ile Web Servislerinin Kullanılması isimli makaleyi okumanızı öneririm. Örneğimizde AdventureWorks veritabanına bağlanıp, ProductionProduct tablosuna web servisi ile bağlanıp verileri gridimiz üzerinde görüntüleyeceğiz. İlk olarak yeni bir silverlight projesi oluşturalım. Oluşturduğumuz projeye bir web servis dosyası ekleyip içerisinde Product isimli bir sınıf yazalım. İçerisinde 5 adet property yer alacak. Web servisinde de veritabanından ürünleri getirecek bir List döndüren bir metot yazalım. publicclass Product{ public int ProductID { get; set; } public string Name { get; set; } public string Color { get; set; } public bool MakeFlag { get; set; } public DateTime SellStartDate { get; set; }}[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][System.ComponentModel.ToolboxItem(false)]public class WebService1 : System.Web.Services.WebService{[WebMethod]public List<Product> GetProducts(){ List<Product> productList = new List<Product>(); SqlConnection cnn = new SqlConnection("server=.; database=AdventureWorks; uid=sa; pwd=sa12345"); SqlCommand cmd = new SqlCommand("Select ProductID, Name, Color, MakeFlag,SellStartDate from Production.Product", cnn); cnn.Open(); SqlDataReader dr = cmd.ExecuteReader(); while (dr.Read()) { productList.Add(new Product() { ProductID = dr.GetInt32(0), Name = dr.GetString(1), Color = dr.GetString(2), MakeFlag = dr.GetBoolean(3), SellStartDate= dr.GetDateTime(4) }); } return productList; }} Data tarafımız hazır. Şimdi de page.xaml’ı Expression Blend ile açalım ve bir DataGrid ekleyelim ve DataGrid üzerinde göstereceğimiz kolonları ayarlayalım. <UserControl xmlns:basics="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="SilverlightToolkits.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="700" Height="400"><Gridx:Name="LayoutRoot" Background="White"> <data:DataGrid Margin="8,8,8,8" x:Name="grid" AutoGenerateColumns="False"> <data:DataGrid.Columns> <data:DataGridTextColumn IsReadOnly="True" CanUserResize="False" CanUserSort="True" CanUserReorder="False" Binding="{Binding ProductID}" Header="Ürün ID"/> <data:DataGridTextColumn Binding="{Binding Name}" Header="Ürün Adı"/> <data:DataGridTextColumn Binding="{Binding Color}" Header="Renk"/> <data:DataGridCheckBoxColumn Binding="{Binding MakeFlag}" Header="MageFlag"></data:DataGridCheckBoxColumn> <data:DataGridTemplateColumn Header="Tarih"> <data:DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBlock Text="{Binding SellStartDate}"></TextBlock> </DataTemplate> </data:DataGridTemplateColumn.CellTemplate> <data:DataGridTemplateColumn.CellEditingTemplate> <DataTemplate> <basics:DatePicker SelectedDate="{Binding SellStartDate, Mode=TwoWay}"></basics:DatePicker> </DataTemplate> </data:DataGridTemplateColumn.CellEditingTemplate> </data:DataGridTemplateColumn> </data:DataGrid.Columns> </data:DataGrid></Grid> </UserControl> DataGrid’in dizayn kısmını hallettik, şimdi de datayı getirecek kodları yazalım. İlk olarak servisin bir örneğini oluşturacağız. Sonrasında uygulama’nın Loaded event listenerini oluşturup servisten veriyi çekeceğiz. Son olarak da servisten gelen metodun completed even listenerini oluşturup gelen veriyi gride bağlayacağız. using SilverlightToolkits.ServiceReference1; // Eklemeyi unutmayalımWebService1SoapClient s = new WebService1SoapClient();public Page(){ InitializeComponent(); this.Loaded += new RoutedEventHandler(Page_Loaded); // yüklendiğinde çalışacak olan event s.GetProductsCompleted += new EventHandler<SilverlightToolkits.ServiceReference1.GetProductsCompletedEventArgs>(s_GetProductsCompleted); // Serviste kullandığımız metodun sonucu geldiğinde çalışacak olan event}void s_GetProductsCompleted(object sender, SilverlightToolkits.ServiceReference1.GetProductsCompletedEventArgs e){ grid.ItemsSource = e.Result; // Sonucu gride bağladık} void Page_Loaded(object sender, RoutedEventArgs e){ s.GetProductsAsync(); // Servise çağrıda bulunduk} Test edelim Verilerimizi gride çektik. Tarih alanında herhangi bir yere tıklarsak takvimin çıktığını görüyoruz. Makalenin sonuna geldik, başka bir makalede görüşmek dileğiyle. .NET ve Silverlight ile kalın ;) Sem GÖKSU www.semgoksu.com | www.yazilimgunlugu.com sem.goksu@yazilimgunlugu.com Kaynaklarmsdn.comsilverlight.net
30 Oca 2009 Silverlight DataGrid Kontrolü - Kolon Yapıları Kategori: Silverlight Etiketler: Silverlight 0 Yorum Merhaba arkadaşlar, bu makalemizde silverlight 2.0 ile birlikte karşımıza çıkan DataGrid kontrolünün kolon yapılarını ve özelliklerini inceliyeceğiz.Silverlight DataGrid kontrolünde üç adet kolon template’i var. DataGridTextColumnDataGridCheckboxColumnDataGridTemplateColumn DataGridTextColumn kolon tipi ile adında anlaşılacağı gibi text olarak verilerin gösterilmesini ve düzenlenebilmesini sağlıyor. DataGridTextColumn web ve windows kontrollerinde kullandığımız BoundField’lara benzer bir yapıdadır. Çeşitli özellikleri vardır. Bu özelliklerden bazılarını inceleyelim. CanUserResizeBu özellik kolonun yeniden boyutlandırılabilmesini sağlar. True ve false değeri alabilir. Default değeri true’dır.CanUserSortBu özellik kolona göre verinin sıralanabilmesini sağlar. True ve false değeri alabilir. Default değeri true’dır.CanUserReorderBı özellik kolonun yerininn değiştirlebilmesini sağlar. True ya da false değeri alır. Default değeri true’dır.BindingBu özellik kolon da gösterilecek olan veriyi bağlayabilmemizi sağlar. Örn; Binding="{Binding Name}"HeaderBu özellik kolon’un başlığını belirlememizi sağlar. IsReadOnlyBu özellik ile kolonun içerisindeki verinin salt okunur olup olmayacağı ayarlanır. True yada false değerleri alabilir. Varsayılan değeri true’dır. Kolon yapısını inceleyecek olursak, <data:DataGrid Margin="8,8,8,8" x:Name="grid" AutoGenerateColumns="False"> <data:DataGrid.Columns> <data:DataGridTextColumnIs ReadOnly="True" CanUserResize="False" CanUserSort="True" CanUserReorder="False" Binding="{Binding ProductID}" Header="Ürün ID"/> </data:DataGrid.Columns></data:DataGrid> Yukarıda kolonumuzu XAML’den ekledik. Peki kolonumuzu dinamik olarak yani run-time da eklemek istersek Ne yapacağız? Aslında oldukça basit. DataGrid’in columns isimli bir koleksiyonu var. Runtime da yeni bir kolon oluşturup Columns koleksiyonuna ekleyebiliyoruz. DataGridTextColumn yeniColon =new DataGridTextColumn();yeniColon.Header = "Yeni Kolon";yeniColon.Binding = new Binding("YeniKolondaGorutulenecekAlan");DataGrid1.Columns.Add(yeniColon); DataGridCheckboxColumn’ları da true ya da false değerlerini listelemek için kullanacağımız kolon tipidir. DataGridTextColumn kolon tipinin yukarıda bahsettiğimiz özellikleri DataGridCheckboxColumn ile ortaktır. XAML kodunu inceleyecek olursak, <data:DataGrid Margin="8,8,8,8" x:Name="grid" AutoGenerateColumns="False"> <data:DataGrid.Columns> <data:DataGridCheckBoxColumn Binding="{BindingProperty}" Header="Baslik"></data:DataGridCheckBoxColumn> </data:DataGrid.Columns></data:DataGrid> Runtime’da yazdığımız kod ile eklemek istersek, DataGridCheckBoxColumn yeniCheckBoxColon = new DataGridCheckBoxColumn();yeniCheckBoxColon.Header = "Yeni Kolon";yeniCheckBoxColon.Binding = new System.Windows.Data.Binding("YeniKolondaGorutulenecekAlan");grid.Columns.Add(yeniCheckBoxColon); DataGridTemplateColumn kolonu ise içlerinde en çok özelleştirilebilir kolon tipidir. İçerisinde Content tipinde bir özellik olduğu için içerisine istediğimiz şeyi atabiliriz. Örneğin DateTime tipinde bir Property’miz var. Bu Property’nin değerimi kullanıcıya kolon içerisinde DatePicker kontrolü ile gösterebiliriz. 2 çeşit template modu bulunuyor. CellTemplate, CellEditingTemplate. CellTemplate kolonun normal şartlardaki görüntüsünü bize verirken, CellEditingTemplate veriyi düzenlemek istediğimiz de karşımıza çıkacak. Yukarıdaki örneğe dönersek, Kullanıcıya DateTime tipindeki veriyi gösterirken CellTemplate, kullanıcı veriyi değiştirmek istediğin de ise CellTemplateEditing Template’ni gösterebiliriz. <data:DataGridTemplateColumn.CellTemplate><DataTemplate> <TextBlock Text="{Binding Tarih}"></TextBlock></DataTemplate></data:DataGridTemplateColumn.CellTemplate> Veriyi listelerken yukarıdaki gibi bir yapıyı kullanıyoruz. Güncellerken farklı kontrolleri de kullanıcıya gösterebiliriz. Bunun için kullanmamız gereken gereken CellEditingTemplate özelliğidir. Burada dikkat etmemiz gereken bir diğer özellik Binding özelliğinin Mode özelliğidir. Mode özelliğini TwoWay olarak belirttiğimizde List verimizin de güncellenmesini sağlıyoruz. <data:DataGridTemplateColumn Header="Tarih"> <data:DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBlock Text="{Binding SellStartDate}"></TextBlock> </DataTemplate></data:DataGridTemplateColumn.CellTemplate><data:DataGridTemplateColumn.CellEditingTemplate> <DataTemplate> <basics:DatePicker SelectedDate="{Binding SellStartDate ,Mode=TwoWay}"></basics:DatePicker> </DataTemplate></data:DataGridTemplateColumn.CellEditingTemplate></data:DataGridTemplateColumn> Run-Time da yani kolonları dinamik olarak eklemek istersek durum biraz karışık gibi görünüyor rünüyor JBunun için kullanılabilecek iki yöntem var. ReSources oluşturmak ve XAMLReader kullanmak. İlk olarak XAML tarafında ReSources oluşturalım. (Not: Resources, UserControl içerisinde bir dependency property’dir.) ReSources ile kolonların içerisine dinamik olarak DataTemplate ekleyebilmek için DataTemplate’lar oluşturabiliyoruz. <UserControl.Resources> <DataTemplate x:Key="DuzenleninceGorutulenecekKisim"> <TextBox Text='{Binding SellStartDate, Mode=TwoWay}' /> </DataTemplate> <DataTemplate x:Key="GorunecekKisim"> <TextBlock Text="{Binding SellStartDate}"></TextBlock> </DataTemplate></UserControl.Resources> Şimdi kod tarafına geçip templatefield’ı oluşturabiliriz. XAML’de Resources’e bir key vermiştik. Oluşturduğumuz DataGridTemplateColumn’ın CellTemplate ve CellEditingTemplate özelliklerine Resources’daki oluşturduğumuz DataTemplate’leri atadık. Custom templateleri dinamik olarak oluşturmak istediğimiz de bu şekilde DataTemplate’ler oluşturmak zorundayız. DataGridTemplateColumn template = new DataGridTemplateColumn();template.CellTemplate = Resources["GorunecekKisim"] as DataTemplate;template.CellEditingTemplate = Resources["DuzenleninceGorutulenecekKisim"] as DataTemplate;template.Header = "Tarih";grid.Columns.Add(template); Aynı işlemi XamlReader ile de yapabiliyoruz. Bunun için Resources da tanımladığımız gibi string olarak DataTemplate oluşturacağız. usingSystem.Windows.Markup; // Eklemeyi unutmayalımDataGridTemplateColumn tColumn = new DataGridTemplateColumn();tColumn.Header = "Tarih";StringBuilderkolonXaml = new StringBuilder();kolonXaml.Append("<DataTemplate xmlns=\"http://schemas.microsoft.com/winfx/2006/xaml/presentation\" xmlns:x=\"http://schemas.microsoft.com/winfx/2006/xaml\" xmlns:local= \"clr namespace:System.Windows.Controls;assembly=System.Windows.Controls\"><TextBlock Text = \"{Binding SellStartDate}\"/></DataTemplate>");tColumn.CellTemplate = (DataTemplate)XamlReader.Load(kolonXaml.ToString());kolonXaml.Append("<DataTemplate xmlns=\"http://schemas.microsoft.com/winfx/2006/xaml/presentation\" xmlns:x=\"http://schemas.microsoft.com/winfx/2006/xaml\" xmlns:local= \"clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls\"><TextBox Text='{Binding SellStartDate, Mode=TwoWay}' /></DataTemplate>");tColumn.CellEditingTemplate = (DataTemplate)XamlReader.Load(kolonXaml.ToString());grid.Columns.Add(tColumn); XAMLReader.Load Metodu ile String olarak oluşturduğumuz XAML kodu okunur ve geriye objenin tipine uygun sonuç döner.ç döner. Makalenin sonuna geldik, başka bir makalede görüşmek dileğiyle. .NET ve Silverlight ile kalın ;) Sem GÖKSUwww.semgoksu.com| www.yazilimgunlugu.comsem.goksu@yazilimgunlugu.com Kaynaklarmsdn.comsilverlight.net
29 Oca 2009 Silverlight DataGrid Bug ? Kategori: Yazılım Etiketler: Silverlight 2Silverlight 1 Yorum Silverlight DataGrid ile ilgili bir çalışma yaparken çok ilginç bir hatayla karşılaştım. DataGrid'de görüntülemek için bir Class oluşturdum. Oluşturduğum Class'ın erişim belirleyicisini yazmadım(varsayılan olarak internal işaretlendi.) Bir List oluşturup içerisine Oluşturduğum nesnenin örneklerini attım. Son olarak da DataGrid'in ItemsSource özelliğine List'i set ettim. Uygulamayı çalıştırdığım da hata verdi oysa ki hata vermesini gerektirecek bir hata yok. List'deki nesneleri test etmek için bir döngü ile tek tek aldım sorun yok. Sonradan Class'ın erişim belirleyicini public yaptım ve DataGrid'de veriler sorunsuz bir şekilde listelendi. BUG demek doğru olurmu bilmiyorum ama aynı assembly içerisindeki Class'ın public olma zorunluluğu çok gereksiz geldi bana :) namespace DataGridBug{ public partial class Page : UserControl { public Page() { InitializeComponent(); this.Loaded += new RoutedEventHandler(Page_Loaded); } void Page_Loaded(object sender, RoutedEventArgs e) { List<Haber> haberler = new List<Haber>() { new Haber() { HaberID=1, Baslik="Silverlight 2.0 ile İnteraktif Uygulamalar", Tarih= new DateTime(2009,01,10), YayinDurumu = true }, new Haber() { HaberID=2, Baslik="semgoksu.com Yenilendi !", Tarih= new DateTime(2009,01,10), YayinDurumu = true }, new Haber() { HaberID=3, Baslik="Windows Vista 7 Release oldu !", Tarih= new DateTime(2009,01,10), YayinDurumu = false }, new Haber() { HaberID=4, Baslik="Visual Studio 2010 Release oldu !", Tarih= new DateTime(2009,01,10), YayinDurumu = false } }; grid.ItemsSource = haberler; } } ? class Haber { public int HaberID { get; set; } public string Baslik { get; set; } public DateTime Tarih { get; set; } public bool YayinDurumu { get; set; } }}
29 Oca 2009 Silverlight DataGrid Kontrolü - Giriş Kategori: Silverlight Etiketler: Silverlight 2Silverlight 2 Yorum Merhaba arkadaşlar, bu makalemizde silverlight 2.0 ile birlikte karşımıza çıkan DataGrid kontrolünü tanıyıp, nasıl kullanıldığını ve çeşitli özelliklerini inceleyeceğiz.DataGrid kontrolünü verilerin listelenmesini sağlamak için kullandığımız web ve windows uygulamalarından biliyoruz. Datagrid, Silverlight 2.0 ile birlikte silverlighta eklendi. Ayrıca verileri listeledikten sonra kolonlara göre sıralama yapabiliyor, kolonların yerini değiştirebiliyoruz. Web’de kullandığımız DataGridView kontrolü gibi çok esnek bir yapıya sahiptir. Datagrid Kolonlarında Text, CheckBox yada kendi Templatelerimizi oluşturup verileri görüntüleyebiliyoruz. Yeni bir silverlight projesi oluşturarak DataGrid’de verileri listeleyelim. Projeyi ilk açtığımızda ToolBox’da DataGrid kontrolünü bulamayacağız. Bunun için ilk olarak projemizin referanslarına System.Windows.Controls.Data’yı eklememiz gerekiyor. Referansı ekledikten sonra DataGrid’i uygulamamıza ekleyebiliriz. XAML kodumuz aşağıdaki gibi oldu<UserControlxmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="DataGridGiris.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="700" Height="300"><Grid x:Name="LayoutRoot" Background="White"><data:DataGrid Margin="24,22,26,25" x:Name="grid" ></data:DataGrid></Grid></UserControl>Verileri listelemek için gerekli kodu da yazalım. Şimdilik data için kendimiz bir Haber class’ı oluşturalım ve içerisinde 4 tane property bulunsun: HaberID, Baslik, Tarih ve YayinDurumupublic class Haber{ public int HaberID { get; set; } public string Baslik { get; set; } public DateTime Tarih { get; set; } public bool YayinDurumu { get; set; }}Bu sınıfı kullanarak bir List oluşturalım ve içerisine birkaç haber ekleyelim. Haberleri ekleyip List’i doldurduktan sonra verimizi DataGrid’e bağlayabiliriz. Veriyi bağlamak için de DataGrid’in ItemSource özelliğini kullanıyoruz. (Hatırlarsanız WinForm - DataGrid ve WebForm GridView’inde DataSource özelliği vardı.)publicPage(){ InitializeComponent(); this.Loaded += new RoutedEventHandler(Page_Loaded);}void Page_Loaded(object sender, RoutedEventArgs e){ List<Haber> haberler = new List<Haber>() // Koleksiyon ilklendirme { new Haber() // Nesne İlklendirme { HaberID=1, Baslik="Silverlight 2.0 ile İnteraktif Uygulamalar", Tarih= new DateTime(2009,01,10), YayinDurumu = true }, new Haber() { HaberID=2, Baslik="semgoksu.com Yenilendi !", Tarih= new DateTime(2009,01,10), YayinDurumu = true }, new Haber() { HaberID=3, Baslik="Windows Vista 7 Release oldu !", Tarih= new DateTime(2009,01,10), YayinDurumu = false }, new Haber() { HaberID=4, Baslik="Visual Studio 2010 Release oldu !", Tarih= new DateTime(2009,01,10), YayinDurumu = false } }; grid.ItemsSource = haberler; }}Nesneleri oluştururken ve Koleksiyona nesne eklerken de C# 3.0’ın güzelliklerine değinmiş olduk JŞimdi projemizi çalıştırıp test edelim.Veriler geldi ama benim istediğim düzende değil. Bunun nedeni de Liste içerisinde ne varsa ekran da göstermesidir. Bunu da yapmasının nedeni AutoGenerateColumns özelliğindendir. Bu özellik veri içerisindeki her Property için gerekli kolonların otomotik olarak Grid tarafından yaratılmasını sağlar, varsayılan olarak true’dır. Bu özelliği false yaparak kendi kolonlarımızı ekleyebiliriz. Bunu yapmak için de tekrar blend’e dönelim. Grid’i seçip özellikler menüsüne gidelim. Buradan AutoGenerateColumns özelliğini false yapalım.Kolonlarımız otomatik olarak gelmeyecek ve artık istediğimiz gibi DataGrid’in kolonlarını biz düzenleyebileceğiz. Bunun içinde yine Özelikler menüsüne gidip Columns’a tıklayarak yeni kolonlar ekleyebiliriz. Açılan pencereden Add Another Item’a tıklayarak yeni kolonlar ekleyebiliriz.Add Another Itemdüğmesine tıkladıktan sonra, DataGrid’e ekleyeceğimiz kolon tipini seçiyoruz. Üç adet kolon tipimiz var. DataGridTextColumn, DataGridCheckboxColumn, DataGridTemplateColumn. Kısaca bahsetmek gerekirse DataGridTextColumn ile text verileri gösteriyoruz. Boolen tipindeki verileri DataGridCheckBoxColumn, bunların dışındaki seçenekler için de DataGridTemplateColumn’u kullanıyoruz. Üç tane DataGridTextColum, bir tane de DataGridTemplateColumn ekleyeceğim. Column’ları ekledikten sonra şimdilik 2 özelliği belirtmemiz yeterli olacak. Bu özellikler Binding ve Header. Binding bu kolonda gösterilecek olacak verimim yolunu, header ise kolon başlığını belirtiyor.DataGridTextColumn’larda HaberID, Baslik ve HaberTarihi’ni, Template field içine de bir CheckBoxekliyip SelectedIndex özelliğine de Data’dan gelen değeri bağlayacağım.<UserControl xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="DataGridGiris.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="700" Height="300"><Grid x:Name="LayoutRoot" Background="White"><data:DataGrid x:Name="grid" Margin="24,22,26,25" AutoGenerateColumns="False"><data:DataGrid.Columns> <data:DataGridTextColumn Binding="{BindingHaberID}" Header="Haber No"/> <data:DataGridTextColumn Binding="{BindingBaslik}" Header="Başlık"/> <data:DataGridTextColumn Binding="{BindingTarih}" Header="Haber Tarihi"/> <data:DataGridTemplateColumnHeader="Durumu" Width="120"> <data:DataGridTemplateColumn.CellTemplate> <DataTemplate> <ComboBox SelectedIndex="{Binding YayinDurumu}" Width="100" Height="20"> <ComboBoxItem Content="Pasif"/> <ComboBoxItem Content="Aktif"/> </ComboBox> </DataTemplate> </data:DataGridTemplateColumn.CellTemplate> </data:DataGridTemplateColumn></data:DataGrid.Columns></data:DataGrid></Grid></UserControl>XAML kodumuzu da düzenledik. Dikkat edersek verileri bağlamak için {BindingYayinDurumu} gibi bir yöntem kullandık. (Bu yöntem ASP.NET’ deki DataBound kontrolleri için kullandığımız Eval’a benziyor.) DataGridTemplateColumn kolonunun 2 görünüm özelliği var. CellTemplate ve CellEditingTemplate. CellTemplate kolonda ki bilginin sadece gösterilmesi için kullanılır. CellEditingTemplate ise kolonun içersindeki bilginin güncellenebildiği template’dir. İkisi de içerisine DataTemplate alıyor. DataTemplate’in içerisine de istediğimiz kontrolü atıp kullanabiliyoruz. DataTemplate’in içerisine ComboBox kontrolü ekledik. Itemlarında Pasif ve Aktif isimli 2 Item ekledim. 0 ve 1 değerleri geleceği için 0. Index’e pasif’i 1. Index’e de Aktif’i koyduk. SelectedIndex özelliğine de List’den gelecek olan YayinDurumu’nu bağladım. Artık her şey hazır. Son kez örneğimizi çalıştıralım.Makalenin sonuna geldik, başka bir makalede görüşmek dileğiyle. .NET ve Silverlight ile kalın ;)Sem GÖKSUwww.semgoksu.com| www.yazilimgunlugu.comsem.goksu@yazilimgunlugu.com Kaynaklarmsdn.comsilverlight.net
23 Oca 2009 Silverlight ile Web Servislerinin Kullanılması Kategori: Silverlight Etiketler: Silverlight 1 Yorum Herkese merhabalar, bu makalemizde Silverlight ile web servislerini konuşturarak web servis aracılığıyla çesitli islemler yapacağız.Silverlight üzerinde doğrudan sunucu taraflı veritabani erişimi olmadığı için XML yada Web Servisleri gibi farklı aracılar ile veri alişverisini sağlayabiliyoruz. Bu makalemizde de silverlight uygulamalarında web servisinin nasıl kullanildığına, veri alişverişinin nasil yapıldığına bakacağız. İlk olarak Visual Studio 2008’i açalım ve yeni bir silverlight projesi başlatalım. (Eger ilk kez silverlight ile uygulama geliştiriyorsak burayıokumanızı tavsiye ederim). Solution üzerinde bize 2 adet proje açılıyor. Biri geliştireceğimiz silverlight projesi diğeri ise geliştirdiğimiz uygulamayı test edebilmemiz için eklenen test projesi. Test projesine yeni bir web servis dosyası ekleyelim. Burada uygulamamızda kullanacagımız servisi hazırlayacagız. İlk olarak basit bir örnek ile konuya girelim. Örneğimiz de basitçe bir login ekranı tasarlayacagız. Silverlight uygulaması üzerinde kullanıcı adı ve sifre için textboxlar olacak. Kullanıcı, kullanıcı adi ve şifresini girip butona bastığında servise bağlanacak ve duruma göre kullanıcıya olumlu yada olumsuz bilgi dönecek. Simdi web servisimizi hazırlayalım. [WebMethod]publicbool KullaniciKontrol(string kullaniciAdi, string sifre){ if(kullaniciAdi=="semgoksu" && sifre == "12345") { return true; } else { returnfalse; }} Web servisimizi hazırladık şimdi silverlight uygulamasında kullanacağımız arayüzü hazırlayalım. Bunun için silverlight projemizi Expression Blend’de açalım. <UserControlx:Class="SilverlightWebServisOrtakligi.Page"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"Width="400" Height="300" xmlns:d=http://schemas.microsoft.com/expression/blend/2008 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"> <Grid x:Name="LayoutRoot" Background="White"><TextBox Margin="167,126,112,0"V erticalAlignment="Top" Text="" TextWrapping="Wrap" x:Name="txtKullaniciAdi"/><TextBox Margin="167,0,112,122" Text="" TextWrapping="Wrap" VerticalAlignment="Bottom" x:Name="txtSifre"/><Button HorizontalAlignment="Right" Margin="0,0,112,96" VerticalAlignment="Bottom"Content="Kontrol Et" x:Name="btnKontrolEt"/><TextBlock HorizontalAlignment="Left" Margin="133,0,0,126" Text="Sifre" TextWrapping="Wrap" VerticalAlignment="Bottom" FontWeight="Bold"/><TextBlock HorizontalAlignment="Left" Margin="85,128,0,0" VerticalAlignment="Top" Text="Kullanici Adi"TextWrapping="Wrap" FontWeight="Bold"/><TextBlock Margin="90,79,121,0" VerticalAlignment="Top" Text="ÜYE GIRISI" TextWrapping="Wrap" FontWeight="Bold" FontSize="16" Foreground="#FFFF0000"/></Grid></UserControl>Web Servisimiz ve formumuz hazir simdi tekrar visual studio 2008’e dönelim. Silverlight projesinin üzerine gelelim sag tıklayarak , Add Service Reference… tıklayalım. Gelen pencereden discover’a tıklarsak projemiz üzerinde ki servisi bulacaktır. Servise bir isim verip projemize ekleyelim. Silverlight projesine servisi ekledikten sonra artık yapmamız gereken butona tıklandiginda servise bağlanıp ilgilili metoda parametreleri yollamak. Bunun için paga.xaml.cs’e gidip Butonumuz için bir click event listener olusturalım. Sonrasında da referans olarak eklediğimiz servisin örneğini olusturalım. ServiceReference1.WebService1SoapClient loginServis = new SilverlightWebServisOrtakligi.ServiceReference1.WebService1SoapClient(); public Page(){ InitializeComponent(); btnKontrolEt.Click += new RoutedEventHandler(btnKontrolEt_Click);} void btnKontrolEt_Click(object sender, RoutedEventArgs e){ loginServis.KullaniciKontrolAsync(txtKullaniciAdi.Text, txtSifre.Text);} Dikkat edersek metodumuzun ismi bizim verdigimizden biraz daha farkli bir şekilde geldi. Bunun da nedeni silverlightın varsayılan şekli ile web servisleriyle asenkron olarak çalısıyor olmasındandır. KullaniciKontrolAsyncmetodu ile servise asenkron bir çagrıda bulunuldu. Peki çagrının sonucunu nasıl alacagız? Bunun da çözümü çok basit, metodumuz ile aynı isimde ve sonuna Completed eklenmiş bir event var. (Bu tüm metodlar için geçerli). Bu event tetiklendiginde bize eventarguman'dan result isimli bir property dönüyor. Bu property metodumuzun geri dönüş tipi ile aynı tipte oluyor. Şimdi KullaniciKontrolCompleted eventini oluşturup login işleminin sonucunu alalım. public Page(){ InitializeComponent(); btnKontrolEt.Click += new RoutedEventHandler(btnKontrolEt_Click); loginServis.KullaniciKontrolCompleted += new EventHandler<SilverlightWebServisOrtakligi.ServiceReference1.KullaniciKontrolCompletedEventArgs>(loginServis_KullaniciKontrolCompleted);} void loginServis_KullaniciKontrolCompleted(object sender, SilverlightWebServisOrtakligi.ServiceReference1.KullaniciKontrolCompletedEventArgs e){ bool sonuc = e.Result; if (sonuc) { MessageBox.Show("Giris Basarili"); } else { MessageBox.Show("Giris Hatali"); }} Evet şimdilik yapacaklarımız bu kadar artık uygulamamızı test edebiliriz. Uygulamamızın başarılı bir şekilde çalıştığını gördük. Uygulamayı bir adım daha ileri götürüp animasyon ile biraz daha süsleyebilirsiniz. Örnek kodlar için tiklayinizMakalemizin sonuna geldik, başka bir makalede görüşmek dileğiyle. .NET ve Silverlight ile kalin ;) Sem GÖKSUwww.semgoksu.com| www.yazilimgunlugu.comsem.goksu@yazilimgunlugu.com Kaynaklarmsdn.comsilverlight.netdaron.yondem.com