VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options

freeFree Technical Resource

This content is free to read, suitable for basic learning and search traffic.

The scroll wheel control is agesture-based sliding selectioncomponent: it allows for scrolling up and down/left and right to select values from preset options, simulating a mechanical dial. Time/date settings (such as scheduled start/stop and planned tasks) are typical scenarios, which are intuitive and have low touch error rates.

1. Attribute Introduction

1.1 Function Settings

AttributesDescription
Monitoring AddressBound Variable Address
Total ItemsTotal items selected by scrolling the wheel
CandidatesDefault display items: 3 or 5 items
InertiaAfter sliding and releasing, there is an inertial scrolling effect
Alignment/LoopingWhether the option content is aligned; whether it loops and scrolls
Option contentStatic (fixed text, available tags)/Dynamic (variable address + maximum length, UTF-8, separated by semicolons)

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图

1.2 Appearance settings

  • Font/Font size
  • Middle color: Text color of the selected item in the middle;End color: Text color of options at both ends
  • Shrink at both ends: Scaling ratio of options text at both ends

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图1

2. Application cases

2.1 Static content

MonitoringLW1001, 5 items, candidate items 3, inertia + loop, text 1;

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图2

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图3

2.2 Dynamic content

monitorLW1002Option dynamics, variable addressLW1050, maximum length 256. After writing options (UTF-8, semicolon-separated) with LUA set_string, the scroll wheel displays.

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图4

VisualHMI Scroll Wheel Control: Sliding Value Selection, Inertial Looping, and Dynamic Options插图5

Both the scroll wheel and dropdown selection can be used to choose values, with the following differences:The scroll wheel is suitable for continuous and rapid browsing (time, gear), while the dropdown is suitable for precise selection when there are many options. Whether to choose 3 or 5 options depends on screen space - 5 options have a more "dial-like" feel, while 3 options are more compact.

Compiled from the VisualHMI development documentation of Guangzhou Dacai Technology (hmi-doc.gz-dc.com), the configuration control tutorial "Scroll Wheel", copyright belongs to Dacai Technology.

Put this resource to use in a real project?

Go to the Tool Center for message parsing, CRC verification and device debugging, or submit your requirements for selection and integration advice.

Engineer Membership

Turn this article into actionable debugging resources

After activation, you can use advanced message parsing, resource pack downloads, code examples, engineering cases and priority technical support, suitable for real project delivery.

Unlimited Advanced Tools
Resource & Code Packs
Complete Engineering Case Library
Priority Technical Support

Leave a Reply

Your email address will not be published. Required fields are marked *.