前言
最近不知道怎么鸿蒙Harmony突然就很火,到处都是鸿蒙开发相关的文章,培训机构的也是各种推鸿蒙应用,不知道是真的🔥了,还是在贩卖焦虑!不过看热度不错,那也就来了解了解咱们的遥遥领先😊,花了大概一周的闲暇时间从了解到参照自己以前开眼App的api写了一款鸿蒙版本的开眼App!!!
先把项目的地址贴上去:WinWang/HarmoneyOpenEye: 华为鸿蒙Harmony开眼App(项目整体基于Api9+ArkTs+ArkUI) (github.com)
开发准备
1、开发工具
这一块推荐大家直接看官方社区文档,跟着文档走,下载开发工具DevEco-Studio并按照提示配置好对应的环境,初次体验可以尝试官方给的Sample创建一个demo工程体验下项目的配置和页面UI等
2、安装设备
遥遥领先是买不起了,大家直接类似Android开发一样创建对应的模拟器就好了;我用同事的真机安装测试发现Mate 30系列其实安装起来体验很糟糕,看官方论坛说是针对麒麟990和以前的cpu兼容性还没处理好,具体表现是点击界面线程阻塞无响应。
3、开发鸿蒙相关网站
以下网站是我在开发中使用较多的网站
1、UI使用参考
开发说明-容器组件-组件参考(基于ArkTS的声明式开发范式)-ArkTS API参考-HarmonyOS应用开发
2、相关开源库查询使用参考
DevEco Marketplace (harmonyos.com)
3、相关问题查询-官方论坛
文档中心 | 华为开发者联盟 (huawei.com)
项目功能简介
项目开发细节就不做过多的介绍了,项目整体基于Api9+Stage模式+ArkTs+ArkUI,主要列举下项目相关功能
1、常用组件的抽取;
2、网络请求的基础封装(基于axios和http分别写了一份)
3、封装项目页面多状态(加载中,成功,失败,空数据)
4、视频播放以及视频列表播放功能
5、列表页面刷新加载、滚动监听示例等
需要注意一点的是项目里面因为引用了axios框架,需要用ohpm(类似npm吧😭)安装axios,如果不能运行配置下环境变量即可 ohpm install @ohos/axios
项目贴图
总结
针对鸿蒙开发,相对来说如果有过Flutter或者Android Compose开发经验,使用ArkUI开发UI会无差别上手开撸;ArkTs对前端大佬来说又很熟悉和友好,不过总的来说都还行,新推出的UI都往声明式UI方向走,开发语言当作ts来对待就好,我的理解是多了些装饰器等等,当然在开发的时候也遇到一些槽点吧,我罗列大致如下:
1、自定义组件里面放BuilderParams的时候,如果超过两个不能使用闭包,这针对需要外部传参两个BuilderParams的情况写法就不太友好
2、自定义组件里面Link和Props不能设置默认值,使用这个组件外部必须使用State声明同步传递参数
3、@Extend和@Style这种抽取样式居然不能在组件外抽取公共的样式,只能在创建组件的Component里面创建,这样就没有办法设置公共的按钮、文字这些的样式了
4、沉浸式状态栏看了官方的Api和社区,我目前没找到很好的解决办法
5、最大的可能就是真机运行的支持了
可能我说的这些问题也有好的解决方法,希望知道的大佬不吝赐教!!!
##### 最后也把自己一些其他项目学习的链接贴下,只能说现在都在往大前端方向走了,真的卷不动了 Flutter版本 开眼App链接(getx+retrofit+dio+jsonserialize+自定义控件demo):github.com/WinWang/ope...
Flutter版本 的音乐播放App链接(getx+retrofit+dio):github.com/WinWang/mus...
ReactNative版本 的开眼App链接(ReactNative-0.72):github.com/WinWang/RNO...
React版本 的开眼App链接(React18+React-Vant+Mobx+axios):github.com/WinWang/rea...
Vue2版本 WanAndroid链接(Vue2+vuex+vant+axios):github.com/WinWang/Vue...
Vue3版本 WanAndroid链接(vue3+typeScript+pinia+vant+vite):github.com/WinWang/Vue...
Android组件化项目 ReadingGallery链接(jetpack+kotlin+koin+couroutine):github.com/WinWang/Rea...
Android组件化项目初始化工具 ApplicationInit链接(gradle-plugin+注解APT+ASM):github.com/WinWang/App...