Silverlight + Expression Blend

Çarşamba, 5 Kasım 2008 04:41 by ikivanc
Silverlight Geliştirme Gereksinimleri:

* Silverlight 2
* Visual Studio 2008 SP1
* Silverlight Tools for Visual Studio 2008
* Expression Blend 2 + SP1

Geliştirme eklentileri gerekmektedir.

Silverlight hakkında genel tanıtımları ve geliştirmeleri özellikle Daron Yöndem olmak üzere pek çok geliştirici tarafından türkçe makaleler yayınlanmıştır. Ben de burada silverlight hakkında temelleri verip ileride bu konular hakkında spesifik makalelere yer vereceğim.

Öncelikle bu makalemizde C# ta Silverlight ve Expression Blend'i tanıyalım.
 
Expression Blend’ de bize WPF ve Silverlight Geliştirme imkanı sunuyor. Silverlight 1 ile JavaScript tabanlı web projeleri geliştirilirken Silverlight 2 projesi  sekmesinde code-behind dil seçeneği imkanı sunmakta. C#, Visual Basic gelişimi standart ,eklentilerle birlikte IronPython ve IronRuby geliştirme imkanı sunmakta.

Tool Sekmesi



 Tool sekmesinde silverlight projemizde kullanacağımız komponentler bulunmakta. Bunlardan Selection (V):  Seçildiği bileşenin vektörel özelliklerinde değişiklik yapmasına yardımcı olur.
 Direct Selection (A): Bileşenleri çalışmamızda seçmemize ve taşımamıza yardımcı olur.
 Pan(H):  Çalışma alanını hareket ettirmemizi sağlar.
 Zoom(Z):  Çalışma alanına yaklaşıp uzaklaşmamız sağlar. Tek tıklama ile zoom, Alt tuşu ile tıklandığında Zoom out yapar.
 EyeDropper(I): Çalışma alanında tıklandığı pixel’in rengini seçerek çalışmada kullanmamızı sağlar.
 Paint Bucker(F): Vektörize şekillerin içini renkle doldurmamızı sağlar.
 Brush Transform(G):  Gradient renklendirmelerde geçişlerin yönünü ve şiddetini belirler.
 Pen(P): Çizimlerde vektörel grafikler çizmemizi sağlar.
 Pencil(Y):  Kalem aracı ile çalışma alanında çizimler sağlar.
 Rectangle(M): Dikdörtgen çizim aracı.
 Eclipse(L): Daire çizim aracı.
 Line(ç): Çizgi çizim aracı.

 
 
 




 
Bu temel çizim araçlarının yanında foksiyonel componentlar da “Asset Library” içinde bulunmaktadır. Bu araçları sonraki makalelerde tek tek inceleyeceğiz.


Object and Timeline

Object and Timeline penceresinde çalışma alanında bulunan vektörel çizimler ve komponentler yer alır. Buradaki sıralamalar çalışmadaki nesnelerin hangisinin  üstte olacağını belirler. Ayrıca Timeline kısmı da animasyonlarda kullanılmak üzere nesnelerin hareket zamanlamasını belirler.

Interaction

Burada da animasyonlarda bulunan durumlar yer almaktadır.

Project

projede yer alan dosyaları gösterir ve projeye eklenen dosyaların yönetimini sağlar. XAML dosyalarını Blend’de modifiye edebilirsiniz. Diğer dosyaları açmak için Visual Studio ‘yu kullanacağız. Projede bulunan bileşenleri incelersek;

References klasörü:
Sistem gereksinimlerinin bulunduğu sistem klasörüdür.
Properties klasörü: Projemiz hakkındaki assembly özelliklerinin bulunduğu klasördür.
App.xaml ve App.xaml.cs: Silverlight uygulamalarında standart olarak bulunan dosyalardır.
Page.xaml: Yaptığımız uygulamaların bulunduğu XAML kodları formatında bulunduğu tasarım kısmıdır.

<UserControl
        xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
        x:Class="Silverlight_Giris.Page"
        Width="640" Height="480" xmlns:System_Xml="clr-namespace:System.Xml;assembly=System.Xml">
        <UserControl.Resources>
           <Storyboard x:Name="Storyboard1"/>
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot" Background="White">
          <Button Height="31" HorizontalAlignment="Left" Margin="179,114,0,0" VerticalAlignment="Top" Width="84" Content="Button"></Button>
          <TextBox HorizontalAlignment="Left" Margin="179,76,0,0" VerticalAlignment="Top" Text="TextBox" TextWrapping="Wrap"/>
        </Grid>
</UserControl>


Page.xaml.cs:
Page.xaml kodlarının arkasında code-behind olarak çalışan kodların bulunduğu dosyadır. Düzenlemeleri Visual Studio ile yapıyoruz.
 

Çalışma Alanı

Çalışma alanında 3 farklı geliştirme seçeneğimiz bulunmakta:

Design:
Tasarım modunda kodları görmeden arayüz geliştirme yapmamızı sağlar.
XAML: Kod geliştirme için sadece kodların ekranda görünmesi ile geliştirme imkanı verir.
Split: Ekran görüntüsünde de görüldüğü gibi hem kod hem de tasarımın görünmesini sağlar.

Properties

   
“Özellikler” kısmında da seçili nesneye ait özellikleri arayüzü kullanarak düzenlememizi sağlar. Renk seçeneklerinden, fonta, boyuttan görünüm özelliklerine kadar çeşitli özellikleri barındırır. Sağ üst köşede bulunan seçeneklerden ise istenirse “Event”lar istenirse de özellikler seçilip gerekli düzenlemeler yapılabilir.

Resources

Resources kısmında da projede bulunan hiyerarşide proje hakkında detaylar yer almaktadır.

Menü


Expression Blend’de menü kısmı da proje geliştirme ve yönetme için gerekli olan tüm özellikler mevcut.

Data


Data bölümü silverlight projesi için gerekli olan veri aktarımının görülebileceği ve düzenlenebileceği bölümdür.

Bu yazımızda silverlight gereksinimleri ve silverlight & WPF geliştirme aracı olan Expression Blend 2'nin SP1 'li yapısını inceledik ve son olarak da Expression Blendde Silverlight projesine nasıl başlanılacağından bahsettik. Sormak istediğiniz ve düzeltmek istediğiniz yerleri ibrahim.kivanc@msakademik.net  mail adresine iletebilirsiniz.

Hepinize Kolay Gelsin...
Tags:  
Categories:   Silverlight
Actions:   E-mail | del.icio.us | Permalink | Yorumlar (0) | Comment RSSRSS comment feed

Yorumlar

Yorum ekle


 

  Country flag

biuquote
  • Yorum
  • Canlı önizleme
Loading