Merhaba arkadaşlar. Expression Blend'i (ExBl) ilk açtığımızda ne tür proje yapmak istediğimiz soruyor. NET platformu geldikten sonra Microsoft'un tüm geliştirme uygulamaları hep proje tabanlı çalışıyor. ExBl'de farklı proje tiplerinde uygulama geliştirmek mümkün. Sadece Silverlight uygulaması için "Silverlight Application" türünü seçin. Proje adınızı ve nereye saklamak istediğinizi belirtin. Son olarak Silverlight uygulamanızı geliştirmek için kullanmak istediğiniz dillerden birini (Visual Basic ya da C#) ve silverlight sürümünü seçin. Ok deyin.
Bu seçimlerden sonra ekrana aşağıdaki gibi bir silverlight projesi gelecektir. İlk başta boş bir çizim alanı gelir. Bu beyaz alan sizin silverlight uygulamanızın görsel sınırlarıdır. Bu alanın dışına geliştirme sırasında taşabilirsiniz ancak derlendikten sonra sadece beyaz alan görünür olacaktır. Bu alanı küçüktüp büyütmek tabiki mümkün. İlk olarak Ekrandaki User Control ve altındaki layout seçeneklerine bakalım. User Control geliştirdiğimiz silverlight uygulamasının ana nesnesi. Diğer bütün nesneler (çizimler, şekiller vs) bu nesnenin alt nesneleridir. Silverlight'ta bu şekilde ekrandaki nesneler arasında hiyerarşik biri ilişki vardır. User Controlün hemen altında LayoutRoot diye bie nesne göreceksiniz. Bu da diğer nesneleri bir arada tutmayı sağlayan bir nesnedir. varsayılan olarak gelir. Ancak kullanmak zorunda değiliz. Canvas dediğimiz daha kullanışlı bir gruplama nesnesi kullanacağız. Bu nesne sayesinde istediğimiz nesneleri istediğimiz gibi gruplayabileceğiz. Şimdi LatouyRoot'u sağ tıklayıp, Change Layout Type > Canvas yapalım. Daha sonra User Control'ü seçip ekranın sağ tarafında bulunan Properties penceresinden width ve height özelliklerini değiştirerek istediğimiz boyuta getiriyoruz. Ben 400 x 300'lük bir alan yaptım. Aynı şekilde LayoutRoot nesnesini de seçip 400x300 boyutlarına ayrıca getirmek gerekiyor. Properties penceresi, "Object and Timeline" penceresinde seçtiğimiz nesnelerin özelliklerini gösterir. İstediğimiz nesneyi ister Objects and Timeline" penceresinden, istersen ekranda üzerine tıklayarak seçebiliriz. Seçilen nesnenin etrafı mavi bir renkle gösterilir. Her nesnenin farklı özellikleri vardır. Properties penceresi seçilen nesneye göre içeriğini değiştirir. Bu nedenle seçtiğiniz nesneyi dikkat etmek gerekir.
Şimdi yeni bir nesne ekleyelim. En soldaki toolbox'da Rectangle aracını seçin ve ekranda istediğiniz bir yere dikdörtgeninizi çizin. Çizim bitince Object and Timeline penceresine dikkat edin. Son eklediğiniz bu nesne hiyerarşide el alta eklenir. Bu nesneyi seçtiğinizde properties penceresinde bu nesneye yönelik özellikler gelir. İsteğimizi değişiklikleri burada yapabilirsiniz. Deneye yanılma ile kolaylıkla farklı özelliklerin ne işe yaradığını görebilirsiniz. Önemli olan bir nokta, nesnelere isim verip vermemektir. Vermek zorunlu değildir. Ancak ileride kod yazarak bu nesneleri kontrol etmek istiyorsanız şimdiden bir isim vermeniz iyi olur. İsim vermek için Proerties penceresindeki en üst kutucuğa bir isim giriniz. İsim verirken boşluk kullanmadan, noktalama işaretleri kullanmadan, rakamları kullanarak ve amacına uygun bir isim vermeniz gerekmektedir. Örneğin MaviKutucuk gibi.
Yine önemli olan bir başka konu da ExBl'in tüm çizim ve animasyonları aslında bir XML dosyası olarak saklamasıdır. Kendine has bu formata XAML formatı dedir. Bunu görmek için View \ Active Document View seçeneğinin altındaki 3 alternatiften birini seçin. Split dediğinizde hem XAML hem de çıktısını aynı anda görebilirsiniz.
Bundan sonra ister arayüzde değişiklik yapın ister XAML'de değişiklik yapın. Her ikisi de aynı anda diğerine yansıyacaktır.
Projemizi bu haliyle kaydetmek için File> Save All diyelim. Prki projemizi nasıl çalıştıracağız? Klavyeden F5 tuşuna basarsak varsayılan tarayıcımızda projemizin çıktısını görürüz. Ben Chrome kullandığım için aşağıdaki gibi görüntü gelecektir. Sizler IE kullanıyorsanız IE gelecektir.
Tarayıcımızı kapatıp ExBl'ye geri dönebilirsiniz. F5'e basarak yaptığımız işlem projemizi derlemek. Bu işlem sırasında tüm kodlar (XAML ve ileride göreceğimiz code-behind kodları) derlenir. Eğer hata varsa derleme yapılmaz ve hata mesajları ekranın altında birikir. Bu hataları teker teker halletmeden derleme yapılmaz. Derleme sonunda ise projeniz içinde Bin\Debug klasörü içine gerekli dosyalar oluşturulup yerleştirilir.
Bu dosyalardan Xap uzantılı dosya bizin ürünümüzdür. Derlendiği için tekrar açılamaz. Ancak projemiz içerisinde derlenmemiş hali olan MainPage.xaml dosyası halen ExBl içinde açık bir şekilde saklanmaktadır. Projemizi kaydedip çıktığımızda proej klasörüne bir göz atın. İçerisindeki dosya ve klasör yapısını asla bozmayın. Bir yerden bir yere taşımak istediğinizde tüm klasörü olduğu gibi taşıyın ya da kopyalayın. Yoksa projenizi başka bir yerde açamayabilirsiniz. Şimdilik bu kadar. Görüşmek üzere.
Halil Ersoy
Teşekkürler, yardımcı oldu. :)
YanıtlaSil