Call us! 512-349-0334 or (877) INDUSOFT

Color Animations in InduSoft Web Studio

Color animations are a way to draw attention to critical information in your HMI interface. Here is a guide to adding this effect to your InduSoft Web Studio projects:

On the Graphics tab, in the Animations group, click Color to add the animation to a selected object. The Colors animation allows you to modify the color of a static object during runtime based on the value of a tag or expression.

Double-click on the object to open the Object Properties dialog.

color1

You can use this dialog to specify the following parameters:

  • Type: Determines the mode in which this animation works:
    • By Limit: When selecting this type, you can specify up to four limits (Change Limit) for this animation and a color for each limit. When the value of the tag or expression configured in the Tag/Expr field reaches the limits, the color associated with the respective limit is applied to the object.
    • By Color: When selecting this type, you can specify the code of the color that must be applied to the object directly in the Tag/Expr field. Using this code, you can apply any color supported by your device to the object.

Tip: You can configure the RGBColor  function in the Tag/Expr field when Type = By Color. This allows you to configure the color by its RGB codes. See Color Interface for a table with the codes for the most commonly used colors.

  • Tag/Expression field: Type the name of a tag or expression you want to monitor. When Type = By Limit, IWS compares the result of the tag/expression with the specified Change Limits to determine the proper color for the selected object. When Type = By Color, the result of this field sets the color that will be applied to the object.
  • Change Limit field: Type a limit value (a numeric constant or tag) for the color change. The numbers must be configured in ascendant order according to the following sequence of the fields displayed on the Object Properties dialog: Upper left, lower left, upper right and lower right field. If you click on the More button, you can configure up to 16 different limits for the color animation.

color2

  • Color combo box: Click the combo-box button to associate a color with each color change limit. When the Color dialog opens, click a color to select it, and then close the dialog.
  • Blink combo-box: Click the combo-box button to specify whether the color change will blink, and how fast it will do so.

Note: The following fields are automatically disabled (grayed out) when Type = By Color: Change Limit, Color and Blink. 

Want to learn more about Animations in InduSoft web Studio? Watch the training video!

Comments are closed.