Help Center/ Huawei Cloud Astro Canvas/ User Guide/ Widgets/ Sting/ Checkbox
Updated on 2025-03-24 GMT+08:00
View PDF
Share

Checkbox

Checkbox is a type of text widget and is used to select one or more options.

On the large screen design page, drag the checkbox widget from the All > Text area to the blank area of the canvas, as shown in Figure 1.

Figure 1 Checkbox widget
Figure 2 Margin style

Card

A card wraps a chart widget. A widget consists of card elements (card title, chart, card background, and card border) and chart elements.

Figure 3 Card
  • Background
    • Background color: Background color of the widget card.
    • Border: Border of the widget card. Options: no border, full border, and corner border. For full border and corner border, you can set the line type and rounded corners of the outer border of the widget.
    • Style: Image display style. The options are normal, center, stretch, and tiled.
    • Choose image: Use a local image as the widget background. Directories and subdirectories can be added to facilitate image management by category. JPG, JPEG, PNG, or GIF images are recommended. The size of each image cannot exceed 50 MB.
  • Special effect: Widget highlighted status. Displayed by default or on page load.
  • Padding: Distance between the chart and the four sides (top, bottom, left, and right as shown in Figure 2) of the widget. The default value is 0, indicating that the chart stretches to fill the entire widget.

Configuration

You can set the style, color, and alignment mode of the widget.

Figure 4 Configuration
  • Style setting: Set the style of the checkbox. Rounded corners, squares, and circles are supported.
  • Color settings
    • Font color: Font color of an option when an option is not selected.
    • Background color: Background color of an option.
    • Selected status background color: Background color of the checkbox when selected.
    • Border color: Color of the checkbox border when not selected.
    • Border focus color: Color of the checkbox border when selected.
    • Border hover color: Color of the checkbox border when hovered over.
    • Unavailable border color: border color of an unavailable option.
    • Disabled border color: Border color of the checkbox when it is not selectable.
    • Disabled font color: Font color of the option when it is not selectable.
    • Selected status font color: Font color of the option when selected.
  • Alignment settings
    • Zoom factor: The size multiplier for the selection box on the page compared to its development size, after the widget is published. A greater factor is recommended for better display on large screens.
    • Right spacing: Distance between the check boxes and the widget's right border.
    • Up spacing: Distance between the check boxes and the widget's top border.
    • All: Whether to display the "All" check box.

Data

In the data settings, you can set the data source of the check box widget. For more information, see Data Access.

Interaction

In the interaction settings, you can configure interactions between the checkbox widget and other widgets or pages. For details, see Interaction Configuration.

Parent topic: Sting