Expression Blend 2 – Obje Görünüm İşlemleri

4/11/2008
Merhaba bu makalede Expression Blend 2 de objelerin rengini, gradientliğini, efektlerini, transparanlığını düzenlemeyi inceleceyiz.


Blend ile tasarımlarınızı hazırlarken çizdiğiniz şekillerin rengini, transparanlığını, efektlerini ve buna benzer görsel öğelerini ayarlamalısınız. Aklınızdaki tasarıma ulaşabilmek içinse Blend’in size sunduğu tooları kontrol etmeyi bilmelisiniz.

Blend’de bir obje çizdiğinizde onun rengine, görünümüne karar vermelisiniz. Altta çizdiğim bir kare var ve “No Brush” ile karenin sadece borderlardan ibaret olmasını sağladım. Karenin iç rengi yoktur.

Brushes’ın ikinci tabı “Solid color brush” ile objeniz için tek bir renk belirleyebilirsiniz.

Objeniz için gradient geçişi “Gradient brush” ile yapabilirsiniz.

“Tile brush” ile objenizin içine başka objeler döşeyebilirsiniz.

“Brush resources” ile daha önce tanımlanmış ya da tanımladığınız fırçaları kullanabilirsiniz.

Altta bir kare için “Solid color brush” özellikleri gözükmektedir.
Fill : Objenizin renginin gözüktüğü alandır.
Stroke : Objenin çerçevesinin rengidir.
OpacityMask : Transparan bir objenin üstündeki maskedir. (Bunu makalenin ilerisinde daha detaylı göreceğiz.)
Color resource : Önceden belirlenmiş renkler deposudur.
RGB : Belirlediğiniz rengin RGB değerleri alanıdır.
A : Sadece dolgu rengi için transparanlık değeri
Renk belirleme çubuğu ve çemberi : Sürükleyerek renk seçebileceğiniz araçlardır.
Hexadecimal kutusu : Hex değerini girerek renk seçimi yapabileceğiniz kutudur.
Kaynak rengi butonu : Bu butonu şu makalemde anlatmıştım.
Renk seçim damlalığı : Tüm ekranınızdan renk seçebileceğiniz araçtır.
Opacity : Tüm objenin transparalık değeri
Visibility : Objenin görünür ya da gizli olmasını belirleyebileceğiniz seçenekler
RadiusX – RadiusY : Dikdörtgen için kenar yuvarlama değerleridir
StrokeThickness : Çerçeve kalınlığı

Özelliklerin yanlarındaki küçük beyaz kareler fix bir menü açar.

Örneğin doldurma rengini sıfırlamak için “reset” bu menüdedir.

Objenizi gradient olarak doldurabilirsiniz.

Gradient’inizin rengini değiştirmek için, gradienti oluşturan renk geçiş çubuğundaki renk kutucuğunu seçip üstten istediğiniz rengi seçebilirsiniz.

Renk geçiş çubuğuna tıklayarak daha fazla renk kutusu ekleyebilirsiniz. Renk kutularını sağa sola hareket ettirerek, renk geçişlerinde oynama yapabilirsiniz. Renk kutusunu istemediğinizde tutup aşağıya sürüklemeniz yeterlidir.

Gradientinizin boyunu, açısını değiştirmek için kullanacağınız “Brush Transform” tooludur.

Bu tool’a bastığınızda objenizin üzerinde ok belirir.

Bu oku kullanarak, gradientin açısını boyunu değiştirebilirsiniz.

Gradient için farklı durum opsiyonları vardır. Options butonuna tıklayarak bu durumlara ulaşabilirsiniz. Altta Gradientin “Pad” hali vardır.

Gradient “Reflect” durumu.

Gradient “Repeat” durumu.

Şimdi objelerimize ekleyebileceğimiz efektleri inceleyelim. Önce objenizin “Appearance” kutusunun altındaki oka tıklayarak kutuyu genişletin.

Efekt kutusu açılmıştır. Objenize uygulayabileceğiniz BitmapEffectleri alttaki menüdedir.

Altta “Bevel” uygulanmış bir kare bulunmakta. Objeye herhangi bir efekt uyguladığınızda o efektin özellikleri belirir. Bevel verdiğiniz kareye, birde Drop Shadow vermek istediğinizde, Bevel’ın kalktığını ve Drop Shadow’un uygulandığını göreceksiniz. Bir objeye birden fazla efekt uygulamanın yolu şudur.

Objenize yeni efekt olarak “BitmapEffectGroup” uygulayın.

Children (Collection) ın yanındaki butona basın.

Objenize birden fazla efekt ekleyebileceğiniz editör penceresi açılmıştır.

“Add another item” butonunun yanındaki oka tıklayın ve açılan menüden istediğiniz efekti seçin.

Kareye Bevel eklenmiştir. Efekt solda, özellikleri ise sağda listelenmiştir.

Kareye Bevel, Drop Shadow ve Blur uygulanmıştır.

Şimdi objelerin transparanlığını inceleyelim.

Alttaki örnekte karenin renk editöründeki Alpha değeri düşürülerek transparanlık sağlanmıştır. Fark edeceğiniz gibi bu sadece doldurma rengini etkilemktedir.

Aynı durum çerçeve içinde geçerlidir.

Tüm objenin transparanlığını “Appearance” altındaki “Opacity” ile ayarlayabilirsiniz.

“OpacityMask” ile oldukça kullanışlı transparan geçişler yalakayabilirsiniz.

Bu makalede Expression Blend 2 ile tasarım hazırlarken fazlasıyla işinize yarayacak renk, gradient, transparanlık ve efekt konularını inceledik

İyi çalışmalar

Teşekkürler.

Yorum Yaz

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

12 + 19 =