Skip to main content

Core

The Core Controls are a set of Controls, designed to provide a minimal core set of functionality. Therefore, the Core Controls also reduce their size and provide increased performance, by limiting its feature set and reducing the number of used behaviors. 

The Core Controls are designed for

  • Low-End Platforms: low memory footprint and increased performance by reduced feature set
  • Basis for custom Controls: as the Core Controls cover basic features, it is easy possible to extend them for custom behavior (e.g. a specific custom behavior for a custom button) instead of stripping down a full featured Control 

Please note, that the not all Controls have a Core Control variant, as it is not suitable for all available Controls.

CoreText

A simple UI element that displays specified text as a label. The displayed content can be set using the Text property, and the font style can be adjusted using the Text Style property.

In the Core version, only basic text formatting features and data binding are supported, while advanced functionalities such as multi-line display and text trimming settings are not included.

drawing-4-1740025088.png

Properties

Property Name
Type
Description
Text String The Text that will be set to the Text Node.
Text Color Candera::Color The color of the text.
Text Style Candera::TextRendering::Style The Text that will be set to the Text Node.

 

CoreButton

Defines the basic states of a button and the actions executed when clicked. The button's appearance is determined by setting different images for each state. Additionally, text, icons, and other content can be placed inside the button, and spacing between the content and the button can be adjusted. However, the Core version does not include advanced visual effects or focus-related features.

drawing-4-1739766300.png

Properties

Property Name
Type
Description
Enabled
bool
If this option is set to false, the button will be disabled and will no longer accept clicks.
Normal Image 9 Patch Image The image used as the button image.
Pressed Image 9 Patch Image The image used as the button image when the pressed state is applied.
Disabled Image TBC The button image displayed when the button is disabled.
Padding Candera::Margin The padding (margin) of the button. Used when content is attached.
Identifier TBC The identifier used when an event such as Click Event occurs.

CoreDigitalClock

Represents a digital clock, displaying time values (hours, minutes, seconds) as text. The current time can be displayed using values bound from the CGI Panel. Properties are also provided to customize the clock display, such as switching between 12-hour and 24-hour formats.

drawing-4-1739766594.png

Properties

Property Name
Type
Description
Time Variant Specifies the type and the value to pass onto Process Value Behavior.
AM Text
String
The string of the AM label.
PM Text
String
The string of the PM label.
Show Seconds
bool
If true, seconds will be shown.
Show AM PM bool If ture, shows AM or PM depending on time.
Hours Text Style
Candera::TextRendering::Style The style set for the “hour” text.
Minutes Colon Text Style
Candera::TextRendering::Style The style applied to the separator between the “hour” and “minute” text.
Minutes Text Style
Candera::TextRendering::Style The style set for the “minute” text.
Seconds Text Style
Candera::TextRendering::Style The style set for the “second” text.
AM PM Text Style
Candera::TextRendering::Style The style set for the AM/PM text.
Hours Color
Candera::Color The color set for the “hour” text.
Minutes Color
Candera::Color The color set for the “minute” text.
Seconds Color
Candera::Color The color set for the “second” text.
AM PM Color Candera::Color The color set for the AM/PM text.

CoreTextButton

Defines the basic behavior of a button and the actions executed when clicked. In the Core version, visual customization features are limited, and the button's appearance is determined by the specified image and text. Properties are provided to adjust the display and style of the text. The button's behavior when pressed can be easily configured using the EventHandler.

drawing-4-1739766412.png

Properties

Property Name
Type
Description
Enabled
bool
If this option is set to false, the button will be disabled and will no longer accept clicks.
Normal Image
Candera::Image2D

The image displayed when the button is in its normal state.

Pressed Image
Candera::Image2D The image displayed when the button is pressed.
Disabled Image TBC The image displayed when the button is disabled.
Text
String
Text to be displayed in the button.
Text Style
Candera::TextRendering::Style Set the style of the text.
Text Color
Candera::Color Text to be set in the text node.
Disabled Text Color
Candera::Color Text color when disabled.

CoreCheckBox

A simple UI element that indicates the selection status. In the Core version, the normal and selected states can be configured using a combination of text and images. The behavior when the state of this control changes can be set using the EventHandler.
Note that features related to Focus and Blend effects are not included.

drawing-4-1739766439.png

Properties

Property Name
Type
Description
Enabled
bool

If this option is set to false, the checkbox will not respond to clicks.

Value
bool/Variant
Specifies the initial selection state of the checkbox (true = selected, false = not selected).
Text
String
The text of the checkbox.
Text Style
Candera::TextRendering::Style The style set for the text node.
Normal Image
Candera::Image2D The checkbox image displayed when in the normal state.
Selected Image
Candera::Image2D The checkbox image displayed when in the selected state.
Normal Disabled Image
Candera::Image2D

The checkbox image displayed when in the invalid state.

Selected Disabled Image
Candera::Image2D The image of a selected checkbox in the invalid state.
Text Enabled Color Candera::Image2D The text color when in the valid state.
Text Disabled Color Candera::Image2D The text color when in the invalid state.

CoreToggleButton

A simple UI element that toggles the button state. It is typically used to enable or disable specific functions. The structure is simple, allowing you to configure two images corresponding to the ON/OFF states of the toggle and their associated text. The behavior when the button is clicked can be set in the EventHandler tab. Note that features related to Focus and Blend effects are not included.

drawing-4-1739766464.png

Properties

Property Name
Type
Description
Enabled
bool
If this option is set to disabled, the toggle button will be disabled and will no longer accept click operations.
Value
bool/Variant
Specify the initial state of the toggle (true = enabled, false = disabled).
First Text
String
The text that will be displayed when the toggle is set to On (the first toggle image).
Second Text
String
The text that will be displayed when the toggle is set to Off (the second toggle image).
First Image
Candera::Image2D The image that will be displayed when the toggle is set to On (the first toggle image).
Second Image
Candera::Image2D The image displayed when the toggle is in the Off state (second toggle image).
First Disabled Image
Candera::Image2D The image displayed when the toggle is in the On state when it is disabled.
Second Disabled Image
Candera::Image2D The image displayed when the toggle is in the Off state when it is disabled.
Text Enabled Color Candera::Image2D The text color when it is enabled.
Text Disabled Color Candera::Image2D The text color when it is disabled.

 

CoreRadioButton

A simple UI element that allows the user to select one option from multiple choices. In the Core version, the normal and selected states can be configured using a combination of text and images. The behavior when the state of the CoreRadioButton control changes can be set using the EventHandler.

The functionality of the CoreRadioButton is similar to that of the CoreCheckBox, but it is designed to allow only one selection among multiple options.

drawing-4-1739766490.png

Properties

Property Name
Type
Description
Enabled
bool
If you set this option to disabled, the radio buttons will not work and will not accept clicks.
Text
String
The text of the radio buttons.
TextStyle
Candera::TextRendering::Style Set the style of the text.
Normal Image
Candera::Image2D The image of the radio buttons displayed in the normal state.
Selected Image
Candera::Image2D The image of the radio buttons displayed when selected.
Normal Disabled Image
Candera::Image2D

The image of the normal radio buttons in the disabled state.

Selected Disabled Image
Candera::Image2D The image of the selected radio buttons in the disabled state.
Text Enabled Color Candera::Image2D The color of the text in the enabled state.
Text Disabled Color Candera::Image2D The color of the text in the disabled state.
Selected
bool/Variant
Specify the type and value to pass to the Process Value behavior.

CoreTextValue

Generates a formatted string by combining Value and Format Text. It supports formatting numbers and text in a manner similar to the C++ printf() function. The value can be set directly or modified through events. Events are provided through behaviors that send or transfer values.

drawing-4-1739766548.png

Properties

Property Name
Type
Description
Value Variant The value to be formatted
Format Text
String
The format string which includes one format specifier (beginning with %). See C printf() function.
Style
Candera::TextRendering::Style The style of the text to be used.
Text Color
Candera::Color Specify the color of the text.

CoreMultiStateButton

A UI element that allows for the easy definition of buttons with multiple states. Each click changes the state, and once the maximum value is reached, it loops back to the initial state. The corresponding image is selected based on the button's state, and the displayed text can also be modified using the Text property. The behavior of the MultiStateButton can be set in the EventHandler, and actions corresponding to the current state can be executed using the Process Value Changed Event behavior.

drawing-4-1739943004.png

Properties

Property Name
Type
Description
Current State
Variant
Current state of the MultiStateButton (starts with 0).
Maximum State
bool/Variant
Maximum value of MultiStateButton (starts with 0).

CoreDial

A dial is used to set a value within a specified range or to select between different options which are represented by the value of the dial. The control knob changes the value when the user touches and turns it. The degree of rotation corresponds to the desired value change. The dial snaps into its predefined positions defined by its step size.

The below figure shows an example using a 3-step rotation, with a Minimum Rotation of -45 degrees, Maximum Rotation of +45 degrees, and Step Size of 45 degrees. In this example, BackgroundImages 0 is displayed corresponding to Current Value = 0. Similarly, Current Value = 1 displays BackgroundImages 1 and Current Value = 2 displays BackgroundImages 2.

For a 5-step rotation with a Minimum Rotation of -90 degrees, Maximum Rotation of +90 degrees, and Step Size of 45 degrees, you will need to set 5 BackgroundImages.

The rotary knob supports events. If it receives an event of value change (ValueChangeEvent), the knob will be set accordingly. When the control is focused it is possible to control it using the keyboard (up/down arrow).

drawing-4-1739774950.png

Properties

Property Name
Type
Description
Enabled bool If set to false it will not react on focus events and does not have to support different visualizations for the different states.
Current Value
FeatStd::Int32 Current value for the dial.
Step Size
FeatStd::Float Step size in degrees.
Minimum Rotation
FeatStd::Float Minimum rotation of the dial.
Maximum Rotation
FeatStd::Float Maximum rotation of the dial.
Knob Image
Candera::Image2D The image to set on the effect.
BackgroundImages
Candera::Image2D A list of images which should be available for selection.
Disabled Color
Candera::Color The color which can be used from other Behaviors.
Hovered Color
Candera::Color The color which can be used from other Behaviors.
Increment Key Code
Candera::KeyboardKeyCode::Enum Check the KeyCode of the pressed key (can also be modifier).
Decrement Key Code
Candera::KeyboardKeyCode::Enum Check the KeyCode of the pressed key (can also be modifier).

CoreScrollView

The CoreScrollView defines an area that allows to place arbitrary content in it. The main functionality of the ScrollView is to clip this content if it is outside of the layout-size of the control. Additionally a ScrollBar will appear for each axis where the content is too large for the size that it got by the layout.

There are properties available for the ScrollBars that can change this visibility behavior.

Similar to the List the ScrollView offers an Anchor where any node (also Controls) can be attached to.

The size of the ScrollView can be set using the Layout of the Control. If the size of the attached nodes is bigger than the layout size of the ScrollView, Scrollbars will appear. In difference to the List the ScrollView doesn't layout the attached nodes. So Controls and other nodes can be placed at any position. (Also the hierarchy doesn't matter which means that an additional Layouter or GroupBox can be added.)

drawing-4-1739775073.png

Properties

Property Name
Type
Description
Vertical Scrollbar Visibility ScrollbarVisibility::Enum (Automatic, Collapsed, Visible) Configure the visibility of the scrollbar. By default it is set to Automatic which will determine the visibility based on the actual content.
Horizontal Scrollbar Visibility
ScrollbarVisibility::Enum (Automatic, Collapsed, Visible) Configure the visibility of the scrollbar. By default it is set to Automatic which will determine the visibility based on the actual content.