Wizard | Form and Other Files

Form Creation Wizard

A new form can be created using the New Form Wizard, which is launched using [File > New > Form]

As soon as a Form is created, the corresponding editor view will be opened automatically.

Step 1 Location

The first step is to determine the name and path of a new Form. You must enter a Form's “Name” and “Location.” A Form file is managed by a service, so you cannot designate paths other than a relevant service as a location of a Form file.

You can select among registered Form templates. As a Form template already defines its layout and position, you can click the Finish button to complete the creation of a Form without undergoing the later steps.

Step 2 Layout

As for Layout, you can specify information on the layouts used in the Form. The width and height values specified for the default layout will represent the properties of the Form.


call-out

Description

1

Add Layout

Adds a layout.

2

Delete Layout

Deletes a selected layout.

You can specify the following properties for a layout.


Description

name

Layout name (unique identifier)

screenid

Defines screens that will be used in the layout

- You can select multiple screens from the ScreenDefinition list.

width

Sets the width of the layout

height

Sets the height of the layout

stepcount

Specifies the number of step pages, into which the layout will be divided

stepindex

Specifies the index of the step page that will be displayed right after loading the Form

description

Adds the description about the layout. This has nothing to do with function.

mobileorientation

Specifies the orientation of a mobile device, in which the layout will apply

Forms in the same location must have unique names.

A form must have one layout at least, and you cannot delete a default layout because it is essential.

Step 3 Position

Set up the units for measuring the position when generating a component in a Form. The default is the value specified in options.

After setting up the units, click the checkbox beside 'Save position units in options' on the bottom left corner to save the designated units in options.

Create Other Files

Style files (CSS), XML files, script files, and theme files may be created using menu option File > New.

Create Theme Files

You can create a new theme file by accessing [File > New > Theme].

You must enter a theme file's "Name" and "Location." Moreover, theme files in the same location must have different names.

As soon as a theme is created, the corresponding editor view will be opened automatically. A theme file is managed under the Theme directory in the Resource Explorer.

When you finish creating a theme, a folder of the specified name will be created under the relevant project. The folder includes an .xcss file and the images folder, the latter of which contains image files.

[project]
- [_resource_]
-- [_theme_]
--- [test]
---- theme.xcss
---- [images]
----- btn_CalDrop_D.png
----- btn_CalDrop_N.png
...

Create Style Sheet

You can create a new style sheet file by accessing [File > New > Style Sheet]. The extension of the file is .xcss.

You must enter a XCSS file's "Name" and "Location." Moreover, XCSS files in the same location must have unique names. At "Insert Target," you must specify to which target you apply the XCSS.

As soon as an XCSS file is created, the corresponding editor view will be opened automatically. In the Project Explorer, the XCSS file will be registered in Styles of the Application specified as an insert target. In addition, it will be registered in XCSSResource in the Resource Explorer.

You cannot apply a CSS file to the application that is being edited—i.e. its editor view is currently opened.

Create Script Files

You can create a new script file by accessing [File > New > Script]. The extension of the file is .xjs.

You must enter an XJS file's "Name" and "Location." Moreover, XJS files in the same location must have unique names.

As soon as an XJS file is created, the corresponding editor view will be opened automatically. If an XJS file is created in a service path, it will be registered in the relevant service in the Project Explorer.

Create XML Files

You can create a new XML file by accessing [FILE > New > XML]. The extension of the file is .xml.

You must enter an XML file's "Name" and "Location." Moreover, XML files in the same location must have unique names.

As soon as an XML file is created, the corresponding editor view will be opened automatically. If an XML file is created in a service path, it will be registered in the relevant service in the Project Explorer.

Create InitValue Files

You can create a new InitValue file by accessing the menu [File > New > InitValueDefinition]. The extension of the file is .xiv and the created file will be registered in the Resource Explorer.

Nexacro Studio will create a folder named "_initvalue_" under the relevant project folder in your computer. An InitValue file will be saved into this _resource_/_initvalue_ folder.

You cannot change the location for creating an InitValueDefinition file. You have to use the predetermined path.

Creating an InitValue file will prompt the opening of the InitValueDefinition window, in which you can choose objects or components that you want to include in the InitValue file. Then, right-click an object or component to select the context menu [Add InitValueDefinition]. Otherwise, select an object or component and then click the "+" icon at the top of the pane.

You can see an ID created under the relevant object or component, and also see that the right-hand pane is activated with the list of properties. In these circumstances, you can modify the InitValue file by specifying properties. Clicking the [Source] tab allows you to check the source codes of a created or modified InitValue file.

Create UserFont Files

You can create a new UserFont file by accessing the menu [File > New > UserFont]. The extension of the file is .xfont, and the created file will be registered in the Resource Explorer.

Nexacro Studio will create a folder named "_font_" under the relevant project folder in your computer. A UserFont file will be saved into this _font_ folder.

If you check the Apply current file to Environment 'userfontid' property value option, a created user font will apply to the userfontid property of the Environment object. You can change or delete the value of the property later on.

A UserFont file is created with sample codes included in it. You can apply the created user font by manipulating the sample codes as you want and then removing the comments. If you generate the codes included in a UserFont file, they will be incorporated into the inside of the <style> element of the created HTML file.

In case a Nexacro application runs on the NRE, your operating system must have the fonts that are defined as user fonts.

In Nexacro Studio, you cannot find a user font in the Properties pane if the font is not installed in the operating system. In this case, you should enter the name of the font manually to the Properties pane.

If you want to use an external service like Google Fonts, you can define your user font by specifying the relevant CSS URL, as presented below.

@import url(//fonts.googleapis.com/earlyaccess/hannari.css);

Register and Use Form Templates

A Form template is such that you designate a standard format used in your project or you register a frequently-used screen type. When you create a Form, you can choose among those templates.

Register a Form Template

You can register a Form template by following the below steps.

1

Create a Form.

2

Arrange components and add necessary properties and script.

3

Select the menu [File > Save As > Form Template].

You can also select [Save as Form Template] in the context menu opened both from the Form design panel or from the relevant Form in the Project Explorer.

4

Write the name and description of the template.

The default storage path is as follows. After running the menu [Tools > Options], you can change the storage path managed in the project in [Project > Easy UI > Form Template].

C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\[Category Name]\[Template Name]
C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\[Template Name]

When registering the form template, you can add or change category items. If there is no category item added, then register the form template directly under the Form Templates default path. If there are many form templates to manage, then it is recommended to create categories to manage.

When adding the category. The category name is added in the ctgr0 format. You can edit the category name by selecting the item and then pressing the F2 key.

5

Upon the click of the Create button, the template is created and the results are presented. Click the link provided in the results to open the containing folder.

Create a Form by using a Form Template

1

Select the menu [File > New > Form].

2

Choose a template from the Form Wizard. You can see the preview of the selected Form template.

3

A Form is created based on the selected Form template after you designate the location of the Form and click the Finish button.

Registering & Using ViewSet Template

Functions described in this chapter or section were added in Nexacro Platform version 17.1.2.100.

The ViewSet template can specify standard layouts used within the project by using the View component. The ViewSet template created can be selected when creating a new form.

Registering ViewSet Template

The form template can be registered as follows.

1

Create a new form.

2

Configure the screen layout for the ViewSet template using the View component.

The View component holds the layout to place the component that will actually operate. Define the layout type that is frequently used in the entire project first and then make it the ViewSet template.

When creating the ViewSet template, other components can be placed in the View component, but the components are deleted from the template code when saved as the ViewSet template. Components to be operated in the View component are automatically created based on the Model.

The View component cannot be placed in ContainerComponent, such as the Div component. The View component can only be registered as the child of the Form object. Even if you place the View component inside the Div component area in Nexacro Studio, it will not be included in the Div component.

3

Select the menu [File > Save As > Form Template] item.

When saving the Form that includes the View component, ViewSet Template Wizard is executed, and when the View component is not included, Form Template Wizard is executed.

4

Fill in the Template Name and Category items and then click the [Create] button.

Category can be added or changed if necessary. If Category is not selected, then the ViewSet template is displayed directly under the Viewset Templates item. If you have many ViewSet templates that you use, then it is recommended to create Category to manage.

The default storage path is as follows. After running the menu [Tools > Options], you can change the storage path managed in the project in [Project > Easy UI > Form Template]. The "viewset" folder is created based on the set path and the ViewSet form template storage path is created thereunder.

C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\viewset\[Category Name]\[Template Name]
C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\viewset\[Template Name]

Creating New Form with ViewSet Template

The Viewset Templates item is only displayed when the View component is added to the project TypeDefinition > Objects list.

1

Select the menu [File > New > Form] item.

2

Select the ViewSet template under the Viewset Templates item on the Form Wizard screen. You can preview the configuration of the selected ViewSet template.

If the Category is set, then you can check the ViewSet template under the corresponding Category folder.

3

Enter Name, select Location, and click the [Finish] button to create a new Form with the selected ViewSet template.