How to hide or show a layer or graphic symbol by its name in Adobe Animate (HTML5)

[aavp1020]

Is there a way to hide or show timeline layer or graphic symbol by its name in adobe animate? wanted to hide uncessory graphic symbols from stage which are kept in a perticulate layer named Layer_graphics1" and "Layer_graphics2".

Action: Wanted to hide all symbols or perticular layer by clicking button.

these "Symbols" are placed in respective layers:

Layer_graphics1 = Symbol1, Symbol3, Symbol11
Layer_graphics2 = Symbol2, Symbol12

Thank you,

[BioME]

I toggle the visibility of symbols and layers all the time.  However, you can’t do it use a graphic symbol because it must be named.  That’s not a problem; it’s easy to re-designate it.  Just select the symbol, click ctrlF3 to pop up the properties window, and make sure Object is selected.  At the top of the window there’s a drop down that allows you to choose to make the symbol a movie clip, button or graphic.  Pick Movie Clip, and enter a name into the dialog box immediately below the drop down.  For instance, you could call it SymbName. 

Next you will need to assign a variable.  Here’s the required ActionScript command.

var togSymb:Boolean = true;  

togSymb is just the name to designate the variable.  You can use any name you like.  I put this command into the first frame of the file. 

Now you’re ready to enter the following action script.  This could be in the keyframe where the symbol is located, however it’s good practice to isolate your action script and object in separate layers. 

SymbName.visible = togSymb;

SymbName.addEventListener(MouseEvent.CLICK, FunctName);

function FunctName (event:MouseEvent):void

{          togSymb = !togSymb;

SymbName.visible = togRATE;

}

When you play your swf, every time you click the symbol then it will vanish.  The only problem is that because you’ve hidden the symbol you can’t toggle it back on without additional code.  One solution is put another instance of the symbol in a layer beneath the first.  Set the alpha of this second symbol to 0 to make it transparent.  Thus, it will be there to click but won’t be seen.  You can then give the transparent copy a different name and enter the code like what’s shown above to toggle the visibility of the first symbol back on.  If it’s not clear how to do that let me know and I’ll be happy to provide additional instructions.

Now as far as layers, it would be nice if you could just hide them directly, but I haven't found a method for doing so.  If anyone else knows of one I would very much like to learn it.  What I do is create a movie clip symbol that covers the screen, that's the same color as the background.  I then place it into a layer that above all of the other layers I might want to hide.  I then use the method describe above to toggle the visibility of that symbol.  When a user clicks the background the visibility of all the lower layers will toggle on and off.  You can also attach the listener to buttons.  If you would like instructions for doing that please let me know.

[BioME]

Upps, I see I made a type in the code.  The last line read "SymbName.visible = togRATE;"  The word togRATE should have been togSymb.    

[aavp1020]

I was trying in the Html5 and not in actionscript, but thank you for your elaborated description and solution. it really help me. I liked an idea to "create a movie clip symbol that covers the screen". Thank you for that.

However, it wasn't what i was seeking at that time but you can see below post of "Use Advanced Layers." if you still seeking the answers of this post then its worth to see below link. it will give you an idea about some extend.

https://community.adobe.com/t5/animate/how-to-hide-or-show-a-layer-in-js-html5-canvas/m-p/11166831?p...

[ClayUUID]

Apparently I missed this post the first time around. But since you've bumped it...

You don't need a separate variable just to toggle visiblity. All you have to do is:

mySymbol.visible = !mySymbol.visible;