How Do I Know the Functionality of the Designer?

1610 views

SmartUX Designer offers various capabilities for designing attractive web client applications. This video explores different features provided by SmartUX Studio.

1. Viewing the code with View Code

The View Code feature on the top-right corner in SmartUX Designer tool serves as a template or HTML editor, enabling users to create and edit HTML code seamlessly. It also provides a user-friendly interface with syntax highlighting, code completion, and error checking.

2. Customizing Widget Appearance with Styles Tab

The Styles tab at the bottom pane provides a way to apply CSS to customize the appearance of widgets in your web application. This feature is useful for managing and implementing visual design elements such as colors, fonts, margins, and other styling attributes efficiently. The Intellisense further enhances the centralized approach, simplifies the styling process, and ensures an appealing look of the Component consistently within the application.

3. Enabling/Disabling Widgets Visibility

The right pane displays a tree structure outlining the valid Widgets as per your template on the Canvas. To improve the visualization of Widget properties affected by dynamic values, we suggest clicking on the eye icon alongside the Widget name in the Outline view.

Clicking this icon toggles into the visibility status indicator (visible/invisible). Thus, the Wdget’s presentation on Canvas adapts dynamically offering you a transparent and user-friendly way to preview and control the visibility of Wdgets within the form.

4. Accessing Property Sheet

The Go to Property Sheet button for Widgets enables you to click on a Widget in the outline tree and display the corresponding Property Sheet. This action not only highlights the selected Widget on the canvas but also in the bottom pane, ensures seamless navigation and clear visualization of the Widget properties.

5. Modifying Dynamic Properties of Widgets

The Dynamic Properties within the property sheet of Widgets enable you to add, modify, and manage dynamic properties for Widgets seamlessly. You can also add dynamic properties directly from HTML to the Property Sheet. Additionally, you can hide and delete dynamic properties to customize the Widget’s behavior and appearance as desired.

6. Storing Frequently Used Form Components

The Save As Component Template feature enables you to save Form Components as templates in SmartUX Studio. You can then reuse frequently used Forms. In Studio mode, you can save a Component as a template using the Save dropdown.

7. Managing Routes

With SmartUX Designer you can create both Magic xpa and Angular Routes, completely with parameters and outlet names for both Eager and Lazy Loading. This feature manages Routes for various Modules efficiently. It also offers to delete Routes.

8. Adding Magic xpa Programs

You can add a Magic xpa program using Add Program dialog. 

9. Locating Desired Program in the List

You can locate a desired Program or a Form by name using the Search functionality. It brings up the searched item quickly. You can simply enter the name of the Program or a Form you are looking for, and SmartUX Studio promptly displays the relevant results.

Share this Article

How Do I Know the Functionality of the Designer?

Or copy link

CONTENTS