LoadingProgress组件的使用##HarmonyOS应用开发##
在应用开发的过程中,经常有需要表示“加载中”或者“请等待”的这么一个状态提示,我原来的做法是会通过找一张gif图片来表示这一状态,但是如果使用gif图片的话,会有以下几个问题
1. 在不同页面中,需要显示不同的颜色来适配页面的整体配色风格,但是gif动图是不可能说动态的去设置颜色的,这使得在一些页面中显得与整体设计风格不相符合,如果说每个页面都单独去准备一个gif动图的话,工作量又太大,不合适
2. 同样的原因,就不方便
2. 多一张动图总归会对安装包的整体大小有影响
3. 当项目中有下拉刷新功能时,会看到下拉刷新也有一个“刷新中”的动图,那么一个项目里,最好就是所有的动图都统一
在学习文档的时候,我找到了“LoadingProgress”组件,完美的符合我的要求
首先,LoadingProgress可以通过color属性来设置颜色,官方的说法叫“设置加载进度条前景色”,那么也就是说可以根据当前页面的配色方案进行设置,当然,也就可以适配深色模式了
其次,这是一个组件,那么不存在占空间的问题
最后,这就是下拉刷新中的那个动画图片……一摸一样
解决了我所有的需求
使用起来也很简单,就是当一个正常的组件去写就可以。当然,作为一个要表示“加载中”的组件,他肯定是需要有显示和隐藏的
对于这个问题,官方对这个组件有一个单独的属性叫“enableLoading”,默认为true,false的话就是不显示,但当其不显示的时候(即为false),这个组件依然占位,这我觉得其实是和LoadingProgress的实际用途背景相悖的,它就应该在页面数据获取或者某件要等待的事请完成后消失,所以建议使用IF来进行控制
代码如下:
if(this.list.length > 0){ Column() { LoadingProgress() .width(50) .height(50) .color('#E2873F') Text('加载中...') .fontSize(16) .fontColor('#999999') .margin({ top: 16 }) } .width('100%') .layoutWeight(1) .justifyContent(FlexAlign.Center) }
效果图如下:
- 0回答
- 0粉丝
- 0关注
- HarmonyOS NEXT应用开发指南:开屏广告的使用
- HarmonyOs开发:导航tabs组件封装与使用
- HarmonyOS Next应用开发实战:ArkWeb使用介绍及使用举例
- HarmonyOS 组件复用 @Reusable 装饰器的基本使用
- HarmonyOs开发:轮播图Banner组件封装与使用
- HarmonyOS Next应用开发实战:广告的使用介绍及避坑指南
- HarmonyOS应用开发实战:半天实现知乎日报项目( 五、组件导航Navigation使用详解)
- HarmonyOS Next Tabs组件使用
- 使用最新的 Flutter SDK 3.22.1构建HarmonyOS应用
- 鸿蒙开发(三):使用ArkTS开发鸿蒙应用:登录页面的实现
- 鸿蒙应用开发:WebSocket 使用示例
- HarmonyOS基础组件:Button三种类型的使用
- HarmonyOS 组件复用 @ReusableV2 装饰器的基本使用
- 鸿蒙开发(四):使用ArkTS开发鸿蒙应用:注册页面的实现
- 针对“您的应用使用了HarmonyOS beta版本的API”的解决方法##HarmonyOS应用上架##