2025-06-27 22:53:52
鸿蒙Next数据量环形图标Gauge介绍
当我们需要环形展示数据进度,但是又不想使用一个完整的圆环时,Progress组件就不能满足我们的需求,例如汽车的速度表盘,这时我们就需要用引入Gauge组件,他可以满足环形进度展示的同时,设置起始角度,达到不封闭环形的数据展示。 看一下简单的实现效果: [图片] 使用介绍: 1.Gauge使用时必须设置Gauge(options:{value: number..
HarmonyOS NEXT
292
0
2025-06-27 22:53:35
鸿蒙Next数据面板组件DataPanel介绍
数据面板组件,用于将多个数据占比情况使用占比图进行展示。 本文介绍,**环形、线性、自定义柱状面板。**可根据实际需求选取合适的面板类型。 注意:最多包含9个数据,数据面板的类型(不支持动态修改) 看一下演示效果和源码: [图片] @Entry @ComponentV2 struct DataPanelTest{ public color1: string ..
HarmonyOS NEXT
302
0
2025-06-27 22:53:16
鸿蒙Next文本输入TextInput事件回调总结
本文主要整理一下TextInput输入框,输入内容到显示相关的事件回调及用途。 常用事件如下: |事件名称|回调时机| |----|----| |onChange|输入内容发生变化时,触发该回调| |onEditChange|输入状态变化时,触发该回调| |onWillInsert|在将要输入时,触发该回调| |onDidInsert|在输入完成时,触发该回..
HarmonyOS NEXT
359
0
2025-06-27 22:52:56
鸿蒙Next自定义双滑块滑动条实现方案
有同学留言,想要实现一个双滑块的进度条,安排! 实现思路: 1.实现双滑块滑动条,因此需要2个滑块,一个滑动条 2.使用Stack布局,左右放2个Circle作为滑块,实现2个滑块 3.如果想区分滑动区域和未滑动区域的颜色,需要将滑动条分为三部分,左边从小到大滑动区域,右边从大到小滑动区域,中间区域三部分,因此使用3个并列的Row拼接成一个滑动条 4.给2个..
HarmonyOS NEXT
298
0
2025-06-27 22:52:38
鸿蒙Next软键盘弹出避让机制介绍
配置键盘避让时页面的避让模式有三种,分别是上抬模式、压缩模式、不避让 接下来通过一个简单案例介绍这三种模式的使用和区别。 例如以下布局,一个顶部的Row按钮区,底部一个固定高度的按钮区,中间内容区域充满剩余部分,三种避让模式的演示如下: [图片] 针对以上三种模式存在的不足: 1.上抬模式,整体布局上移,软键盘挡住了底部的按钮区 2.压缩模式,当前布局变形 ..
HarmonyOS NEXT
306
0
2025-06-27 22:52:20
鸿蒙Next轮播组件Swiper使用了解
本文介绍一下轮播组件Swiper的基本使用,各属性的含义已在代码中注释说明,可以通过动态修改,查看各属性起到的作用。 通过一个Row容器组件添加属性动画,设置动画持续时间与swiper播放时间匹配,实现一个带进度的指示器,如图。 看一下效果图: [图片] 源码: @Entry @ComponentV2 struct SwiperTest{ private s..
HarmonyOS NEXT
261
0
2025-06-27 22:52:00
鸿蒙Next滑动条Slider详细总结一文了解
音视频播放进度,亮度调节等快速调节设置值的场景通常需要使用到进度条组件 本文列举了Slider所有属性介绍和使用,详细看代码注释和操作按键,即可了解每个属性的功能。 看一下效果图,简单介绍一下:可以复制全部代码,本地自己运行看一下效果 [图片] 使用说明: 1.使用Slider需要配置基本属性SliderOptions,全局定义,可以动态修改,直观看到变化 ..
HarmonyOS NEXT
370
0
2025-06-27 22:51:37
鸿蒙Next进度条组件Progress的使用
进度条组件,用于显示内容加载或操作处理等进度 官方提供了5种类型的进度条,看一下演示效果: [图片] 注意:只有环形进度条Ring支持设置渐变色 1.设置ProgressOptions | 名称 | 说明 | |------------|-------------| | value|指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为to..
HarmonyOS NEXT
289
0
2025-06-27 22:51:17
鸿蒙Next文件读写操作支持写入汉字等符号
本文介绍一下: 1.获取指定目录下的文件 2.向文件内追加写入 3.读取文件中的内容 看一下实现效果: [图片] 实现步骤: 1.使用fileIo.writeSync(fd: number, buffer: ArrayBuffer | string, options?: WriteOptions)写入到文件中 // 文件不存在时创建并打开文件,文件存在时打开..
HarmonyOS NEXT
271
0
2025-06-27 22:50:53
鸿蒙Next动态添加删除布局
背景案例:当我们应用中有一个输入功能,输入个数需要用户动态修改,这时原有的固定布局就不能满足这个需求了,因此就要用到动态添加布局。 简单演示: [图片] 实现原理: 自定义声明式节点 (BuilderNode)提供能够挂载系统组件的能力,支持采用无状态的UI方式,通过全局自定义构建函数@Builder定制组件树。 一个新建的BuildNode在build之后..
HarmonyOS NEXT
324
0
2025-06-27 22:50:34
鸿蒙Next文件下载RCP单线程和多线程使用对比
本文介绍: 1.基于RCP中提供封装好的Session.downloadToFile()方法进行文件下载 2.基于TaskPool和RCP的三方库SFFT实现多线程下载,原理是将文件分割为多个小块,由多个线程同时下载这些部分,并发写入到本地文件中,从而实现高效、稳定的下载 [图片] 看一下实现效果: [图片] 当前网络情况下,同时下同一个文件,使用SFFT多..
HarmonyOS NEXT
323
0
2025-06-27 22:50:06
鸿蒙Next地图服务Map在露天矿山中的使用分享
背景: 无人驾驶露天矿山解决方案的开发是行业发展、政策推动、技术进步与经济效益追求的共同结果。传统露天矿山开采面临安全隐患大、劳动力短缺、管理难度高和成本上升等困境,而国家发改委等部门发布的《关于加快煤矿智能化发展的指导意见》《煤矿智能化建设指南(2021 年版)》等政策明确提出露天煤矿无人化运输等目标,为其开发提供有力导向。同时,5G、大数据、人工智能、车..
HarmonyOS NEXT
274
0
2025-06-27 22:49:41
鸿蒙Next使用ArkUI-X跨平台开发体验
移动端的跨平台开发语言有很多,今天体验一些鸿蒙ArkUI-X运行到安卓设备上。 ArkUI是一套构建分布式应用的声明式UI开发框架。它具备简洁自然的UI信息语法、丰富的UI组件、多维的状态管理,以及实时界面预览等相关能力,帮助您提升应用开发效率,并能在多种设备上实现生动而流畅的用户体验。 ArkUI-X进一步将ArkUI扩展到Android平台,实现对接An..
HarmonyOS NEXT
383
0
2025-06-27 22:48:55
鸿蒙Next层叠布局使用Stack还是RelativeContainer?
层叠布局(Stack) 用于在屏幕上预留一块区域来显示组件中的元素,提供元素可以重叠的布局。层叠布局通过Stack容器组件实现位置的固定定位与层叠,容器中的子元素依次入栈,后一个子元素覆盖前一个子元素,子元素可以叠加,也可以设置位置。 相对布局(RelativeContainer) 是一种采用相对布局的容器,支持容器内部的子元素设置相对位置关系,适用于处理界..
HarmonyOS NEXT
268
0
2025-06-27 22:48:30
鸿蒙Next Tabs实现底部导航进阶
目标:实现一个仿微信底部Tab标签随页面滑动颜色渐变的效果 最终效果: [图片] 实现思路: 1.需要用到tabs两个回调函数: **onGestureSwipe(handler: (index: number, event: TabsAnimationEvent) => void)**在页面跟手滑动过程中,逐帧触发该回调 通过这个函数回调,我们可以知..
HarmonyOS NEXT
290
0
2025-06-27 22:48:06
鸿蒙Next Text长文本实现展开收起2种模式
当展示长文本时,通过会设置maxLines(value: number),则文本最多不会超过指定的行。如果有多余的文本,可以通过textOverflow来指定截断方式。单独设置textOverflow不生效。设置TextOverflow.None与TextOverflow.Clip效果相同。 本文介绍2种样式的展开、收起样式:这里以2行为例 1.仿朋友圈样式..
HarmonyOS NEXT
287
0
2025-06-27 22:47:31
鸿蒙Next仿微信朋友圈图片排序删除
上一篇介绍了Grid的图片拖拽排序,这篇加一下拖拽到底部删除图片的功能,仿微信,但是还不是很完美,以后再完善,看一下成果和代码: [图片] ###Page代码: import { CustomContentDialog, display } from "@kit.ArkUI" import Logger from "../utils/Logger"; let..
HarmonyOS NEXT
360
0
2025-06-27 22:47:09
鸿蒙Next Grid实现拖动排序踩坑
案例背景: 例如当我们在朋友圈分享图片时,选了9张图片,想调整顺序,这时就会用到拖动排序。 最终效果: [图片] 实现过程: 1.通过Picker组件选取照片展示到Grid网格布局中 2.设置编辑模式开启editMode(true),如果想增加动画效果,可以增加设置supportAnimation(true) 3.增加开始拖动和拖动结束的回调,开始时设置拖动..
HarmonyOS NEXT
320
0
2025-06-27 22:46:50
鸿蒙Next应用权限管理
简介: 系统提供了一种允许应用访问系统资源(如:通讯录等)和系统能力(如:访问摄像头、麦克风等)的通用权限访问方式,来保护系统数据(包括用户个人数据)或功能,避免它们被不当或恶意使用。 授权方式: system_grant(系统授权) 指的是系统授权类型,如果在应用中申请了system_grant权限,那么系统会在用户安装应用时,自动把相应权限授予给应用。 ..
HarmonyOS NEXT
388
0
2025-06-27 22:46:21
鸿蒙Next网格布局Grid简单使用
网格布局是由“行”和“列”分割的单元格所组成,通过指定“项目”所在的单元格做出各种各样的布局。网格布局具有较强的页面均分能力,子组件占比控制能力,是一种重要自适应布局,其使用场景有九宫格图片展示、日历、计算器等。 以下通过两种创建网格的方式演示: 1.固定行列分割比例,这种方式,可以让网格子布局按比例充满 2.通过设置最大行/列,最小列/行限制子布局,这样可..
HarmonyOS NEXT
294
0
2025-06-27 22:45:59
鸿蒙Next网络请求HTTP和RCP的使用和对比
RCP指的是远程通信平台(remote communication platform),RCP提供了网络数据请求功能,相较于Network Kit中HTTP请求能力,RCP更具易用性,且拥有更多的功能。在开发过程中,如果有些场景使用Network Kit中HTTP请求能力达不到预期或无法实现,那么就可以尝试使用RCP中的数据请求功能来实现。以下贴一部分对比截..
HarmonyOS NEXT
333
0
2025-06-27 22:45:35
鸿蒙Next解决子组件全屏后margin不生效
当Column/Row是全屏时,子组件如果想通过设置宽度为全屏,然后通过margin设置左右边距限制子组件的大小,这时会发现,子组件的margin并没有生效,宽度依然是全屏的,例如: [图片] 由上发现: 1.margin并没有限制了子组件的宽小于父组件 2.Column的左margin生效了,但是Column的宽和父组件的Row的宽是一样的 解决方案: 使..
HarmonyOS NEXT
284
0
2025-06-27 22:44:51
鸿蒙Next实现一个带表头的横向和纵向滑动的列表
实现思路: 1.头部表头使用一个横向的list展示表头列表信息 2.左边固定列用一个纵向的list展示固定信息 3.右边使用垂直list展示数据项,横向list展示每条数据项的内容 设计一个草图: [图片] ###基本布局开始实现: 1.定义数据结构: @ObservedV2 class ListItemData { @Trace text: string ..
HarmonyOS NEXT
308
0
2025-06-27 22:44:22
鸿蒙Next MVVM模式使用
MVVM模式介绍 在应用开发中,UI的更新需要随着数据状态的变化进行实时同步,而这种同步往往决定了应用程序的性能和用户体验。为了解决数据与UI同步的复杂性,ArkUI采用了 Model-View-ViewModel(MVVM)架构模式。MVVM 将应用分为Model、View和ViewModel三个核心部分,实现数据、视图与逻辑的分离。通过这种模式,UI可以..
HarmonyOS NEXT
314
0
2025-06-27 22:44:03
鸿蒙Next组件导航 (Navigation)
组件导航(Navigation) 主要用于实现页面间以及组件内部的页面跳转,支持在不同组件间传递跳转参数,提供灵活的跳转栈操作,从而更便捷地实现对不同页面的访问和复用。页面路由 (@ohos.router)(不推荐) 项目配置步骤: 1.在entry项目目录resourses/base/profile下新建一个json文件:route_map.json 2...
HarmonyOS NEXT
294
0
2025-06-27 22:43:16
鸿蒙Next气泡提示(Popup)的使用
本文介绍自定义的气泡CustomPopupOptions的使用,设置弹出框内容,弹出框位置,是否为模态窗口,默认小箭头的设置,简单动画,看效果: [图片] @Entry @ComponentV2 struct test{ @Local customPopup: boolean = false @Builder viewToolView(){ Row({sp..
HarmonyOS NEXT
326
0
2025-06-27 22:42:48
鸿蒙Next Text内容超出父容器?
当我们在布局中使用Text展示文本内容时,如果父布局是固定宽高,当Text展示的内容过长并且没有限制时,会超出父容器,这点和安卓中是不一样的,安卓中会自动截取超出部分。 因此我们在开发过程中,如果Text内容长度不固定,我们要提前设置好边界,以防内容超出。 以下是展示及解决办法: [图片] @Entry @Component struct test{ bui..
HarmonyOS NEXT
323
0
2025-06-27 22:42:29
鸿蒙Next异步并发 (Promise和async/await)
异步和多线程有啥区别? 原理 异步开发:异步编程以非阻塞的方式运行代码,当程序发起一个可能耗时的操作(如网络请求、文件读写)时,不会等待该操作完成,而是继续执行后续代码。待操作完成后,通过回调函数、Promise、async/await 等机制来处理结果。 多线程开发:多线程是指在一个程序中同时运行多个线程。这些线程可以并行执行不同的任务,共享进程的资源。 ..
HarmonyOS NEXT
282
0
2025-06-27 22:42:11
鸿蒙Next Scroll+List+Tabs实现关联滑动
实现一个Scroll嵌套List+Tabs,Tabs实现吸顶效果,Tabs标签可以随着List的滑动自动切换,切换Tabs标签时可以自动定位List位置。 实现思路: 1.滑动事件处理,Scroll嵌套List,向上滑动优先父容器滑动,向下滑动优先List滑动,滑动事件处理在绑定半模态页面那篇有介绍 2.Tabs吸顶,使用Column包裹Tabs+List,..
HarmonyOS NEXT
331
0
2025-06-27 22:41:53
鸿蒙Next 底部弹框绑定半模态页面(bindSheet)
半模态页面(bindSheet)默认是模态形式的非全屏弹窗式交互页面,允许部分底层父视图可见,帮助用户在与半模态交互时保留其父视图环境。 [图片] 如果sheet布局是个list可滑动布局,需要先了解一下嵌套滚动 NestedScrollMode SELF_ONLY 只自身滚动,不与父组件联动。 SELF_FIRST 自身先滚动,自身滚动到边缘以后父组件滚动..
HarmonyOS NEXT
285
0
热门文章
uniapp-x的HarmonyOS鸿蒙应用开发:tabbar底部导航栏的实现
136 浏览
0 评论
uni-app x跨平台开发实战:鸿蒙HarmonyOS网络模块封装与轮播图实现
135 浏览
0 评论
鸿蒙HarmonyOS练手项目免费API 开放接口分享
140 浏览
0 评论
uni-app x跨平台开发实战:爱影家免费观影APP音乐播放功能实现详解
130 浏览
0 评论
React Native 0.77.1 适配鸿蒙(RN-OH)开发指南
216 浏览
0 评论
利用扣子平台搭建获取抖音某用户主页的视频文案并写入多维表格的工作流
610 浏览
0 评论
Flutter 开发的鸿蒙AtomGit OAuth 授权应用
275 浏览
0 评论
