- 博客(114)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 ArkUI滚动容器Scroll与Scorller滚动控制器全面解析，建议收藏！！
摘要： Scroll是ArkUI中的可滚动容器组件，当子组件尺寸超过父组件时支持滚动。关键特性包括： 必须满足子组件尺寸>父组件尺寸才能滚动，且仅支持单一子组件 支持通过.scrollBar()控制滚动条显示/隐藏 可通过.scrollable()设置垂直/水平滚动方向 提供.scrollBarWidth()和.scrollBarColor()自定义滚动条样式 使用Scroller控制器实现精准滚动控制（如scrollTo定位、scrollBy增量滚动等） 通过onDidScroll监听实时滚动位置和
2025-08-08 16:31:54
719
原创 HarmonyOS鸿蒙多线程并发之TaskPool快速上手
对于刚接触多线程编程的新手来说，理解进程、线程、并发和并行等基础概念是至关重要的。在深入探讨多线程并发之前，让我们先统一这些基础概念的认识，为后续学习打下坚实的基础。
2025-07-28 13:34:02
1229
2
原创 HarmonyOS路由导航方案演进：HMRouter基于Navigation封装，使用更方便
HMRouter路由框架演进与使用 摘要：HMRouter是OpenHarmony三方库中基于Navigation封装的路由框架，解决了Navigation使用不便的问题并增强功能。从HarmonyOS 5.0开始，官方推荐使用HMRouter替代router和Navigation。HMRouter通过Navigation组件结构实现页面导航，包含导航页和子页管理。安装配置简单，支持自定义注解和构建插件。使用时需初始化路由框架，定义入口页面，通过HMRouterMgr实现页面跳转、返回和参数传递（URL参数
2025-09-04 11:54:51
1197
原创 鸿蒙应用实战之计算器
这篇文档介绍了如何使用ArkTS开发一个简易计算器应用，主要包含以下内容： 功能需求：实现基本加减乘除运算，采用双行显示区域（上为表达式，下为结果），支持按键动画效果和运算结果过渡动画。 界面实现： 采用Column垂直布局 显示区域分为两个Text组件 键盘区使用Grid网格布局，特殊处理"="键的布局 通过AttributeModifier实现按键动态样式 按键处理逻辑： 数字键处理：包含去零、小数点规则等特殊处理 运算符键处理：区分不同运算符类型 提供AC、±、%、=等特殊功能键处
2025-08-30 17:08:29
868
原创 鸿蒙应用开发之页面导航，router不推荐了拥抱Navigation
Navigation组件是ArkUI中的路由容器，通常作为首页根容器使用，由导航页(NavBar)和子页(NavDestination)组成。导航页包含标题栏、菜单栏、内容区和工具栏，可通过hideNavBar隐藏；子页由标题栏、菜单栏和内容区构成。两者可通过路由自由切换，且导航页不在页面栈中。 典型应用场景是Tabs+Navigation组合实现多级页面导航：Tabs控制底部导航栏，Navigation作为二级页面容器，NavDestination展示三级详情页。案例展示了快速入门页的结构实现，包含列表点
2025-08-30 17:04:48
957
原创 鸿蒙应用开发之页面路由router模块
本文介绍了HarmonyOS应用开发中的页面路由基本概念和实现方法。主要内容包括：1）如何创建新页面并配置路由URL；2）页面跳转的两种方式（router.pushUrl()和router.replaceUrl()）及其区别；3）页面栈的工作原理，最大容量为32，遵循"先进后出"原则；4）通过示例演示了从LoginPage跳转到HomePage、从HomePage跳转到DetailPage以及返回HomePage的完整流程。文章还强调了页面栈管理的重要性，replaceUrl()会替换栈
2025-08-30 16:55:54
876
原创 鸿蒙应用开发之Canvas绘制能力
Canvas组件开发指南摘要：Canvas组件支持自定义图形绘制，通过CanvasRenderingContext2D对象实现基础形状、文本和图片的绘制。开发时需在onReady回调中获取画布尺寸后开始绘制，提供fillRect()、arc()、ellipse()等方法绘制矩形/圆形/椭圆，并支持通过fillStyle、strokeStyle等属性设置样式。示例代码展示了如何创建带边框和填充色的基本图形，包括设置颜色、线宽等样式参数。
2025-08-30 14:47:44
564
原创 鸿蒙应用开发之元服务开发及注意事项
元服务是HarmonyOS提供的轻量级应用形态，具有免安装、即用即走、账号跟随等特点。与传统应用相比，元服务包体积更小、开发成本更低，能自动更新并通过系统入口分发。开发者需先在AppGallery Connect创建元服务应用，再通过DevEco Studio创建工程，开发包含页面、卡片和图标三部分内容。元服务图标采用特殊设计语言，体现HarmonyOS特性。开发流程包括创建项目、编码、打包、测试和上架等环节，支持真机调试和开放式测试。
2025-08-30 14:44:25
1170
原创 鸿蒙应用开发之服务卡片
Form Kit提供卡片开发服务，通过将应用功能和信息以卡片形式展示在桌面，实现服务直达和减少跳转。卡片由提供方（包含业务逻辑和UI模块）和使用方（如桌面应用）组成，支持交互功能。创建卡片时可在工程中右键新建ArkTS卡片，选择模板后生成相关文件（生命周期管理、页面和配置文件）。卡片分为静态和动态类型，支持通过配置修改。
2025-08-30 14:41:59
577
原创 鸿蒙应用开发之@Builder自定义构建函数：值传递与引用传递与UI更新
本文介绍了ArkUI中的@Builder装饰器，用于创建自定义构建函数实现UI复用。自定义构建函数分为私有（组件内使用）和全局（跨组件使用）两种形式。文章详细讲解了参数传递规则：按值传递不会触发UI更新，而按引用传递（仅限单参数对象字面量）可响应状态变化。同时指出了@Builder的限制条件：禁止修改参数值、多参数传递不触发更新，以及@Builder与@Component组件的区别（前者专注UI复用，后者具备完整组件特性）。通过多个代码示例直观展示了不同场景下的使用效果。
2025-08-15 14:47:56
1385
原创 鸿蒙应用开发之自定义组件@Component全面解析：自定义组件生命周期
本文介绍了ArkUI中的自定义组件开发，包括其特点、基本结构、成员函数/变量定义及参数传递方式。自定义组件具有可组合、可重用和数据驱动UI更新的特性，通过@Component装饰器定义。文章详细说明了如何在组件中定义成员变量和函数，以及如何接收外部参数。最后简要提及了组件和页面的生命周期函数，包括aboutToAppear、onPageShow等关键回调，为开发者提供了构建可复用UI组件的基础知识。
2025-08-14 18:11:10
1062
原创 鸿蒙应用开发之Tabs选项卡：仿微信底部导航全面解析，建议收藏
很多时候导航页签是图片、文本组成，并且需要根据选中的页签改变图片和文本的颜色，此时就需要使用自定义导航。如下图，模仿微信底部导航效果1. 自定义导航页签按照需求设计导航页签的布局结构，每一个页签包含选中图片未选中图片文本索引四个参数，如果Tabs当前索引等于页签索引，则显示选中图片，并且改变文本颜色。/*title: 页签标题targetIndex: 页签的索引selectedImg: 选中时图标normalImg: 未选中时*///当前选中页签索引@BuilderColumn() {
2025-08-14 15:55:01
817
原创 鸿蒙应用开发瀑布流上拉加载无限滚动一文搞定
摘要：ArkUI的WaterFlow组件支持瀑布流布局，适用于图片展示场景。它提供纵向和横向两种布局方式，通过columnsTemplate/rowsTemplate设置行列数，自动将子项填充到高度/宽度最小的列/行。本文演示了如何实现无限滚动瀑布流：1)创建IDataSource数据源类管理数据；2)使用LazyForEach循环渲染，配合onReachEnd事件实现懒加载；3)通过随机尺寸算法使每个FlowItem呈现交错效果，使用itemWidthArray和itemHeightArray保存随机生成
2025-08-13 09:19:16
1112
原创 鸿蒙原生应用ArkUI之自定义List下拉刷新动效
这篇文章介绍了Refresh下拉刷新组件的使用方法。主要内容包括：1）基本使用方式，通过嵌套List实现下拉刷新功能；2）可配置属性如刷新距离、跟手系数等；3）状态变化和刷新事件监听；4）自定义刷新动效的实现方法。文章提供了完整的示例代码，演示了如何创建默认刷新效果和自定义UI样式，并详细说明了组件的各项参数和回调函数的使用场景。该组件适用于需要下拉刷新功能的列表页面开发。
2025-08-12 15:56:17
450
原创 ArkUI 网格Grid构建行列布局，合并单元格，构建计算器界面
ArkUI提供了Grid和GridItem组件实现网格布局，支持行列占比设置、主轴方向控制、单元格合并等功能。Grid通过rowsTemplate和columnsTemplate定义行列数量与占比，若不设置则可通过layoutDirection指定主轴方向。GridItem可设置跨行跨列，通过onGetRectByIndex回调实现类似计算器按键的不规则布局。Grid组件支持条件渲染、循环渲染和懒加载，需注意未设置宽高时会自适应父容器，行列设置会影响元素显示和滚动行为。网格布局适用于九宫格、日历等需要均匀分
2025-08-12 14:33:41
863
原创 ArkUI常用组件之Swiper轮播图与自定义导航点，独立导航点
Swiper组件是用于实现图片轮播效果的常用组件，支持自动播放、循环展示等功能。文章介绍了Swiper的基本使用方式，包括图片轮播的实现代码示例。同时详细讲解了导航点样式的配置方法，包括默认圆点导航点和自定义数字导航点的设置，以及如何通过indicator属性调整导航点的位置和样式。从API15开始，Swiper支持独立导航点功能，可以与Swiper分离布局，通过IndicatorComponentController实现联动控制。文章提供了圆点和数字两种独立导航点的实现代码，展示了如何通过控制器实现更灵活
2025-08-11 21:10:32
357
原创 ArkUI 最常用滚动组件之List列表全面解析：建议收藏
本文介绍了ArkUI中的List组件，它是用于显示结构化可滚动内容的常用容器。主要内容包括：1) List必须与ListItem配合使用，支持.divider()设置分割线；2) 列表样式可通过space、scrollBar、listDirection等属性调整；3) 推荐使用ForEach循环渲染相同结构的列表项，提高性能；4) 复杂列表建议结合@Builder装饰器实现组件复用；5) 以商品列表和待办事项为例，演示了数据绑定和动态编辑（增删改）的实现方法。List组件能有效处理大数据量的滚动展示，是开发
2025-08-11 11:58:52
462
原创 ArkUI星级评论条Rating组件的用法一步到位
摘要 本文介绍了评分进度条(Rating)组件的实现方法。通过代码示例展示了如何创建可交互的评分条，包括设置初始分值(3.5)、评分总数(5星)和步长(0.5)。同时讲解了如何自定义评分条样式，包括未选中、选中一半和完全选中的三种状态图片的替换方法。该组件适用于电商平台等需要用户评分的场景，支持灵活配置和视觉定制。
2025-08-08 16:40:53
232
原创 一文搞定ArkUI进度条组件Progress的使用以及自定义特效样式
本文介绍了HarmonyOS中的进度条(Progress)组件，包含5种常用样式及其实现方式：1)线性进度条(水平/垂直方向)；2)环形进度条；3)环形刻度进度条；4)胶囊进度条；5)渐变进度条。每种样式都提供了示例代码，并展示了如何通过参数控制方向、颜色、宽度等属性。此外，还演示了进度条动态效果实现，包括加载动画和扫描特效，以及通过按钮控制进度值的交互案例。最后介绍了进度状态(status)和扫描效果(enableScanEffect)等特殊属性的使用方法。
2025-08-07 20:56:28
431
原创 ArkUI切换按钮Toggle用法你学会了吗
本文介绍了ArkUI中的Toggle组件，该组件提供三种状态切换样式：按钮、复选框和开关样式。通过ToggleOptions创建，可设置初始状态(isOn)和类型(type)。支持自定义样式属性如selectedColor设置选中背景色，switchPointColor调整滑块颜色，以及switchStyle配置更多细节。组件还支持onChange事件监听状态变化并触发相应操作。文中提供了代码示例和效果图展示不同样式配置，包括按钮文字、开关滑块颜色等自定义效果，最后演示了如何监听开关状态变化并弹出提示信息。
2025-08-07 20:40:56
301
原创 ArkUI单选按钮Radio全面解析：自定义单选按钮指示器
本文介绍了鸿蒙开发中单选按钮(Radio)组件的使用方法。主要内容包括：1) 通过RadioOptions创建单选按钮，设置value和group属性；2) 使用checked属性控制选中状态；3) 通过onChange事件监听选中状态变化；4) 使用radioStyle自定义按钮样式；5) 通过indicatorType和indicatorBuilder自定义选中指示器；6) 提供了完整的示例代码展示单选按钮的实际应用场景。文章最后还介绍了如何获取鸿蒙开发者认证资料，适合鸿蒙开发者学习参考。
2025-08-07 19:46:00
442
原创 一文搞定ArkUI自定义按钮样式
Button是按钮组件，通常用于响应用户的点击操作，其类型包括胶囊按钮、圆形按钮、普通按钮、圆角矩形按钮。Button作为容器使用时可以通过添加子组件实现包含文字、图片等元素的按钮。
2025-08-07 18:44:14
428
原创 一文搞定ArkUI文本输入场景：单行输入框/多行输入框、键盘避让
本文介绍了HarmonyOS中的输入框组件TextInput和TextArea的使用方法。TextInput是单行输入框，支持Normal、Password、Email等多种输入模式；TextArea是多行输入框，可自动换行显示。文章详细展示了如何设置输入框样式（边框、背景色、文字颜色等）、监听焦点变化以及实现键盘避让功能。通过代码示例和效果图，帮助开发者快速掌握这两种基础组件的使用方法，适用于构建评论、聊天、登录等多种输入场景。
2025-08-07 17:47:12
470
原创 一文搞定ArkUI所有图片加载场景：收藏这一篇就够了
本文介绍了HarmonyOS中Image组件的多种图片加载方式：1）Resources资源（存放在media或rawfile目录下）；2）本地图片（直接存放在ets目录）；3）网络图片（需申请权限）；4）像素图（PixelMap格式）；5）矢量图（SVG格式，支持修改颜色）；6）多媒体库图片（通过uri加载）。每种方式都提供了具体代码示例和效果展示，包括资源路径设置、权限申请、数据转换等关键实现细节，帮助开发者灵活运用不同来源的图片资源。
2025-08-07 15:55:58
490
原创 ArkUI 基础组件之Text
本文介绍了HarmonyOS中的Text组件使用方法。Text组件支持文本展示，可通过字符串或资源引用创建，并可添加Span子组件实现富文本效果。文章详细展示了文本对齐方式（水平/垂直）、文本溢出处理、样式设置等核心功能，并通过热搜榜示例演示了实际应用场景。Text组件支持多种样式配置，如字体大小、颜色、装饰线等，并能结合Span和ImageSpan实现复杂文本布局，满足多样化UI需求。
2025-08-05 00:08:45
326
原创 ArkUI 基础布局之层叠布局Stack
层叠布局（Stack）是一种垂直叠加的布局方式，后添加的组件会覆盖在先前的组件上。通过alignContent参数可设置九种对齐方式，控制子组件相对位置。子组件默认按添加顺序堆叠，但可通过zIndex属性调整显示层级，数值越大显示越靠前。当后续子元素尺寸大于前面元素时，前面元素会被完全遮挡。代码示例展示了如何通过调整zIndex使被遮挡元素重新显示。
2025-08-03 20:58:59
338
原创 ArkUI 基础布局之弹性布局Flex
Flex弹性布局详解：支持Row/Column方向布局，可通过direction参数设置布局方向（Row/RowReverse/Column/ColumnReverse）。默认不折行，设置wrap:FlexWrap.Wrap可启用折行效果，并支持配置主轴/交叉轴间距。提供主轴(justifyContent)和交叉轴(alignContent)对齐方式设置，类似Row/Column布局。当子元素总宽度超过容器时，默认会挤压子元素，启用折行后可实现自动换行布局。适用于需要灵活控制子元素排列的场景。
2025-08-02 23:36:40
360
原创 ArkUI 相对布局全面解析
相对布局(RelativeContainer)允许子组件基于父组件或兄弟组件进行相对定位。子组件通过alignRules设置对齐规则，指定参考边线(6条边界线)、锚点(父容器__container__或兄弟组件id)和对齐方式。示例展示了在父容器四个角和中心放置组件，以及相对于兄弟组件定位的方法。当相对定位不精确时，可用offset设置偏移量进行微调。相对布局通过灵活的对齐规则实现精确的组件定位。
2025-08-01 20:48:14
397
原创 ArkUI 基础容器之线性布局Column和Row，图文并貌秒懂
本文介绍了线性布局的两种主要形式：水平布局(Row)和垂直布局(Column)。Row组件默认从左到右排列子元素，可通过direction属性设置方向；Column组件默认从上到下排列，支持reverse反转。两种布局都支持通过space参数设置子元素间距，并提供主轴(justifyContent)和交叉轴(alignItems)的对齐方式控制，分别支持6种和3种对齐选项。Row的主轴对齐控制水平方向，Column的主轴对齐控制垂直方向，交叉轴则相反。文章通过代码示例和效果图展示了不同参数设置下的布局效果。
2025-08-01 10:30:10
399
原创 ArkUI 通用属性之渐变、透明度、模糊、高亮、对比度、饱和度一网打尽
本文介绍了ArkUI框架中的视觉效果设置方法，主要包括透明度、颜色渐变和图像效果三类。透明度可通过opacity()方法设置，支持0-1范围值，子组件会继承并叠加父组件的透明度。颜色渐变分为线性渐变(linearGradient)、径向渐变(radialGradient)和角度渐变(sweepGradient)，可自定义角度、方向、颜色和位置参数实现多种渐变效果。图像效果包含阴影(shadow)和模糊处理，背景模糊(backgroundBlurStyle)和前景模糊(foregroundBlurStyle)
2025-08-01 00:44:38
955
原创 ArkUI 通用属性之视觉效果透明度、渐变效等
本文介绍了两种UI视觉效果实现方法：透明度设置和颜色渐变。透明度可通过opacity()方法设置（0-1范围），子组件会继承父组件透明度并叠加计算。颜色渐变包含三种方式：线性渐变（linearGradient）支持角度/方向设置，径向渐变（radialGradient）支持中心点和半径配置，角度渐变（sweepGradient）可定义起止角度。每种渐变方式都需通过colors参数指定[颜色,位置]数组，并提供了具体代码示例和效果图示说明。
2025-07-30 17:16:38
492
原创 ArkUI 通用属性之位置设置
设置当前组件在父组件中的位置，参照点为父容器顶点位置。在布局容器中，设置该属性不影响父容器布局，仅在绘制时进行位置调整。如图所示，虚线处为Row()组件原本的位置，当设置后会脱离原来父组件的约束，采用决定定位参照父容器左顶点重新定位。10vp10vp。
2025-07-30 00:57:41
321
1
原创 ArkUI 通用属性之背景设置
背景设置包括背景颜色、背景图片、背景图片位置、背景图片大小相关设置。warning]当背景颜色、背景图片同时设置时，背景颜色位于底层。
2025-07-30 00:52:56
486
原创 ArkTS 线程通信共享对象
Transferable对象，也称为NativeBinding对象，是指绑定C++对象的JS对象，其主要功能由C++提供，JS对象壳则分配在虚拟机的本地堆（LocalHeap）中。普通对象跨线程时通过拷贝形式传递，两个线程的对象内容一致，但指向各自线程的隔离内存区间，被分配在各自线程的虚拟机本地堆（对象跨线程传输后，重新创建JS壳可桥接到C++对象上，但需移除原JS壳与C++对象的绑定关系。对象跨线程传输后，只需重新创建JS壳即可桥接到同一个C++对象上，实现C++对象的共享。
2025-07-28 17:07:49
819
原创 ArkTS 创建Worker线程与主线程通信
创建Worker的线程称为宿主线程（不局限于主线程，Worker线程也支持创建Worker子线程）。Worker子线程（或Actor线程、工作线程）是Worker自身运行的线程。每个Worker子线程和宿主线程拥有独立的实例，包含独立执行环境、对象、代码段等。因此，启动每个Worker存在一定的内存开销，需要限制Worker子线程的数量。Worker子线程和宿主线程通过消息传递机制通信，利用序列化机制完成命令和数据的交互。的主要作用是为应用程序提供一个多线程的运行环境，实现应用程序执行过程与宿主线程分离。
2025-07-28 16:57:46
369
原创 从 Promise 到 async/await 的终极指南、ArkTS、TS、JS异步任务全面解析
任务是完成某项操作要执行的一段代码，一个任务可以执行任何特定操作的代码，可能是简单的打印语句、复杂的算法处理、网络请求或 I/O 操作等。这些任务的执行时间各不相同，打印语句执行时间通常很短，而网络请求和 I/O 操作可能耗时较长。如果所有的任务按照顺序执行，耗时较长的任务可能会阻塞线程，导致整体性能下降，进而影响用户体验。为了更高效地管理和执行这些任务，JavaScript将要执行的任务分为同步任务和异步任务使得JavaScript能够在单线程环境中有效地处理耗时操作，而不阻塞主线程。
2025-07-28 00:06:58
929
2
原创 ArkTS 模块与命名空间
每个文件都是一个独立的模块，变量和类型默认私有，需显式导出才能被其他文件使用。都是用于代码组织的机制，但它们的用途和适用场景有所不同。，让它们通过一个共同的“调用者”（即命名空间名称）来访问。恭喜你，模块和命名空间学完了，手动撒花🎉🎉🎉。到另一个文件中，倒入命名空间。，基于 ES6 模块系统（
2025-07-27 02:40:17
459
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人