Soru - Cevap Bölümü
/ Kategori: Programlama
29/04/2010 - 14:10:22 cevap (18) Okunma : 3046 Bu yazıyı 2 kişi tuttu.
dropdown menu algoritması
Cevaplar
( Faydalı Cevapları Göster )
kirupa daki ornegi biliyorum ama as3 de daha farklı yaklasımlar olmalı event açısından !
not: ilk mesajımı as3 ile ekliyorum
var displayPath:Array = []
stage.addEventListener( MouseEvent.MOUSE_MOVE , moveHandler)
function moveHandler( e:MouseEvent):void{
yaz( e.target )
}
function yaz( target:Object ){
if( target != null ){
displayPath.push( target.name );
yaz( target.parent)
}else{
displayPath.pop();
displayPath.reverse()
txt.text = String(displayPath)
displayPath = [];
}
}
bu yontele iç içe girmis menu yu kontrol etmeye çalıstım ama pek basarılı olamadım tekrar deniyicem
hem kirupa orneginde çok eksik var :S açılan menu uzerinden dısarı çıkıldıgında hepsi kapanmıyor ?
yontemleri çok farklı sanırım
Hmm...
Olabilir, bence biz daha iyisini yaparız. Kirupa ve Flashden'de neymiş...:)
Başarılar...
1-) XML'in node yapısı kolay ayıklanabilir ve child-parent hiyerarşisi kolay okunabilir olmalı. Çünkü AS3'ün XMLNode metodunu kullanman gerecek.
2-) Node ayıklama işini yapan fonksiyonun ilk çalıştığında, fonksiyon tarafından kontrol edilen XMLNode değişkeni, kaynak XML'deki top level node yapısını ayıklamalı ve default (ilk görünen) menüyü kurmalı.
3-) Mouse event'i gerçekleştiğinde, Event'in çalıştırdığı alt fonksiyon, XMLNode değişkenini XML'in yapısına göre eğer alt menü varsa yeniden kurgulamalı ve ana fonksiyonu bu değişikliği referans gösterek yeniden çağırmalı.
4-) böylece teorik olarak sonsuz level bir menü sistemi kurgulanır.
İşin püf noktası, veri ayıklamada. Bu bir menü olduğuna göre, her menü grubunun elemanlarını gruplar halinde kontrol etmek ve mouse davranışına göre bu grupları etkin ya da pasif kılmak şart.
XML yapısını iç içe geçmiş node zincirleri olarak tanımlamak, işini bayağı kolaylaştırır. Çünkü XMLNode fonksiyonun, bu yapıya bağımlı olacak.
Balıktan kılçığı alacaksın ama eti de dağıtmaman lazım. Rakının gönlü darılır sonra..
İy çalışmalar.
merhaba Safa abi
tree menude uzmanlastım diyebilirim ( panel bile yazdım :S )
yapılacak sınırsız menu nun kaynak kısmı ve çözümlenmesinden ziyade
menu hiyerarşisinde mouse ile gezerken mouse hit problemi yasıyorum ?
mesela yukarıda yazdıgım kod mousenin nin bulundugu menu den recursive sistemi ile parent menu yu buluyor taki ana menuye erişinceye kadar devam ediyor buda açık kalması gereken menu leri bulmamı saglıyor
recursive den donen dizi + mouse nin bulundugu menu nun child menu su gorunur digerleri gorunmez durumdadır.
bu algoritmayı en kısa sürede pratige dökecegim ancak eminim baska yontemler var ?
peki siz hit problemini nasıl çözerdiniz merak ettigim bunun cevabı
fikirlerinizi bekliyorum
bu arada xml yerine json kullanıcam degisen bise yok tabiki
[
{ name:"anasayfa" , child:"false" },
{ name:"hakkimizda" , child:"false" },
{ name:"urunler" , child:
[
{ name:"A" , child:"false" },
{ name:"B" , child:"false" },
{ name:"C" , child:"false" }
] },
{ name:"iletisim" , child:"false" }
]
çoook tesekkürler kolaygelsin..<<
Json ve xml kurgusu biraz farklı olur. Şöyle söyleyeyim: İç içe geçmiş düzensiz verileri ayıklamaya dayalı işlemlerde standart bir algoritma tutturmak zor.
Önemli olan mantığı kavramak. XML ile nasıl çalışacağınızı, node'lar arasında nasıl gezineceğinizi anladığınızda canınız nasıl isterse öyle bir algoritma tutturursunuz.
Bu verileri mouse davranışları ile kombine kullanmak ise doğrusu biraz kafa karıştırıcı.
Ben genellikle array'lardan ve Display Object sınıfından yardım alırım. array aracılığı ile node'ların görünürlüğünü yönetmeye çalışırım.
Bir başkası ise event.target ve child-parent-container ilişkisi ile bunu yapar.
Hangisi kolaysa artık.
Bir örnek yapalım ve onun üzerinden konuşalım. Şöyle bir internette dolaştım da altın değerinde midir nedir sizin bahsettiğiniz tarzda ve as3 hiç örnek bulamadım. Parayla satıyor kefereler.
Yapalım bari.
Selamlar, Safa arkadaşımıza katılıyorum, elimizde bir örnek olursa daha zevkli konuşuruz diye düşündüm ben de ve çalakalem bir örnek hazırladım.
kirupadaki örneği hatırlıyorum, çok önce incelemiştim. onu tamamen unutarak kendi yöntemimle birşeyler yapmaya çalıştım, xml yapısını yukarıdaki örnekten aldım, hatta utanmadım (yeni bir xml yazmaya üşendiğim için) aynen o xml i aldım hehe.
kısaca çalışma prensibinden bahsetmem gerekirse, önce anamenu oluşuyor, her buton oluşurken bir alt nodeunu bir parametre olarak ekliyorum, sonrasında ustune gelinen buton bir altında node varsa olanları oluşturuyor.
her butonun ustune gelindiginde de kendi sırasında mı geziniyoruz, yoksa bir alta mı gittik, bir uste mi gittik bilmek icin indentLevel diye isimlendirdiğim bir değişken tutuyorum. bu toplam kaç tane alt menu açık bunun hesabını tutuyor, ustune gelinen butonlarında kendi levelları var tabi, bunları karsılastırarak silme islemi yapılıyor.
tum butonlardan cekildiginde ise bir sure baslatıyorum, belli bir sure tekrar buton ustune gelinmezse tum alt menuleri siliyorum.
doğru düzgün anlatamadım, bunun için örnek var zaten değil mi. :=)
not: başlaması benden geliştirmesi hep beraber.
iyi çalışmalar.
Ekli Dosyalar
Dosyalara ulaşabilmek için, üye iseniz giriş yapın, değilseniz üye olun.
- selftreemenuv1.zip
Ekli Dosyalar
Dosyalara ulaşabilmek için, üye iseniz giriş yapın, değilseniz üye olun.
- motioncoderas3treev1.rar
- motioncodertreemenuv1.jpg
@Safa kızılkaya algoritmamı yorumlamanı rica edebilirmiyim :D yorumların benim için değerli.
2 Farklı yöntem, ikisi de çalışıyor.
Ancak biri hem AS3 kod geliştirme mantığına daha yatkın hem de kuralına uygun bir biçimde kodlanmış.
Sevgili Mehmet, Tweener ile uygulamayı bağdaştırmış olman güzel.
Ancak algoritman, "gerekli ise üret gereksiz ise sil" biçiminde çalışmıyor.
Gizlemek, acemice bir çözüm. Zaafı da burada.
Enis'in uygulaması bu açıdan bence daha doğru. Çıkış noktamız bence Enis'in kodundaki level mantığı olmalı.
Her iki uygulamayı da inceledim...
Enis Bey'in Mouse_Out'daki bekleme süresi Mehmet Bey'in yaptığında yoktu. Bu da en ufak sınır dışına taşmada tüm menülerin kaybolması anlamına geliyor ki bu istenmeyen bir durum. Aynı şekilde Mehmet Bey olayları Tweener ile halletmiş. Sanırım bu iki tasarım birleştirilirse güzel bir algoritma açığa çıkacak. Bence bunu MMistanbul yapımı olarak ana sayfada herkesin (özellikle yabancıların) kullanıma açmalıyız. Tabi yanına başka kardeşler de gelmeli...:)
Genel olarak ise bu algoritma olabildiğince basit (dolambaçlı olmayan) ve esnek (her türlü şekle sokulabilen) olmalı. Bence bu algoritma için fazla karıştırmamak açısından 100 satır yeterli. Gördüğüm kadarıyla Mehmet Bey'in yaptığında diziyi saymazsak bu ölçülerde. Ama bu menüyü hep dikey olarak nitelendirmemeliyiz yatay kullanımı da olmalı.
Lütfen bu son söylediğimi basite almayın. Ben bir ara Kirupa'nın yaptığını yatay çevirdim ama tam istediğim gibi (az harften oluşan menüler arasındaki boşluklar) olmadı. Yani başta bunu düşünerek algoritmayı tasarlamayınca yaptığınız değişiklikler yeteri kadar esnek olmuyor. Yani olay tamamen this.y yerine this.x kullanmak kadar basit olmayabiliyor.
Başarılar...
@Safa "gerekli ise üret gereksiz ise sil" çok tesekkürler yorumun için genel kodlama prensiblerim arasındaki yerini aldı
html,css,javascript ile yapılmıs bu tarz menuleri biliriz menu ler birbiri içine yuvalandıkları için hit problemi kesinlikle yasanmaz ( yukarıdaki yaptıgım sistem tam olarak bu yapıyı temel alıyor) as3 ile bunu yapmam beni çok sasırttı o yuzden biraz heyecan yaptım. :S
menulerin iç içe yuva lanmasından kaynaklanan avantaj aynı zmanda çok buyuk bir dez avantaj oldugunu fark ettim child menunun merkez noktası parent menu oldugu için global bi kontrol saglanamıyor.
@enis örnek için çoook tesekkürler eline salık tekrar İNCELEMEYE ALIYORUM
olması gerekenler , eksiler , artılar seklinde devam edelim lütfen
çok tesekkürler..<<
merhaba @Salih
menuler iç içe yuvalayarak olusturuldugunda her item position:relative görevi üsleniyor buda menuyu her sekilde dizebilmemizde buyuk kolaylık saglıyor
dikey dizilimde saga açılım yerine yatay dizilimde asagı açılan menu nun kodlaması su sekilde olur
item.x = i*item.width
item.y = item.height
ama avantaj oldugu kadar dez avantaj oldugunu dusuyorum çunku daha extreme uygulamalar da alt menuleri position:apsolite olması gereke biliyor.
musait bir an @enis in yaklasımını inceleyecegim insallah hep beraber güzel bi sonuc üretecegiz.
kolaygelsin..<<
Kimler Burada? 
Son 1 dakika içinde MMIstanbul' da 55 (50 kayıtlı, 5 ziyaretçi) kullanıcı varmış. Login durumda olanlar aşağıda:
MMIstanbul Blog'undan
Blog Bölümü Blogevi.com'a Taşınıyor
Selam arkadaşlar MMIstanbul'da , tasarımcı ve programcıların blog yazılarını "feedleyerek" MMIstanbul okurlarını MMIstanbul dışın ...
7.500'üncü üyemiz Cem Koç!
Neler Yapılabilir?
500 Hatası Hakkında!
Reklam, MMIstanbul ve Yeni Projeler (Durumumuz Bu Tarzında)








Kirupa'nın tasarımına çok benziyor. Orada AS2 tasarlanmıştı. Yapı olarak çok güzel ve sonsuza kadar gidebiliyor. Bir gün AS3 için uyarlayım diyordum. Bir türlü vakit bulamadım ki...:(
Ehe, kodlarını incelemeye vakit buluyorum ama! Kirupa'yı bilmesem özgün tasarım diyecektim. Ancak XML yapısı çok benziyor: http://flashden.net/files/16543/data.xml
Action olayı çok iyi onu kullanmamış. Hadi esinlenmiş diyelim ha? Kodlarını çözsek belki aynısı çıkacak!