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

Flip Clock

The flip clock is a type of text widget. It is used to display the current time using the flipper effect.

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

Figure 1 Flip clock 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 Flip clock 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.
  • Title: Whether to display the title. Once enabled, you can set the font size, font color, and title content of the title.

Configuration

You can set the year, month, date, background color, and time bar color of the widget.

Figure 4 Flip clock configuration
  • Day of week
    • Display: Whether to display the week.
    • Font: Font, color, and size of the week.
  • MMDD, YYYY
    • Display: Whether to display the year, month, and day.
    • Font: Font, color, and size of the year, month, and day.
  • Time
    • Display: Whether to display the time.
    • Font: Time font, text size, and text color.
    • Card background color: Background color of the widget card.
    • Card width: Width of the card, in pixels. The value ranges from 0 pixels to 200 pixels.
    • Card height: height of a card, in pixels. The value ranges from 0 pixels to 200 pixels.
    • Card left spacing: Spacing between the card and the left border of the widget. The value ranges from 0 to 200.
    • Card right spacing: Spacing between the card and the right frame of the widget. The value ranges from 0 to 200.
  • Internal background color: Internal background color of the widget.

Interaction

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

Parent topic: Sting