Edge Animate - How can i access and change a text from a button in different symbols? - adobe-edge

I have this:
ELEMENTS:
Stage - symbol_1
- symbol_2
So,... i would like to change a text inside symbol_2 from a button on symbol_1, using sym.$("Text").html("NewText"); What's the correct path!?

In the click event of symbol_1 -> button write this:
var stage = sym.getParentSymbol();
var sym2 = stage.getSymbol("symbol_2");
sym2.$("Text").html("NewText");
This code works if both symbol_1 and symbol_2 are children of Stage.
Please note that symbol_1 and symbol_2 are the instances names of the symbols, as they appear in the "Elements" panel (not in the symbol library)

Related

RollOver and RollOut effect in buttons

I'm using the code bellow to change the color of button on rollover and rollout and clicked. I have following issues in this
1. The color did not changed when button is clicked.
2. Button wont work after once clicked.
pages.gotoAndStop("home");
// list of button instance names
var previousClicked:DisplayObject;
var buttonsss:Array = [home, menudown.about, menudown.portfolio, menudown.clients, menudown.pricing, menudown.contact];
for each ( var mc:MovieClip in buttonsss)
{
mc.buttonMode = true;
mc.mouseChildren = false;
mc.addEventListener(MouseEvent.MOUSE_UP, onClick);
mc.addEventListener(MouseEvent.ROLL_OVER, rolloverEffect);
mc.addEventListener(MouseEvent.ROLL_OUT, rolloutEffect);
}
function onClick(e:MouseEvent):void
{
pages.gotoAndStop(e.target.name);
e.currentTarget.mouseEnabled = false;
TweenLite.to(e.currentTarget,2,{tint:0x666666, ease:Strong.easeOut});
TweenLite.to(previousClicked,2,{tint:null , ease:Strong.easeOut});// set the previous clicked to null tint
previousClicked.addEventListener(MouseEvent.ROLL_OUT, rolloutEffect);// restore the Roll_Over effect
previousClicked = DisplayObject(e.target); // update the last clicked button
e.target.removeEventListener(MouseEvent.ROLL_OUT, rolloutEffect);
}
function rolloverEffect(e:MouseEvent):void{
TweenLite.to(e.currentTarget,2,{tint:0x666666, ease:Strong.easeOut});
}
function rolloutEffect(e:MouseEvent):void{
//should change tint to null just when its enabled, but its changing always (enabled or disabled)
TweenLite.to(e.currentTarget,2,{tint:null , ease:Strong.easeOut});
}
How I have always done this is with the built in buttons instead of doing it with code.
If you click window up in the top bar then click on components (near the bottom) it will bring up a little window then if you expand the user interface folder and drag and drop from the button item. Then with that button on the stage if you double click on it you will go into the edit symbol screen and it will have pictures of each state that the button and if you double click on the state you want then you can visually edit that version of the button.
Hope this helped.
Note: I first started with flash pro-cs5.5 and your tag says flash-cs5 I don't know for sure if that function is available or not in 5.
I am unfamiliar with Tweenlite, but I'm guessig that what it does in this case is simply change the color, am I right? If so, I'd suggest creating the color changes on your timeline and using framelabels combined with gotoAndStop to create the different effects. This should also solve your problem concerning the button not working after it has been clicked once.

Accessing instance from symbol class

I have created a text field with the type "Input text" and put the instance name to NameInput. I have also created a MovieClip symbol which works like a button. Basically, I want to trace what text/input NameInput has from the button class.
trace(NameInput.x) does not work and shows the error "1120: Access of undefined property NameInput."
How can I access the instance NameInput from the button class?
When you say trace(NameInput.x), ActionScript looks for an object within your button with that name, and doesn't find it. You might be able to try
var nameInput = MovieClip(this.parent).getChildByName('NameInput');

Frame labels & function parameters

Is it possible to change a frame label within a gotoAndStop('label') with the parameters in a function?
I'm playing around with updating code as I learn more and more techniques, and at the moment the code is a basic click-a-button to select the object shape, and on press the button disappears:
// Change the object into a circle.
circle_btn.addEventListener(MouseEvent.CLICK,function(){changeShape_fun(circle_btn,circle);});
// Change the object into a square.
square_btn.addEventListener(MouseEvent.CLICK,function(){changeShape_fun(square_btn,square);});
// Change the object into a star.
star_btn.addEventListener(MouseEvent.CLICK,function(){changeShape_fun(star_btn,star);});
function changeShape_fun(shape_btn,frame){
shape_btn.visible = false;
main_mc.gotoAndStop('frame');
}
However I can't/don't seem to know how to change a frame label through function parameters, or if what I'm trying to do is even possible.
Also to note, while I'm all ears for any more efficient ways of doing what I'm trying to do, I would still like to know how/if you can change frame labels through function parmeters.
Thanks! :)
You're very close, but you're trying to go to a frame called 'frame' and not the string contained within the frame variable. Try this instead:
// Change the object into a circle.
circle_btn.addEventListener(MouseEvent.CLICK,function(event:MouseEvent){changeShape_fun(circle_btn, 'circle');});
// Change the object into a square.
square_btn.addEventListener(MouseEvent.CLICK,function(event:MouseEvent){changeShape_fun(square_btn, 'square');});
// Change the object into a star.
star_btn.addEventListener(MouseEvent.CLICK,function(event:MouseEvent){changeShape_fun(star_btn, 'star');});
function changeShape_fun(shape_btn,frame){
shape_btn.visible = false;
main_mc.gotoAndStop(frame);
}
This will go to a frame within main_mc called 'circle' when you click the circle or 'square' if you click the square, etc.

actionscript 3 event.target

I have a movie clip named button1 and in this movie clip
there is a dynamic text named txt
public function mouse_down(event:MouseEvent)
{
if(event.target==button1)
{
...//this only recognizes when i click the button without intersecting the dynamic text area
}
if(event.target==button1||event.target==button1.txt)
{
...//this works
}
i would like to know why it dosen't recognize clicks made in the area that contains the dynamic click if i don't specify it, because txt is part of button1, so normally i would only need to check if the target is button1 but it dosen't work:i also have to check if the target is button1.txt
Thanks for your help!
event.target always points to the object the event originated from, even if it is nested in the object you added the listener to. Use event.currentTarget instead.
Check out this blog post to learn more.

ColorPicker not editable in Form -> FormItem

Please note the remark mentioned WORKAROUND at the end of this question.
Based on a Dictionary based specification, one of my classes creates a Form programmatically.
Adding TextInput or DatePicker to FormItemss works as expected.
Unfortunately, the following code just creates a colored rectangle, not the actual picker:
ti = new ColorPicker();
ColorPicker( ti ).selectedColor = TAColor( _spec[ key ].value ).color;
and later on
formItem.addElement( ti );
The Form is embedded in a TitleWindow component presented using
PopUpManager.addPopUp(...);
When added to TitleWindow, it shows up correctly, within Form->FormItem not:
I can't image, why the picker doesn't appear. Do you?
WORKAROUND:
If I wrap the ColorPicker inside a Group things work:
ti = new Group();
Group( ti ).addElement( new ColorPicker() );
In this case, the ColorPicker appears as editable.
Still, I'd be too happy to learn what the problem with my initial solution. Bug?
A DateField (which extends ComboBase like ColorPicker) behaves properly in a spark Form. But in the ColorPicker, the mouse down handler of the button never gets called. I think that maybe the skin part that handles the mouse clicks (it must be a button) is not properly dimensionned, and the result is it is not shown. I've come to this conclusion because within an mx Form, the ColorPicker doesn't display as it does when it is added to the regular displaylist...
Hope this helps...
In the code you've provided, you never add the colorPicker as a child to any parent container; as such it will never show up anywhere.
You probably need to do something like:
formItem.addChild(ti );
[or for a Spark formItem]:
formItem.addElement(ti );
I'm confused as to why you're seeing a rectangle.