9-Slice Scaling nedir , nasıl hazırlanır ?
Yazar : E.Altuğ YILMAZ
Merhaba arkadaşlar ;
Flash içerisinde tasarım ya da programlama sürecinde sahnede kullandığınız ya da kullanacağınız objelerin boyutlandırma sorunu mutlaka sizinde başınıza gelmiştir. Obje aspect ratio denilen kendi birebirlik oranını geçtikçe bozulur. Bu özelliği Adobe hem Flash hem Fireworks hemde Flex ve AIR çalışmalarındaki tasarımlarda imkan vererek hem tasarımsal hemde scaleX ve scaleY sayesinde kod ile yapacağımız ölçeklendirmelerde bozulmaların önüne geçmeye çalışıyor.
scale9Grid seçilen bir objeyi 9 ayrı parçaya bölündüğünü farz ederek sadece ortadaki parçanın büyümesini olanak verir. Yani geriye kalan kısımlar objenin boyu büyüse bile değişmeyecektir. Bu özelliği sadece MovieClip ler destekliyor. Yani bu işlemi yapmanız için kullanmanız gereken obje kesinlikle MovieClip olmalıdır. İlk olarak size bu özelliği kullandığınızda alacağınız sonucu göstermek istiyorum :
Örnekte ilk olarak 150×100 boyutlarında kenarları yuvarlanmış olan bir dikdörtgen yaptım. Daha sonra aynı objenin kopyasına scale9grid uygulayarak bu objenin boyutunu 350×100 olarak ayarladım. İkinci kopyaya ise herhangi müdahalede bulunmadan objenin boyutunu 350×100 olarak ayarladım. Aşağıdaki resimde açıkça görülüğü gibi scale9grid özelliği uygulanmış örnekte herhangi bir bozulma yok, uygulanmamış olanda ise bozulma derecesi baya yüksek.
Bu özelliği kullanmanın iki yolu var, birincisi objeye birebir olarak sahnede bu özelliği vermek ikincisi ise bu işlemi Actionscript kodları ile yapmak. İlk olarak bu işlemi sahnede yapalım.
İlk olarak sahnede 150×100 boyutlarında kenarı yuvarlatılmış olan bir dikdörtgen çizin.Daha sonra bu objeyi seçerek F8 tuşuna basın. Eğer önünüze çıkan pencere aşağıdaki gibi değilse “Cancel” butonunun altındaki “Advanced” butonuna tıklayın.
Daha sonra “Enable guides for 9-slice scaling” seçeneğini işaretleyip “Ok” tuşuna basın. Unutmayın bu özellik sadece MovieClip ler için geçerlidir. Şimdi oluşturduğunuz MovieClip e çift tıklayıp MovieClip in içerisine girin. Alacağınız görüntü aşağıdaki görüntüye benzer bir görüntü olacaktır.Bu görüntüde çizgili olan rehber çizgiler ölçeklendirmeye katılacak kısımı içeride kalacak şekilde belirler , bu çizgileri gerektiği noktada tekrardan üstüne gelerek konumlandırabiliriz.
Gördüğünüz gibi çizdiğiniz dikdörtgenin üzerinde kesik çizgili hat bulunmakta.Bu hatları ihtiyacınıza göre düzenleyebilirisniz. Aşağıdaki resimde ise kırmızı ile işaretlenmiş alanlar yani orta kısım objenin boyu değiştiğinde değişecek olan bölümdür, geriye kalan kısımlarda obje boyu değişse bile herhangi bir değişme olmayacaktır.
Şimdi ise bunu Actionscript 3.0 içerisinde nasıl yapabiliriz ona bakalım.Öncelikle 9-Slice içerisinde kalacak şekili kare olarak köşe koordinatlarını vererek tanımlamamız gerekiyor.
import flash.geom.Rectangle;
var rect:Rectangle = new Rectangle(16, 16, 119, 68);
bg_mc.scale9Grid = rect;
bg_mc.width= 400;
gibi bir yapıyla ile runtime oluşturulacak şekillere de 9-Slice Scaling özelliği kazandırabiliriz.Yazıda faydalandığım görseller için Engin Yöyen'e teşekkür ederim.Faydalı olması dileğiyle...
25/9/10
selam ben senay, gercekten super bir blog, eger facebook veya twitter varsa eklemek isterim...