中秋、国庆双节将至,作为程序员,以代码之名,表达对于阖家团圆的祝福。本节将演示如何在基于HarmonyOS ArkUI的SwiperController、Image、Swiper等组件来实现节日祝福轮播程序。
本文涉及的所有源码,均可以在文末链接中找到。
活动主页
https://mp.weixin.qq.com/s/9EDTkXbL-1_9ymv-HXd1IQ
规则要求具体要求如下:
1、根据主题,用ArkTS语言编写代码实现。
2、将ArkTS工程打包文件、最终的效果gif图和VOD相关文件,一起打包(大小18M以内)发送至:harmonyos@huawei.com
注:
*开发过程中遇到问题,请描述完整,可以按照下方VOD贡献奖规则,将所有信息打包上传。
*为了方便核验作品,保证作品的独特性,请将作品名称命名为:英文或者拼音+发布时间(例:bestwish202309281523)。
创建应用
选择空模板。
创建名为ArkUIMidAutumnFestival的HarmonyOS应用。
核心代码讲解
主页Index.ets 主要是使用了SwiperController、Image、Swiper来实现图片联播。
@Entry
@Component
struct Index {
private swiperController: SwiperController = new SwiperController()
build() {
Column() {
Swiper(this.swiperController) {
Image($r('app.media.001'))
Image($r('app.media.002'))
Image($r('app.media.003'))
}
.index(0)
.autoPlay(true) // 自动播放
.indicator(true) // 默认开启指示点
.loop(true) // 默认开启循环播放
.duration(50)
.vertical(true) // 默认横向切换
.itemSpace(0)
}.height('100%').width('100%').backgroundColor(0x3d3d3d)
}
}
复制
其中,在media目录下放置相应的图片资源。
效果演示
源码
见:https://github.com/waylau/harmonyos-tutorial
学习更多HarmonyOS
作为开发者,及时投入HarmonyOS 4的学习是非常必要的。鸿蒙生态经历了艰难的四年,但轻舟已过万重山,目前已经慢慢走上了正轨,再现繁荣指日可待。
可以从HaromnyOS 官网(https://www.harmonyos.com/)了解到最新的HaromnyOS咨询以及开发指导。除此之外,笔者也整理了以下学习资料。
- 华为开发者联盟:https://developer.huawei.com/consumer/cn/forum/communityHome
- 《跟老卫学HarmonyOS开发》 开源免费教程:https://github.com/waylau/harmonyos-tutorial
- 《鸿蒙HarmonyOS手机应用开发实战》(清华大学出版社)
- 《鸿蒙HarmonyOS应用开发从入门到精通战》(北京大学出版社),
- “鸿蒙系统实战短视频App 从0到1掌握HarmonyOS” :https://coding.imooc.com/class/674.html