bug in fisheye menu met SimpleButtons

[Ontzettend]

Hallo!

Ik heb dit fisheye menu (http://www.samuelwan.com/downloads/com.samuelwan.eidt/fisheyemenu/FisheyeMenuDemo.html) omgebouwd voor AS3, en ik gebruik em voor een rijtje TextButtons (extends SimpleButton). Deze buttons zijn childs van een Sprite, en als ik over de Sprite hover wordt de fisheye actief. Aan de linkerkant van de buttons heb ik een marge van 10 pixels gelaten, en als i daarbinnen hover werkt de fisheye prima, de hoogte en de y-positie van de buttons worden uitstekend gerenderd. Echter, als ik over de buttons zelf hover, gaat er iets mis met de fisheye, en worden de hoogtes van de buttons niet geleidelijk kleiner, maar dat sprint een beetje irritant heen en weer tussen de maximale (die een button heeft als je er met de muis op staat) en minimale grootte.

Als je over de buttons hover, wordt er geswitcht tussen hun 'overState' and 'upState'. Er lijkt een conflict te zijn tussen het setten van de hoogte-waardes door het fisheye-algoritme en door het hoveren over de buttons (waardoor ws. de hoogte terug wordt gezet naar de waarde die de button kreeg toen deze geïnstantieerd werd.)

Is er enige manier om dit probleem te verhelpen? In het bovenstaande fisheye menu voorbeeld wordt er een AS2 'FSelectableListClass' gebruikt, maar ik kan geen AS3 class vinden die hetzelfde doet. Dien ik iets anders dan TextButtons te gebruiken om mijn menu te vullen? Want de fisheye techniek doet het prima.

Hier twee regeltjes code uit de Menu class. De buttons zitten in een Array voor easy access:
var item:TextButton = kwButtons[i];
item.height = var h:Number = getAscendingH(i, focusSpan.beginIndex-1, focusSpan.yMin, DISTORTION);


Elke TextButton state is een Sprite met een label (TextField) en een background (Shape). De hoogte van de button wordt bepaald als deze wordt geïnstantieerd, en dan is z'n waarde de maximale waarde die hij kan krijgen (= als erop gefocussed wordt in het fisheye menu mits deze normaal werkt).

Als je enig idee hebt hoe ik dit moet oplossen, dan hoor ik graag van je! Ik heb em op Actionscript.org ook in het forum (http://www.actionscript.org/forums/showthread.php3?t=156446) gegooid, daar staat nog wat extra info. Bedankt vast voor de hulp!

[theFlashWizard]

Je hebt mouseChildren op false gezet? Want nu kan hij een rollOver krijgen op het textfield ipv de knop zelf. Met mouseChildren op false ziet hij de knop als 1 geheel.

[Ontzettend]

Ja, ik heb de mouseChildren van de buttonStates nu op false staan, maar dat heeft geen effect. Het is denk ik ook niet de TextField die roet in het eten gooit, maar de button zelf. De hoogte van de button wordt nl. bepaald door zowel het fisheye-algoritme als de rollOver op de button. En die laatste wil ik zodanig wijzigen, dat de rollOver de hoogte niet aanpast, maar alleen de state (wel of geen achtergrond).

[theFlashWizard]

Is het een mogelijkheid de height property te overriden en deze zelf te beheren?

[Ontzettend]

Ja, daar zat ik ook aan te denken, maar hoe doe ik dat? Die buttonStates worden geïnstatieerd met een height, dien ik die misschien ergens vandaan te trekken.. Alleen dan moet ik van elke button opslaan wat z'n huidige height moet zijn, zonder dat ie deze al heeft.. ofzo.. Sorry, ik ben een beetje lost :X

Hier de TextButton class:


public class TextButton extends SimpleButton
{
public var selected:Boolean = false;
public var dimensionID:int;
public var keywordID:int;
public var keywordLbl:String;
public var label:String;

public function TextButton(txt:String, color:uint, dimension:int, keyword:int, width:Number, height:Number, type:String, viz:String)
{
upState = new TextButtonState(color, 0x000000, txt, width, height, true, true, "", viz);
downState = new TextButtonState(color, 0xFFFFFF, txt, width, height, true, true, type, viz);

hitTestState = upState;
overState = downState;
}
}

[Ontzettend]

Ok, ik wil dus eigenlijk de height uit de buttonState halen, en een soort default buttonState creëren. Als er vervolgens een rollOver plaatsvindt dienen alleen andere waarden dan de height te worden aangepast (zoals background en textcolor). Het probleem is alleen dat die deafult buttonState ook maar één keer geïnstantieerd wordt en dan ook al een height moet hebben.. toch?

[Dauntless]

Ik begrijp het nog steeds niet helemaal, maar kan je bij het instellen van de hoogte (vanuit het fisheye algoritme) niet gewoon een nieuwe overState toekennen aan de button (wat dan een DisplayObject is met de juiste grootte) ?

[Ontzettend]

Dat is wel een slim idee! Het probleem is alleen dat er zo'n 20 items in mijn menu zitten, en bij elke pixel beweging van de muis wordt die fisheye geupdate. En elke pixel beweging betekent twee nieuwe states (zowel overState als upState, want de height-verandering gaat door ookal ben je niet op die button gefocussed) voor elke button, dus er wordt daardoor megaveel gerekend.. misschien iets teveel?

Daarbij doet ie nog niet wat ie zou moeten met de onderstaande code.

In de TextButton class nu een setNewState toegevoegd, die de originele state properties (behalve de height) uit een array (upProps en downProps) haalt.


public function TextButton(txt:String, color:uint, dimension:int, keyword:int, width:Number, height:Number, type:String, viz:String)
{
var newColor:uint = Colors.adjustBrightness(color, -150);

upState = new TextButtonState(color, 0x000000, txt, width, height, true, true, "", viz);
upProps = [color, 0x000000, txt, width, height, true, true, "", viz];

downState = new TextButtonState(newColor, 0xFFFFFF, txt, width, height, true, true, type, viz);
downProps = [newColor, 0xFFFFFF, txt, width, height, true, true, type, viz];

hitTestState = upState;
overState = downState;
}
public function setNewState(newHeight:Number):void {

downState = new TextButtonState(downProps[0], downProps[1], downProps[2], downProps[3], newHeight, downProps[5], downProps[6], downProps[7], downProps[8]);
overState = downState;

upState = new TextButtonState(upProps[0], upProps[1], upProps[2], upProps[3], newHeight, upProps[5], upProps[6], upProps[7], upProps[8]);
hitTestState = upState;

}


En die wordt in de Menu class aangeroepen in het fisheye algoritme.
button.height = h; heb ik vervangen door button.setNewState(h); .

Maar dat doet dus nog niet wat het moet doen.. Ik puzzel even verder op deze toer, bedankt in elk geval!

[Dauntless]

Het conflict is met de upState en de overState, niet? Die verandert toch niet bij de buttons waar je niet over gaat? Dus als je over een button in het midden gaat, en je gaat dan over de button daarboven, dan wordt toch alleen de onRollOver van die button getriggered en de rest blijft gewoon op de up-state staan? (En dus geen conflict voor de andere items?)

[Ontzettend]

De overState verandert inderdaad niet als je er niet overheen gaat, maar de upState verandert wel altijd, aangezien de grootte van elk item in de list wordt aangepast op basis van elke beweging die je maakt. Andere buttons worden dus niet zozeer getriggerd door een rollOver alswel door het fisheye algoritme.