Types

NOTE

The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.

Resource

The Resource type is used to reference resources for setting component attributes.

You can use $r or $rawfile to create a Resource object, but its attribute values cannot be changed.

• $r('belonging.type.name')

  belonging: group to which the resource belongs, which can be 'sys' or 'app'.

  type: resource type, which can be 'boolean', 'color', 'float', 'intarray', 'integer', 'pattern', 'plural', 'strarray', 'string', or 'media'.

  name: resource name, which is determined during resource definition.

• $rawfile('filename')

  filename: name of the file in the resources/rawfile directory of the project.

  NOTE

  When referencing resources of the Resource type, make sure the data type is the same as that of the attribute method. For example, if an attribute method supports the string|Resource types, the data type of the Resource type must be string.

Length

The Length type is used to represent a size unit.

Type	Description
string	String type. Specify the length unit explicitly, for example, '10px', or provide the length in percentage, for example, '100%'.
number	Number type. The default unit is vp.
Resource	Size referenced from system or application resources.

ResourceStr

The ResourceStr type is used to represent the types that can be used by input parameters of the string type.

Type	Description
string	String type.
Resource	String referenced from system or application resources.

Padding

The Padding type is used to describe the paddings in different directions of a component.

Name	Type	Mandatory	Description
top	Length	No	Height of the padding on the top of the component.
right	Length	No	Width of the padding on the right of the component.
bottom	Length	No	Height of the padding at the bottom of the component.
left	Length	No	Width of the padding on the left of the component.

Margin

The Margin type is used to describe the margins in different directions of a component.

Name	Type	Mandatory	Description
top	Length	No	Height of the margin above the component.
right	Length	No	Width of the margin on the right of the component.
bottom	Length	No	Height of the margin below the component.
left	Length	No	Width of the margin on the left of the component.

EdgeWidths⁹⁺

The EdgeWidths type is used to describe the edge widths in different directions of a component.

Name	Type	Mandatory	Description
top	Length	No	Width of the top edge of the component.
right	Length	No	Width of the right edge of the component.
bottom	Length	No	Width of the bottom edge of the component.
left	Length	No	Width of the left edge of the component.

BorderRadiuses⁹⁺

The BorderRadiuses type is used to describe the radius of the rounded corners of a component.

Name	Type	Mandatory	Description
topLeft	Length	No	Radius of the top left rounded corner of the component.
topRight	Length	No	Radius of the top right rounded corner of the component.
bottomLeft	Length	No	Radius of the bottom left rounded corner of the component.
bottomRight	Length	No	Radius of the bottom right rounded corner of the component.

EdgeColors⁹⁺

The EdgeColors type is used to describe the edge colors of a component.

Name	Type	Mandatory	Description
top	ResourceColor	No	Color of the top edge of the component.
right	ResourceColor	No	Color of the right edge of the component.
bottom	ResourceColor	No	Color of the bottom edge of the component.
left	ResourceColor	No	Color of the left edge of the component.

EdgeStyles⁹⁺

The EdgeStyles type is used to describe the edge styles of a component.

Name	Type	Mandatory	Description
top	BorderStyle	No	Style of the top edge of the component.
right	BorderStyle	No	Style of the right edge of the component.
bottom	BorderStyle	No	Style of the bottom edge of the component.
left	BorderStyle	No	Style of the left edge of the component.

Offset

The Offset type is used to describe the offset coordinates of a component in the layout.

Name	Type	Mandatory	Description
dx	Length	Yes	X coordinate of the offset.
dy	Length	Yes	Y coordinate of the offset.

ResourceColor

The ResourceColor type is used to describe the color types of resources.

Type	Description
Color	Color enums.
number	Color in hexadecimal notation. RGB is supported. Example: 0xffffff
string	Color in RGB or ARGB notation. Example: '#ffffff', '#ff000000', 'rgb(255, 100, 255)', 'rgba(255, 100, 255, 0.5)'
Resource	Color referenced from system or application resources.

ColoringStrategy

The ColoringStrategy type is used to describe the foreground colors.

Name	Description
INVERT	Inverse of the component background color.

LengthConstrain

The LengthConstrain type is used to describe the maximum and minimum lengths of a component.

Name	Type	Mandatory	Description
minLength	Length	Yes	Minimum length of the component.
maxLength	Length	Yes	Maximum length of the component.

Font

The Font type is used to set the text style.

Name	Type	Mandatory	Description
size	Length	No	Font size. If the value is of the number type, the unit fp is used. The value cannot be a percentage. Default value: 16.0
weight	FontWeight |number |string	No	Font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. A larger value indicates a thicker font. Default value: 400 |FontWeight.Normal
family	string |Resource	No	Font family of the text. Use commas (,) to separate multiple fonts. The priority of the fonts is the sequence in which they are placed. An example value is 'Arial, HarmonyOS Sans'. The HarmonyOS Sans font and register custom fonts are supported.
style	FontStyle	No	Font style. Default value: FontStyle.Normal

Area⁸⁺

The Area type is used to describe the area information of a component.

Name	Type	Description
width	Length	Width of the component. The value is of the number type in vp when used as the return value.
height	Length	Height of the component. The value is of the number type in vp when used as the return value.
position	Position	Position of the upper left corner of the component relative to that of its parent container.
globalPosition	Position	Position of the upper left corner of the component relative to that of the page where the component resides.

Position⁸⁺

The Position type is used to represent coordinates of a point.

Name	Type	Mandatory	Description
x	Length	No	X coordinate. The value is of the number type in vp when used as the return value.
y	Length	No	Y coordinate. The value is of the number type in vp when used as the return value.

ConstraintSizeOptions

The ConstraintSizeOptions type is used to set the size constraints of a component during component layout.

Name	Type	Mandatory	Description
minWidth	Length	No	Minimum width of the component.
maxWidth	Length	No	Maximum width of the component.
minHeight	Length	No	Minimum height of the component.
maxHeight	Length	No	Maximum height of the component.

SizeOptions

The SizeOptions type is used to set the width and height.

Name	Type	Mandatory	Description
width	Length	No	Width of the component.
height	Length	No	Height of the component.

BorderOptions

The BorderOptions type is used to provide border information.

Name	Type	Mandatory	Description
width	Length |EdgeWidths9+	No	Border width.
color	ResourceColor |EdgeColors9+	No	Border color.
radius	Length |BorderRadiuses9+	No	Radius of the rounded corner border.
style	BorderStyle |EdgeStyles9+	No	Border style.

ColorFilter⁹⁺

The ColorFilter type is used to create a color filter with a 4 x 5 matrix.

Name	Type	Mandatory	Description
constructor	number[]	Yes	Constructor for creating a color filter with a 4 x 5 matrix. The input parameter is [m*n], which is the matrix value in row m and column n. The value range is [0, 1]. The matrix is row-first.

CustomBuilder⁸⁺

The CustomBuilder type is used to define custom UI descriptions in component attribute methods.

Name	Type	Description
CustomBuilder	() => any	Builder for creating a custom component; must be used with @Builder. For details, see @Builder.

PixelStretchEffectOptions¹⁰⁺

The PixelStretchEffectOptions type is used to describe the pixel stretch effect options.

Name	Type	Mandatory	Description
left	Length	No	Length by which a pixel is stretched towards the left edge of the image.
right	Length	No	Length by which a pixel is stretched towards the right edge of the image.
top	Length	No	Length by which a pixel is stretched towards the top edge of the image.
bottom	Length	No	Length by which a pixel is stretched towards the bottom edge of the image.

ModalTransition¹⁰⁺

The ModalTransition type is used to set the transition type for a full-screen modal.

Name	Description
NONE	No transition animation for the modal.
DEFAULT	Slide-up and slide-down animation for the modal.
ALPHA	Opacity gradient animation for the modal.

Dimension¹⁰⁺

The Length type is used to represent a size unit.

Type	Description
PX	Physical pixel unit type. The unit px must be included, for example, '10px'.
VP	Pixel unit type specific to the screen density. The unit vp can be included or omitted, for example, 10 or '10vp'.
FP	Font pixel unit type. The unit fp must be included, for example, '10fp'.
LPX	Logical pixel unit type. The unit lpx must be included, for example, '10lpx'.
Percentage	Percentage type. The unit % must be included, for example, '10%'.
Resource	Size referenced from system or application resources.

PX¹⁰⁺

The PX type is used to represent a length in px.

Type	Description
{number}px	Physical pixel unit type. The unit px must be included, for example, '10px'.

VP¹⁰⁺

The VP type is used to represent a length in vp.

Type	Description
{number}vp|number	Pixel unit type specific to the screen density. The unit vp can be included or omitted, for example, 10 or '10vp'.

FP¹⁰⁺

The FP type is used to represent a length in fp.

Type	Description
{number}fp	Font pixel unit type. The unit fp must be included, for example, '10fp'.

LPX¹⁰⁺

The LPX type is used to represent a length in lpx.

Type	Description
{number}lpx	Logical pixel unit type. The unit lpx must be included, for example, '10lpx'.

Percentage¹⁰⁺

The Percentage type is used to represent a length in percentage.

Type	Description
{number}%	Percentage type. The unit % must be included, for example, '10%'.

Degree¹⁰⁺

The Degree type is used to represent a length in deg.

Type	Description
{number}deg	Degree type. The unit deg must be included, for example, '10deg'.

SwiperAnimationEvent¹⁰⁺

Describes the animation information of the <Swiper> component.

Name	Type	Description
currentOffset	number	Offset of the currently displayed element relative to the start position of the <Swiper> along the main axis. Unit: vp Default value: 0
targetOffset	number	Offset of the target element relative to the start position of the <Swiper> along the main axis. Unit: vp Default value: 0
velocity	number	Hands-off velocity at the beginning of the animation. Unit: vp/s Default value: 0

SafeAreaType¹⁰⁺

The SafeAreaType type is used to describe the types of expanded safe areas.

Name	Description
SYSTEM	Default non-safe area of the system, including the status bar and navigation bar.
CUTOUT	Non-safe area of the device, for example, the notch area.
KEYBOARD	Soft keyboard area.

SafeAreaEdge¹⁰⁺

The SafeAreaEdge type is used to define the edge for expanding the safe area.

Name	Description
TOP	Top edge.
BOTTOM	Bottom edge.
START	Start edge.
END	End edge.

你可能感兴趣的鸿蒙文章

harmony 鸿蒙ArkTS-based Declarative Development Paradigm

harmony 鸿蒙@ohos.multimedia.avCastPicker (AVCastPicker)

harmony 鸿蒙Property Animation

harmony 鸿蒙Enums

harmony 鸿蒙Blank

harmony 鸿蒙Button

harmony 鸿蒙CalendarPicker

harmony 鸿蒙Checkbox

harmony 鸿蒙CheckboxGroup

harmony 鸿蒙DataPanel