基于 HarmonyOS 5.0.0(12) 的 WanAndroid App

api 和官方网站 https://www.wanandroid.com

"compatibleSdkVersion": "5.0.0(12)"

开发工具 Deveco Studio 5.0.3 +

效果

手机端

折叠屏

平板端

others

功能和技术点

• 网络：使用原生 NetworkKit 的 http 进行网络请求（可选三方库 @ohos/axios），cookies 使用原生 PersistentStorage 持久化存储（可选三方库 @tencent/mmkv）
• 图片：使用原生 Image（可选三方库 @ohos/imageknife）
• 状态管理：使用 V1 稳定版。
• 页面路由：原生 NavPathStack + Navigation + NavDestination（可选三方库 @hadss/hmrouter、@hzw/zrouter）
• 首页使用 Tabs 组件，自定义 tabBar
• 页面刷新和加载更多：使用原生 Refresh 组件的 onRefreshing 进行刷新；使用 List 的 onReachEnd 进行加载更多。（可选三方库 @abner/refresh、@ohos/pulltorefresh）
• 适配不同宽度的页面，PersonPage 已使用 Flex 适配
• 浏览历史，侧滑删除使用 @abner/refresh，时间格式化使用 JavaScript 库 dayjs，存储使用原生 PersistentStorage 持久化存储（可选三方库 @tencent/mmkv、@liushengyi/smartdb、@ohos/dataorm）
• 深色模式
• 完善其它接口的页面

开发过程中的一些记录

Webview

微信文章需要开启 DOM

Web().domStorageAccess(true) // 开启 DOM 存储，否则 微信文章 会显示异常

适配 Tablet、Foldable

利用 Flex 组件适配 UI

使用 DevEco 5.1.1 后出现莫名的问题

Stack({ alignContent: Alignment.Center }) {
  Text("空页面")
    .fontSize(25)
}

运行时会报错 Error Message: ';' expected

然后换行处理就没问题了

Stack({ alignContent: Alignment.Center })
// 这里换行后就可以正常运行
{
  Text("空页面")
    .fontSize(25)
}