Newbie - can this be done easily - have no coding experience

Question

Hi,I'm very new to Animate and need to do a thing if its not too complicated. I have 4 shapes that I convert to symbols and call them Shape1, Shape2, Shape3 and Shape4. These 4 symbols I want to be visible all the time in the same position. When there is a click on Shape1 I want my symbol Txt1 to be shown next to Shape 1. When there is a click on another of the shapes I want the corresponding Txt2, Txt3 or Txt 4 to be shown. Only 1 of the textboxes may be visible at a time.  Is this code something I can find online somewhere and copy paste and make my own adjustments after? Or maybe there is a video that shows to go about this - I have not been able to find this.

JoãoCésar17023019 · Answer

Hi.

One way to do this type of interactivity is to store the current displayed text field in a property or variable and everytime the user clicks on a shape we check for it and set the visibility to false. Like this:

var root = this;

root.showTextField = function(e, data)
{
	if (root.currentTextField)
		root.currentTextField.visible = false;
	
	data.textField.visible = true;
	root.currentTextField = data.textField;
};

root.shape0.on("click", root.showTextField, this, false, { textField: root.txt0 });
root.shape1.on("click", root.showTextField, this, false, { textField: root.txt1 });
root.shape2.on("click", root.showTextField, this, false, { textField: root.txt2 });
root.shape3.on("click", root.showTextField, this, false, { textField: root.txt3 });

Learn more about the on method here:

https://createjs.com/docs/easeljs/classes/DisplayObject.html#method_on

Please let us know if you need further assistance.

Regards,

JC

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded