往期知识点整理
介绍
本示例介绍Stack堆叠组件和LoadingProgress加载组件模拟首次进入页面实现页面加载的效果。加载完成后,LoadingProgress组件会消失并展示加载结果页(即商品页)。
效果图预览
使用说明
- 进入页面开始加载,加载完成后显示整个界面。
实现思路
- 为了实现在页面初次加载时即展现出加载提示效果,预先定义了一个布尔类型的变量isLoading,并将其初始值设定为true。在页面加载初期,这一变量状态将触发加载页的显现,传达数据正在加载的即时信息。
build() {
Stack() {
if (this.isLoading) {
// 加载页
LoadingHUD();
} else {
// 商品页
CommodityList();
}
}
.width('100%')
.height('100%')
.backgroundColo