FILL_RECT

Start from API_LEVEL 2.0 . Please refer to API_LEVEL.

The Fill Rectangle widget is used to draw a solid color rectangular area.

caution

At this stage, if you change the properties of the widget by means of setProperty(prop.MORE, Params), you must pass x, y, w, h properties, see the sample code for details.

Create UI widget

import { createWidget, widget } from '@zos/ui'

const fillRect = createWidget(widget.FILL_RECT, Param)

Type

Param: object

Properties	Description	Required	Type
x	The x-coordinate of widget.	YES	number
y	The y-coordinate of widget.	YES	number
w	The width of widget.	YES	number
h	The height of the widget.	YES	number
color	The color of widget.	YES	number
radius	The radius of widget.	NO	number
angle	The angle of widget.	NO	number

Code example

import { createWidget, widget, prop } from '@zos/ui'

Page({
  build() {
    const fill_rect = createWidget(widget.FILL_RECT, {
      x: 125,
      y: 125,
      w: 230,
      h: 150,
      radius: 20,
      color: 0xfc6950
    })

    fill_rect.addEventListener(event.CLICK_DOWN, (info) => {
      fill_rect.setProperty(prop.MORE, {
        x: 125,
        y: 200,
        w: 230,
        h: 150
      })
    })
  }
})