NEXTO XF #84 - Changing the properties of basic objects on the web server

The objective of this tutorial is to explain how to add and change the properties of basic objects on the web server of the XF325-W CPU

Components

Equipment: 1 computer/laptop.

                            1 XF325-W

Software:  MasterTool X

Tutorial Sections

1. ARCHITECTURE
2. DEVELOPMENT

1. ARCHITECTURE

A computer/laptop will be required to use MasterTool X.

Figure 1. Computer running MasterTool X

2. DEVELOPMENT

After inserting objects on the visualization screen, the next step is to configure their properties to make them dynamic and represent the process state. One of the most commonly used features is changing the color based on a Boolean variable, indicating a normal or alarm condition.

Changing color by state (normal vs. alarm)

This type of configuration allows the object to change its appearance according to the value of a variable:

• FALSE (0) → Normal state
• TRUE (1) → Alarm state

Color configuration

To configure:

1. Select the object on the screen
2. In the Properties window (on the right), access the Colors tab

In this tab, you can configure:

• Fill color
• Frame color (border)

For two states:

• Normal
• Alarm

The user can define different colors for each situation, making visual identification easier.

Figure 2. Color configuration for the Normal and Alarm states

Appearance adjustments

Still in the properties, access the Appearance tab:

• Line width
  • Increase the value to make the border thicker
• Line style
  • Solid
  • Dashed
  • Other available styles

These options allow you to customize the object according to the application's needs.

Figure 3. Object border configuration

Text insertion and configuration

To add a label to the object:

1. Access the Text tab
2. Enter the desired content
   • Example: Square

Text formatting

Still in the text tab, you can configure:

• Horizontal alignment
• Vertical alignment
• Font
• Font size
• Text color

This allows you to improve the interface's visualization and organization.

Figure 4. Object title configuration

Color variable association

To make the object dynamic:

1. Go to the Color variables tab and expand the options
2. Double-click the “Toggle Color” field
3. Enter a Boolean variable

Practical example (simulation)

To simulate operation:

• Use the special variable: Pulse_2s

This variable generates an alternating signal:

• On for 1 second
• Off for 1 second

Expected result

• When the variable is FALSE → object with normal color
• When it is TRUE → object with alarm color
• The object will alternate between the states, simulating dynamic behavior

Figure 5. Configuration of the variable responsible for changing the object's color

Applications in automation

• Fault indication
• Equipment status
• Visual alarms
• Real-time monitoring

Important notes

• The variable must be of type BOOL
• The visualization can be tested in simulation (for internal variables)
• For real-world application, downloading to the PLC is required
• Colors should be chosen intuitively (e.g., green = normal, red = alarm)

Figure 6. Web server operation in the simulation environment