Skip to main content

Button Tab Action

  1. Navigate to HSYCO Manager

  2. Create a new project or open an existing one

  1. Go into the Home Page

  1. Click "add"

  1. Add a "Container"

  1. Click "edit"

  1. Give the container an ID ("container1" for example)

  1. Click "add"

  1. Add a "Text" object and go back to "edit" mode

  1. Move the "Text" object inside the container by dragging the "Text" field in the Select panel under the container

  1. Change the "Text" displayed to "Container 1"

  1. Now close the container and select it in the Select page

  1. Right-click on it and select "Duplicate"

  1. Move this new container to the right

  1. Change his ID to "container2"

  1. Select the "Text" object under the new container

  1. Change the "Text" to "Container 2"

  1. Click "add"

  1. Add a "Button"

  1. Click "edit"

  1. Change the "Label" to "Show Container 1"

  1. Change the "Action" to "tab"

  1. Change the "Container" to "container1"

  1. Change the "Group" to "group1"

  1. Right-click the button and duplicate again

  1. Move this new button above the right container

  1. Change the "Label" to "Show Container 2"

  1. Change the "Container" to "container2"

  1. The "Group" is the same for both the buttons

Tip: Now we will set the two containers' visibility to "Hidden" so that they are shown only when the button is pressed

  1. Select the first container

  1. Uncheck the "Visible" checkbox

  1. Select the other container

  1. Uncheck the "Visible" checkbox

  1. The page should look like this:

  1. Click "Save" to save the project

Tip: Done! Now we can try the buttons

  1. Click "Run" and then "Default" to launch the application

  1. The two containers are hidden because we set the visibility to "Hidden"

  1. Click the first button

  1. As you can see, the linked container showed up while the other didn't

  1. Click the second button

  1. Now, the second container is visible while the first is not