Change Visibility Of

1. Define the Action in UI Design

• UI Design module and select the screen where you want to define the action.
• Create the component whose visibility you want to control (e.g. a warning text, description box or additional field).
• Example: When the user checks the ‘Show Details’ box, an explanation text should appear.

• + ADD ACTION menu, select the trigger event (Initial Actions, OnClick, etc.) that suits your needs and add the UI Control > Change Visibility Of action.

2. Configure Action Parameters

• Component To Change: Select the element whose visibility will be changed. Example: ‘ExplanationText’ text
• Visibility:
  
  • Visible: The component becomes visible.
  • Hidden: The component is hidden.

This visibility status can be defined as a fixed value or managed dynamically using conditional expressions. The ‘Add Condition’ option is used for this purpose.

On a form screen, when the user selects the ‘Show Details’ checkbox, an explanatory text should appear; when the checkbox is deselected, the text should be hidden.

Application Steps:

1. Switch to the UI Design module.
2. Add a Checkbox element and name it ‘ShowDetailsCheck’.
3. Add a Label element, enter the description content.
4. Click on the Checkbox element, select the following action from the +ADD ACTION menu:
   
   • OnChange → UI Control → Change Visibility Of
5. Action Parameters:
   
   • Component To Change: DetailsText

• Conditional Visibility Settings: The visibility of different components can be controlled based on the user's role, selected category, or filled fields. Example: Only users with the ‘Administrator’ role can see certain fields.
• Multiple Element Control: Multiple elements can be made visible/hidden under the same action. Example: When the ‘Detailed Search’ box is checked, multiple filter fields can be made visible.
• Other Actions: Change Visibility Of can be combined with actions such as Change Enabled Of, Set Value, and Call Method to create more comprehensive user flows.

Technical Risks

• Complex Conditions: Applying different visibility rules for different situations can make the structure complex. Therefore, descriptive names and conditions should be used.
• Design Consistency: Appropriate UI adjustments should be made to ensure that no empty space is left in place of hidden components and that no scrolling issues occur.

Change Visibility Of is a powerful tool used in the Kuika platform to make the user interface more intuitive and context-aware. It provides a clean look by hiding unnecessary information and displays information to the user when needed, offering a dynamic and intelligent interface experience.