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	API_LEVEL
x	The x-coordinate of widget.	YES	number	3.0
y	The y-coordinate of widget.	YES	number	3.0
w	The width of widget.	YES	number	3.0
h	The height of the widget.	YES	number	3.0
color	The color of widget.	YES	number	3.0
radius	The radius of widget.	NO	number	3.0
angle	The angle of widget.	NO	number	3.0
alpha	Transparency, value 0 - 255, default value is 255 for opacity, 0 for full transparency.	NO	number	3.0

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
      })
    })
  }
})