长沙 网站运营,手机官方网站,学软件技术需要什么基础,网站制作中心前言
自定义组件的生命周期回调函数用于通知用户该自定义组件的生命周期#xff0c;这些回调函数是私有的#xff0c;在运行时由开发框架在特定的时间进行调用#xff0c;不能从应用程序中手动调用这些回调函数。
下图展示的是被Entry装饰的组件生命周期#xff1a;
今…前言
自定义组件的生命周期回调函数用于通知用户该自定义组件的生命周期这些回调函数是私有的在运行时由开发框架在特定的时间进行调用不能从应用程序中手动调用这些回调函数。
下图展示的是被Entry装饰的组件生命周期
今天根据上面的流程图我们从自定义组件的初始创建、重新渲染和删除来一一详细解释。 说明允许在生命周期函数中使用Promise和异步回调函数比如网络资源获取定时器设置等 aboutToAppear
aboutToAppear?(): voidaboutToAppear函数在创建自定义组件的新实例后在执行其build()函数之前执行。允许在aboutToAppear函数中改变状态变量更改将在后续执行build()函数中生效。 注意⚠️从API version 9开始该接口支持在ArkTS卡片中使用。 aboutToDisappear
aboutToDisappear?(): voidaboutToDisappear函数在自定义组件析构销毁之前执行。不允许在aboutToDisappear函数中改变状态变量特别是Link变量的修改可能会导致应用程序行为不稳定。 注意⚠️从API version 9开始该接口支持在ArkTS卡片中使用。 onPageShow
onPageShow?(): void页面每次显示时触发一次包括路由过程、应用进入前台等场景仅Entry装饰的自定义组件生效。
onPageHide
onPageHide?(): void页面每次隐藏时触发一次包括路由过程、应用进入前后台等场景仅Entry装饰的自定义组件生效。
onBackPress
onBackPress?(): void当用户点击返回按钮时触发仅Entry装饰的自定义组件生效。
Entry
Component
struct IndexComponent {State textColor: Color Color.Black;onPageShow() {this.textColor Color.Blue;console.info(IndexComponent onPageShow);}onPageHide() {this.textColor Color.Transparent;console.info(IndexComponent onPageHide);}onBackPress() {this.textColor Color.Red;console.info(IndexComponent onBackPress);}build() {Column() {Text(Hello World).fontColor(this.textColor).fontSize(30).margin(30)}.width(100%)}
}onLayout9
onLayout?(children: ArrayLayoutChild, constraint: ConstraintSizeOptions): void框架会在自定义组件布局时将该自定义组件的子节点信息和自身的尺寸范围通过onLayout传递给该自定义组件。不允许在onLayout函数中改变状态变量。 注意⚠️:从API version 9开始该接口支持在ArkTS卡片中使用。 参数说明
参数名称参数类型参数说明childrenArrayLayoutChild子组件布局信息。constraintConstraintSizeOptions父组件constraint信息。
onMeasure9
onMeasure?(children: ArrayLayoutChild, constraint: ConstraintSizeOptions): void框架会在自定义组件确定尺寸时将该自定义组件的子节点信息和自身的尺寸范围通过onMeasure传递给该自定义组件。不允许在onMeasure函数中改变状态变量。 注意⚠️:从API version 9开始该接口支持在ArkTS卡片中使用。 参数说明 参数名称参数类型参数说明childrenArrayLayoutChild子组件布局信息。constraintConstraintSizeOptions父组件constraint信息。
LayoutChild9
子组件布局信息。
从API version 9开始该接口支持在ArkTS卡片中使用。
参数名称参数类型描述namestring子组件名称。idstring子组件id。constraintConstraintSizeOptions子组件约束尺寸。borderInfoLayoutBorderInfo子组件border信息。positionPosition子组件位置坐标。measure(childConstraint: ConstraintSizeOptions) void调用此方法对子组件的尺寸范围进行限制。layout(LayoutInfo LayoutInfo) void调用此方法对子组件的位置信息进行限制。
LayoutBorderInfo9
子组件border信息。
从API version 9开始该接口支持在ArkTS卡片中使用。
参数名称参数类型描述borderWidthEdgeWidths边框宽度类型用于描述组件边框不同方向的宽度。marginMargin外边距类型用于描述组件不同方向的外边距。paddingPadding内边距类型用于描述组件不同方向的内边距。
LayoutInfo9
子组件layout信息。
从API version 9开始该接口支持在ArkTS卡片中使用。
参数名称参数类型描述positionPosition子组件位置坐标。constraintConstraintSizeOptions子组件约束尺寸。
Entry
Component
struct Index {build() {Column() {CustomLayout() {ForEach([1, 2, 3], (index) {Text(Sub index).fontSize(30).borderWidth(2)})}}}
}Component
struct CustomLayout {BuilderParam builder: () {};onLayout(children: ArrayLayoutChild, constraint: ConstraintSizeOptions) {let pos 0;children.forEach((child) {child.layout({ position: { x: pos, y: pos }, constraint: constraint })pos 100;})}onMeasure(children: ArrayLayoutChild, constraint: ConstraintSizeOptions) {let size 100;children.forEach((child) {child.measure({ minHeight: size, minWidth: size, maxWidth: size, maxHeight: size })size 50;})}build() {this.builder()}
}运行效果如下 总结
自定义组件的生命周期回调函数用于通知用户该自定义组件的生命周期这些回调函数是私有的在运行时由开发框架在特定的时间进行调用不能从应用程序中手动调用这些回调函数。合理的掌握和使用组件的生命周期函数可以帮助我们更好开发和实现需求功能。
