Navigation menu with sub menu expand effect

Hi everyone

For navigation in small and limit screen, people use some sort of menu bar with hide/show capability.
The navigator icon only show in normal state and when user hover mouse over icon it expand and show some text description of each icon. Also each item can have sub menu to select.
This is useful to save precious monitor spaces.

As an good example please take a look at following link from IGX scada:

<img src="//ia-discourse.s3-us-west-

I want to know is it possible to implement this kind of effect in ignition?
Is there any item or ready library for this?
The real difficulty is how to expand navigator screen when mouse over on it?

Thanks.

Have you looked at the Tree View Table component?

Kind of like the beginning of this video? You can achieve what you want with a template canvas/template repeater.

https:/uploads/iatesting/original/2X/a/ab550940d9f3f4fcdfe8099addd202fa71cbe559.mp4

1 Like

yes exactly. How he did this??? Should buy it from kymera?
I’m really new to ignition. could you please help me and explain this little more or implement a template for me.

Tree view does the work but it’s not the style that I’m looking for.
also I want to hide the menu to extend the screen and when mouse hover it it expand again.

Look into the template repeater. In the template that you will be repeating, you’ll have a button and maybe another template repeater inside that, with a different template in it. Hover over the first template will show the other repeater and resize itself. Then when the mouse exits, it’ll stop showing the inner repeater and resize itself. Hope that gets you on the right track.

2 Likes

Hi,

Is it possible to have the same feature (Menu with Submenu expand effect) in Perspective Menu Tree?

Thanks and Regards,
Hari GB.

You may be able to achieve this with the new accordion component coming in 8.0.14

You can also submit a feature request for native support in future versions.

Thanks you Garner, Will raise feature request.