Acordiyon menü yapımı nasıldır?

Kayıt
5 Ocak 2010
Mesaj
1
Tepki
0
Merhabalar acordiyon menü yapamıyorum.aşağıdaki linkte dinamik akordiyon örneği var.
yardımsever bir arkadaşım bana yardım ederse bunu fla şeklinde hazırlayıp yada yazılı veya videolu anlatım sunarsa duacısı olucam.
Not;resimli ve dikey menü istiyorum arkadaşlar linkteki yatay ama bana acilen dikey ve dinamik olanı gerekiyor.nette çok araştırdım sonuç yok yok



http://img684.imageshack.us/i/fs0000000000000117.swf/
 
Kayıt
6 Ağustos 2009
Mesaj
69
Tepki
4
Bir çok yöntemi var ama en basiti ile ele alacak olursak sıralanmış yani indexlenen objelerin belli
mesafede kullanıcıdan alınan index'e (click) diğer objelerin mesafe kat etmesi. Her seferinde tıklanan
obje sabit diğerleri ise belirlenen aralıklarda hareket etmelidir. Bu temel manttığıdır. Tabi farklı mantıklarda yürütüle bilir. işte kodlar tabi kaynaklarını da vereceğim ama her ihtimale karşı burda olması faydalanmayı arttırır...

import com.greensock.*;
import com.greensock.easing.*;

var xml:XML;
var itemArray:Array = new Array();
var urlArray:Array = new Array();
var id:uint;
var masker:Shape = new Shape();
var container:MovieClip = new MovieClip();
var preLoading:preLoading = new PreLoading();
var mc:ImgHolder;
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, completeHandler);

try{
loader.load(new URLRequest("menu.xml"));
}catch(error:Error){
trace("HATA XML Dokumani yuklenemedi!");
}

function completeHandler(event:Event):void{
xml = XML(event.target.data);

for each(var it:XML in xml.children()){
var obj:Object = new Object();
obj.title = it.@Ititle;
obj.image = it.@IcontentData;
obj.link = it.@link;
urlArray.push(obj);
//trace(urlArray[it].link);
}

//urlArray = urlArray.reverse();

masker.graphics.beginFill(0xff0000);
masker.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
masker.graphics.endFill();

container.x = 0;
container.y = 0;
addChild(container);
addChild(masker);
container.mask = masker;
createItems();
}


//accordion arabirim yöntemi
function createItems():void{
var total:uint = urlArray.length;
for(var i:uint=0; i<total; i++){
mc = new ImgHolder();
mc.name = "item-" + i;
preLoading.x = mc.width/2;
preLoading.y = mc.height/2;
mc.addChildAt(preLoading,1);
mc.buttonBack.itemName.text = urlArray.title;
// mc MovieClip'i itemArray dizisinde eklenerek sıralı bir index
// oluşturmak amacıyla saklanır.
itemArray.push(mc);
container.addChild(itemArray);
// kütüphanedeki ImgHolder MovieClip'ini referans tutularak
// itemArray dizisinin eleman sayisi kadar coğaltıyoruz.
// her seferinde i ile 48 çarpılarak 48'in katlarını x koordinatında yerleştiriyoruz.
mc.x = i * 48;
trace(i + ":" + mc.x);
// posX itemArray dizisinin indexine göre sıralanan her bir mc MovieClip'inin
// x koordinatını hafızaya alır. mc MovieClip'inin hareketi bittikten sonra
// hafızadaki yerine geri gidebilmelidir.
itemArray.posX = mc.x;

var url:String = String(urlArray.image);
var loader:Loader = new Loader();
loader.load(new URLRequest("images/" + url));
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageCompleteHandler);
mc.itemLoader.addChild(loader);
}
}

function imageCompleteHandler(event:Event):void{
var bmp:Bitmap = event.target.content as Bitmap;
bmp.smoothing = true;
TweenLite.to(bmp, 1, {alpha:1});

for(var i:uint = 0; i < itemArray.length; i++){
itemArray.buttonMode = true;
itemArray.mouseChildren = false;
itemArray.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
itemArray.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
itemArray.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);

TweenMax.to(itemArray, 1, {colorTransform:{tint:0x000000, tintAmount:0.3}});
}
}

function mouseOverHandler(event:MouseEvent):void{
// MOUSE_OVER olayı ile kursor hangi MovieClip üzerinde ise bize id yani indexlenen
// elemanın sırasını yani indexin kendisini verecektir.
id = itemArray.indexOf(event.currentTarget);
moveToItem();
}

function mouseOutHandler(event:MouseEvent):void{
TweenMax.to(event.currentTarget, 1, {colorTransform:{tint:0x000000, tintAmount:0.3}});
}

function mouseDownHandler(event:MouseEvent):void{
var gotoURL:String = String(urlArray[id].link);
navigateToURL(new URLRequest(gotoURL),"_self");
}

function moveToItem():void{
// itemArray dizisi içersindeki id'ye eşitlenen MovieClip
var mc:MovieClip = itemArray[id] as MovieClip;
TweenMax.to(mc, 1, {colorTransform:{tint:null, tintAmount:0}});
for(var i:uint = 0; i < itemArray.length; i++){
// itemArray dizisi içersindeki MovieClip'lerin kendisi
var tempMc = container.getChildByName("item-" + i);
if(tempMc.x > mc.x){
// container MovieClip içine eklenmiş (addChild()) MovieClip'lerin
// yani(itemArray)dizinin hazıfaya alınan x koordinatından id'ye eşitlenen
// MovieClip'in enini cıkararak hareket edilecek mesafeyi veriyoruz.
//
TweenMax.to(tempMc, 1, {x:((tempMc.posX) + (mc.width -48)), ease:Quart.easeOut});
}
else if(tempMc.x <= mc.x){
// ve tekrardan hafıza alınmış x koordinatı ile eski pozisyonlarına geri dönüyorlar.
TweenMax.to(tempMc, 1, {x:(tempMc.posX), ease:Quart.easeOut});
}
}
}


kaynak :

http://rapidshare.com/files/430737679/soley_accordion.rar
http://hotfile.com/dl/82459282/f081eab/soley_accordion.rar.html
 
Yukarı Alt