UIs of Nexacro Studio

The most basic tasks you can do through Nexacro Studio constitute drawing a Form and writing codes to program how the Form works. To facilitate such tasks, the Studio offers various features including the clear-cut provision of the information on the properties held by the components on a Form.

Screen Area

Description

1 Menu, Tool Bar

Ribbon interface

Toolbar that controls the menu area, TextStyle, Alignment, and Object

(From the 17 version, you can choose either the existing interface or the ribbon interface.)

6 Status Bar

Status bar indicating Nexacro Studio’s current state

View

3 Form Design

Editing Design, Source, Script

Dock Windows

2 Explorer

- Project Explorer

- Resource Explorer

4 Properties

Displays and edits Forms and various components, and associated properties such as Dataset and event properties

5 Message Window

Displays various messages and search results

Menu, Toolbar and Ribbon Interface

This is an area that accommodates the menu bar as well as either the toolbar or the ribbon bar. You can switch between the toolbar and ribbon bar based on your choice.

The menu bar and toolbars display or hide their member items according to the status of the relevant project and file.

Menu bar and Toolbar

You can select the display of a certain toolbar by accessing the menu [View > Toolbars]. Checked toolbars will be displayed. You can do the same with the context menu opened by right-clicking the menu or toolbar area.

menu_view_toolbars

If you move your mouse to the front part of the toolbar, the mouse will change to a move type cursor. You can then click the area and drag it to another location.

Ribbon Interface

Ribbon menus are a default interface. All the menus under the same category are bundled into one ribbon tab. Clicking a menu in the menu bar will show buttons of relevant features under the bar.

You can expand/hide the ribbon area to secure sufficient workspace.

The Quick Access Toolbar is a customizable toolbar that contains frequently-used commands. It can be situated above or below the ribbon area. The default location is above the ribbon, and select [Show Below the Ribbon] to bring it down.

Status Bar

Different status values are displayed in the Nexacro Studio status bar.

Statusbar


Function

1

Message indicating the state of Nexacro Studio

- Shows the progress when a project is opened or closed.

- Shows the description about a certain menu item when you stop a mouse pointer over the relevant item.

2

Current coordinates of the mouse cursor

3

Coordinates of the selected component, calculated within the Form (unit: pixel)

4

Size of the selected component (unit: pixel)

5

The status of the current file.

If the file is read-only, the indicator word "READONLY" will light up.

6

The status of the Insert key (INS, OVR).

The indicator will light up if the cursor is placed on the Source or Script editor pane.

7

On/Off status of the Caps Lock key

8

On/Off status of the Num Lock key

9

Location of the cursor when it is placed on the Source or Script editor pane

You can toggle on/off the status bar by accessing the menu [View > Status Bar].

View

A 'view' is an area where users edit files included in a project. Views are arranged in the form of a multiple-document interface (MDI) and can be laid out at users' discretion.

Arranging Views

Views can be maximized or minimized while you can change the order of view tabs by dragging them.

Tabs

A view takes the form of a tab. Maximizing only one view will inevitably cause all the other views to be maximized.

You can change active views by clicking tabs. Otherwise, click the Active Files button (a downward triangle icon on the right side of the tab area) and select a view that you want to activate.

Cascade Windows

To apply a cascade layout to the arrangement of views, access [Window - Cascade] in the command bar interface. Otherwise, right-click the title bar of a view window and select [Cascade] from the context menu.

Tile Windows

To apply a tile layout to the arrangement of views, access [Window - Tile] in the command bar interface. Otherwise, right-click the title bar of a view window and select [Tile] from the context menu.

Arrange Icons

Views can be minimized into icons and freely move within the Form Design pane area. When those icons are scattered around, you can arrange all of them on the bottom left corner of the pane at once by accessing the menu [Window - Arrange Icons]. Otherwise, right-click one icon and select [Arrange Icons] from the context menu. You cannot apply This function to non-minimizable views.

Form Design

Use the Form Design window to create and edit the screens of an app. It consists of the Design Window, Source Editor, and Script Editor tabs displayed at the bottom of the Form Design Window.

The activation status of a toolbar can change according to various conditions such as the type of editing mode and which object is selected.

For example, the Align toolbar will not be activated until users select the components in the Design window. Furthermore, each item in the Align toolbar may or may not be activated depending on the aspects of selecting components.

Design Window

Access the Design window, by selecting the Design tab at the bottom of the Form Design window.

You can arrange components anywhere in the Design Window by cutting, copying, pasting, and moving them. The Form Canvas area where you arrange components can be changed to whatever the developer wants.

Design Window

Source Ediitor

Access the Source Editor window by selecting the Source tab at the bottom of the Form Design window.

This window shows all form content except for script content in XML format, where it can be edited directly.

Source Window

XML source codes will be created automatically when you arrange components or other objects on the Design window, change their properties, or add events. If you correct source codes directly through the Source editor, errors may occur since you can violate the predetermined object creation rules.

Script Editor

In the Script Editor Window, you can edit the Form's JavaScript components, such as event handling functions.

Script Window

The functions and events currently in use are listed in the combo box on the upper part of the Script Editor window. Select an item to move to the code location.

Dockable Windows

For common features that are used regardless of the types of menus and files, Nexacro Studio encloses them in dockable windows.

Rearranging Windows

All the windows of Nexacro Studio can be rearranged or hidden, except the title bar and Form Design pane.

Displaying/Hiding Windows

In the Project Explorer window as shown below, notice that there are icons on the left of the title row. These icons can be used for closing or hiding the corresponding functions.

Statusbar

Callout

Function

1

It automatically hides a relevant window depending on the setting.

When the window is hidden, the window's name is displayed as a tap on the right/left side of the screen. The window will appear again when you move the mouse over the tap or when you choose the window on the [View] menu.


Depending on the setting, the icon will be changed as follows.

When it is set to fix a window

When it is set to hide a window automatically

2

It closes a relevant window

If there are several layers of windows, the windows can be hidden and displayed by tapping on the right/left side when they are set to be hidden automatically.

Moving Windows

You can move a window anywhere on the Nexacro Studio interface or on your monitor. If windows overlap each other, simply tap on the one you want to pull to the front of the display.

Changing Location

A window can be moved by right-clicking the title bar of the window and dragging it to where you want to place it.

For example, if you use two monitors, you can place the Form design window on the left monitor and the properties window on the right monitor.

Docking Windows

You can also dock a window in the Nexacro Studio UI to another window. You can arrange windows anywhere except the areas for the tool bar and the status bar. Also, you cannot move the Form Design Window.

While dragging a window to another location, if a mouse pointer is placed over another window, you will see an icon that guides you to choose where to re-dock the moving window.

Statusbar

Callout

Docking Function

1

Based on the window you are moving, the docking functionality determines the possible docking location. As soon as you place the mouse pointer on the direction option, the designated area will be marked as shown in callout 2.

3

Not based on the corresponding window, the docking function determines a location for the window being moved on the whole screen.

In the example above, when you choose 1, the properties window is located right above the Form design window. However, when you choose 3, the properties window is placed right under the tool bar.

Combining Tabs

When re-docking a window, the window can be combined with other windows as a tab, except the Form Design window. A window can be combined with the Form Design window by placing it outside the Form Design window.

Except for the Form Design window, you will see an additional option which tells you that you can choose the middle of the icon when you combine a window with other windows. When you move the pointer to the corresponding area, the area to be combined is highlighted in the corresponding window and you will see the tab on the bottom of the window.

You can move all tabs of the window which includes the combined tab by dragging the title bar of the window. Also, you can move a single tab included in the window by dragging the corresponding tab on the bottom of the window.