Code examples

1. How to add ui code?
   

2. How to add 10 rows?

3. How to set a value in an entry field?

How to add ui code?

There is a tutorial video just down below.

• You need a QuickStart project:

  • Select File > New > IIZI Module Project (Quickstart)
  • Enter project name and unselect Create text tables with automatic translation
  • Press Finish
     

• Add Text Field

  • Name it: text (on component and VSField)
     

• Add Button

  • On Button properties, go to Events > OnUIAction > Create new method…
  • Choose Create > Then OK
  • Enter the texts in the entry fields:
  • Package: com.iizi.ui
  • Name: Code
  • Then click on Finish
  • Method name: onClick
    • Paste this code in the method

UIText text = event.getSource().getUIPanel().getFirstUIComponentNull(“text”, UIText.class);
text.requestFocus();

• Place your mouse cursor on UIText, underlined with red

  • Select Import "UIText" (com.iizi.prop.ui)
  • Then do File > Save All or CTRL + SHIFT + S
  • Right click on the project name > Run As > Run on IIZI Development Server
  • If it says “No configured IIZI Development Server configuration is found”: Choose Yes.
  • Right click on IIZI Development Server > New Configuration > Put a Name > Run it
     

• To test it:

  • You need to open your browser and go to: http://localhost:8080
  • Click on the link: here
  • Then click on Start to launch the app in the browser
  • Press the Click button and it sets the UI focus to the Text Field

How to add 10 rows?

There is a tutorial video just down below.

• You need a QuickStart project:

  • Select File > New > IIZI Module Project (Quickstart)
  • Enter project name and unselect Create text tables with automatic translation
  • Press Finish
     

• Select table in containers and drag/drop it to your panel.

  • Name it: myTable
  • Go to the Properties for the UI Table and add a VS Table to your panel VS Group
  • Add a (UI) table column and link it in the VS Table
     

• Drag and drop Button to the panel

  • Create VS Action for this button
  • Name it: addContent
     

• Go to VirtualSpace and in properties in Connectors > Java Class > Create new class…

  • Enter the texts in the input fields:
  • Package: com.iizi.vs
  • Name: VirtualSpace
  • Then click on Finish
     

• Select addContent’s properties, Connectors > OnVSAction > Create new method…

  • Method name: addContent
  • Paste this code in the method:

VSTable table = event.getTable("group/myTable");
Value[] rowValues = new Value[1];
for ( int item = 1; item <= 10; ++item ) {
rowValues[0] = new Value("Test - "+item);
table.addRow(rowValues);
}

• Place your mouse cursor on errors you will see:

  • VSTable and do: Import "VSTable" (com.iizix.prop.vs)

  • Value[] and do: Import "Value" (com.iizix)

• Then do File > Save All or CTRL + SHIFT + S

  • Right click on project name > Run As > Run on IIZI Development Server
  • If it says “No configured IIZI Development Server configuration is found”: Choose Yes.
  • Right click on IIZI Development Server > New Configuration > Add a Configuration Name > Run it
     

• To test it:

  • You need to open your browser and go to: http://localhost:8080/
  • Click on the link: here
  • Then click on Start to launch the app in the browser.
  • You just click on the Add contents button and it will add a new row.

How to set a value in an entry field?

There is a tutorial video just down below.

• You need a QuickStart project:

  • Select File > New > IIZI Module Project (Quickstart)
  • Enter project name and unselect Create text tables with automatic translation
  • Press Finish
     

• Select Text field in components and drag/drop it to your panel.

  • Name it: text
  • Add it to your VS Group
     

• Add Button and add this in properties:

  • Text: Edit text
  • Click on VS Action > Create VS Action… > Add it to your VS Group
  • Set the action name: editText
  • Then click on Finish
     

• Go to VirtualSpace and in properties in Connectors > Java Class > Create new class…

  • Type in:
  • Package: com.iizi.vs
  • Name: VirtualSpace
  • Then click on Finish
     

• Select editText’s properties, Connectors > OnVSAction > Create new method…

  • Method name: editText
  • Replace your method with this code in your class:

@OnVSAction(name = "group/editText")
public void editText(VSActionEvent event) throws ValueConversionException {
event.getField((@VSRef String) "group/text").set_String("My Message");
}

• Place your mouse cursor on errors you will see:

  • ValueConversionException and do an: Import "ValueConversionException" (com.iizix.prop)
  • @VSRef and do an: Import "VSRef" (com.iizix.api.vs)
     

• Then do File > Save All or CTRL + SHIFT + S

  • Right click on project name > Run As > Run on IIZI Development Server
  • If it says “No configured IIZI Development Server configuration is found”: Choose Yes.
  • Right click on IIZI Development Server > New Configuration > Set a Name > Run it
     

• To test it:

  • You need to open your browser and go here: http://localhost:8080/
  • Click on the link: here
  • Then click on Start to launch the app in the browser.
  • You just click on the button and it will edit text field.