2025-06-27 22:48:06

鸿蒙Next Text长文本实现展开收起2种模式

当展示长文本时,通过会设置maxLines(value: number),则文本最多不会超过指定的行。如果有多余的文本,可以通过textOverflow来指定截断方式。单独设置textOverflow不生效。设置TextOverflow.None与TextOverflow.Clip效果相同。 本文介绍2种样式的展开、收起样式:这里以2行为例 1.仿朋友圈样式..

HarmonyOS NEXT
132
0
2025-06-27 22:47:31

鸿蒙Next仿微信朋友圈图片排序删除

上一篇介绍了Grid的图片拖拽排序,这篇加一下拖拽到底部删除图片的功能,仿微信,但是还不是很完美,以后再完善,看一下成果和代码: [图片] ###Page代码: import { CustomContentDialog, display } from "@kit.ArkUI" import Logger from "../utils/Logger"; let..

HarmonyOS NEXT
133
0
2025-06-27 22:47:09

鸿蒙Next Grid实现拖动排序踩坑

案例背景: 例如当我们在朋友圈分享图片时,选了9张图片,想调整顺序,这时就会用到拖动排序。 最终效果: [图片] 实现过程: 1.通过Picker组件选取照片展示到Grid网格布局中 2.设置编辑模式开启editMode(true),如果想增加动画效果,可以增加设置supportAnimation(true) 3.增加开始拖动和拖动结束的回调,开始时设置拖动..

HarmonyOS NEXT
140
0
2025-06-27 22:46:50

鸿蒙Next应用权限管理

简介: 系统提供了一种允许应用访问系统资源(如:通讯录等)和系统能力(如:访问摄像头、麦克风等)的通用权限访问方式,来保护系统数据(包括用户个人数据)或功能,避免它们被不当或恶意使用。 授权方式: system_grant(系统授权) 指的是系统授权类型,如果在应用中申请了system_grant权限,那么系统会在用户安装应用时,自动把相应权限授予给应用。 ..

HarmonyOS NEXT
146
0
2025-06-27 22:46:21

鸿蒙Next网格布局Grid简单使用

网格布局是由“行”和“列”分割的单元格所组成,通过指定“项目”所在的单元格做出各种各样的布局。网格布局具有较强的页面均分能力,子组件占比控制能力,是一种重要自适应布局,其使用场景有九宫格图片展示、日历、计算器等。 以下通过两种创建网格的方式演示: 1.固定行列分割比例,这种方式,可以让网格子布局按比例充满 2.通过设置最大行/列,最小列/行限制子布局,这样可..

HarmonyOS NEXT
130
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
135
0
2025-06-27 22:45:35

鸿蒙Next解决子组件全屏后margin不生效

当Column/Row是全屏时,子组件如果想通过设置宽度为全屏,然后通过margin设置左右边距限制子组件的大小,这时会发现,子组件的margin并没有生效,宽度依然是全屏的,例如: [图片] 由上发现: 1.margin并没有限制了子组件的宽小于父组件 2.Column的左margin生效了,但是Column的宽和父组件的Row的宽是一样的 解决方案: 使..

HarmonyOS NEXT
133
0
2025-06-27 22:44:51

鸿蒙Next实现一个带表头的横向和纵向滑动的列表

实现思路: 1.头部表头使用一个横向的list展示表头列表信息 2.左边固定列用一个纵向的list展示固定信息 3.右边使用垂直list展示数据项,横向list展示每条数据项的内容 设计一个草图: [图片] ###基本布局开始实现: 1.定义数据结构: @ObservedV2 class ListItemData { @Trace text: string ..

HarmonyOS NEXT
138
0
2025-06-27 22:44:22

鸿蒙Next MVVM模式使用

MVVM模式介绍 在应用开发中,UI的更新需要随着数据状态的变化进行实时同步,而这种同步往往决定了应用程序的性能和用户体验。为了解决数据与UI同步的复杂性,ArkUI采用了 Model-View-ViewModel(MVVM)架构模式。MVVM 将应用分为Model、View和ViewModel三个核心部分,实现数据、视图与逻辑的分离。通过这种模式,UI可以..

HarmonyOS NEXT
137
0
2025-06-27 22:44:03

鸿蒙Next组件导航 (Navigation)

组件导航(Navigation) 主要用于实现页面间以及组件内部的页面跳转,支持在不同组件间传递跳转参数,提供灵活的跳转栈操作,从而更便捷地实现对不同页面的访问和复用。页面路由 (@ohos.router)(不推荐) 项目配置步骤: 1.在entry项目目录resourses/base/profile下新建一个json文件:route_map.json 2...

HarmonyOS NEXT
131
0
2025-06-27 22:43:16

鸿蒙Next气泡提示(Popup)的使用

本文介绍自定义的气泡CustomPopupOptions的使用,设置弹出框内容,弹出框位置,是否为模态窗口,默认小箭头的设置,简单动画,看效果: [图片] @Entry @ComponentV2 struct test{ @Local customPopup: boolean = false @Builder viewToolView(){ Row({sp..

HarmonyOS NEXT
139
0
2025-06-27 22:42:48

鸿蒙Next Text内容超出父容器?

当我们在布局中使用Text展示文本内容时,如果父布局是固定宽高,当Text展示的内容过长并且没有限制时,会超出父容器,这点和安卓中是不一样的,安卓中会自动截取超出部分。 因此我们在开发过程中,如果Text内容长度不固定,我们要提前设置好边界,以防内容超出。 以下是展示及解决办法: [图片] @Entry @Component struct test{ bui..

HarmonyOS NEXT
129
0
2025-06-27 22:42:29

鸿蒙Next异步并发 (Promise和async/await)

异步和多线程有啥区别? 原理 异步开发:异步编程以非阻塞的方式运行代码,当程序发起一个可能耗时的操作(如网络请求、文件读写)时,不会等待该操作完成,而是继续执行后续代码。待操作完成后,通过回调函数、Promise、async/await 等机制来处理结果。 多线程开发:多线程是指在一个程序中同时运行多个线程。这些线程可以并行执行不同的任务,共享进程的资源。 ..

HarmonyOS NEXT
131
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
129
0
2025-06-27 22:41:53

鸿蒙Next 底部弹框绑定半模态页面(bindSheet)

半模态页面(bindSheet)默认是模态形式的非全屏弹窗式交互页面,允许部分底层父视图可见,帮助用户在与半模态交互时保留其父视图环境。 [图片] 如果sheet布局是个list可滑动布局,需要先了解一下嵌套滚动 NestedScrollMode SELF_ONLY 只自身滚动,不与父组件联动。 SELF_FIRST 自身先滚动,自身滚动到边缘以后父组件滚动..

HarmonyOS NEXT
133
0
2025-06-27 22:41:37

鸿蒙Next 线性布局 (Row/Column)

Column 子元素按直方向排列 Row 子元素按水平方向排列 基本概念 主轴:Row容器主轴为水平方向,Column容器主轴为垂直方向。 交叉轴:垂直于主轴方向的轴线。Row容器交叉轴为垂直方向,Column容器交叉轴为水平方向。 当不指定宽高时,自身默认宽高由子组件决定,这时设置排列方向是看不到效果的。 Column交叉轴方向即横向,只有3个参数Hori..

HarmonyOS NEXT
126
0
2025-06-27 22:41:03

鸿蒙Next Dialog弹框

弹窗的种类 模态弹窗: 为强交互形式,会中断用户当前的操作流程 非模态弹窗: 为弱交互形式,不会影响用户当前操作行为 本文主要记录一下 Toast弹窗 自定义弹出框 (CustomDialog):使用上存在诸多限制,不支持动态创建也不支持动态刷新 全局自定义弹出框 (openCustomDialog) [图片] **显示一个Toat,调用promptActi..

HarmonyOS NEXT
141
0
2025-06-27 22:39:45

鸿蒙Next 组件样式封装

封装!封装!封装! 不会封装的Coder不是一个好CV大师 当我们的布局中有比较多的重复样式需要设置时,会增加很多相同类似的代码,增加维护成本,组件的抽离和复用是非常重要的,记下来举个例子。 [图片] 如果实现上面一个用户中心的卡片列表,先举一个反面例子 @Entry @ComponentV2 struct User{ build() { Column(){..

HarmonyOS NEXT
131
0
2025-06-27 22:39:14

鸿蒙Next嵌套组件点击事件传递

嵌套事件传递默认的是,当父view和子view都有点击事件时,点击子组件默认响应的是子组件的点击方法,鸿蒙提供了四种传递模式可以设置,如下: [图片] @Entry @ComponentV2 struct test3{ @Local message1:string='' @Local message2:string='' @Local message3:st..

HarmonyOS NEXT
131
0
2025-06-27 22:38:48

鸿蒙Next状态管理装饰器V2 @Provider @Consumer

@Provider和@Consumer用于跨组件层级数据双向同步,可以使得开发者不用拘泥于组件层级 [图片] [图片] @Entry @ComponentV2 struct test3{ @Provider() message:string='Hello World' @Provider('msg') once_message:string='Hello W..

HarmonyOS NEXT
131
0
2025-06-27 22:38:27

鸿蒙Next状态管理装饰器V2 @Param@Once@Event

本文补充记录一下V2装饰器 @Param 组件外部输入 @Once初始化同步一次 @Event 规范组件回调 [图片] @Param表示组件从外部传入的状态,使得父子组件之间的数据能够进行同步: @Param装饰的变量支持本地初始化,但是不允许在组件内部直接修改变量本身。 被@Param装饰的变量能够在初始化自定义组件时从外部传入,当数据源也是状态变量时,数..

HarmonyOS NEXT
135
0
2025-06-27 22:37:45

鸿蒙Next状态管理装饰器V2 @ObservedV2@Trace@Local

本文先记录@ObservedV2装饰器 @Trace装饰器 @Local装饰器 当我们的数据结构有嵌套对象时,当只有嵌套对象属性发生变化,这时不能触发View刷新,看一下效果图和代码: [图片] @Observed class Child{ name:string='child' } @Observed class Father{ name:string='..

HarmonyOS NEXT
131
0
2025-06-27 22:37:14

鸿蒙Next组件状态管理装饰器V1

使用装饰器实现数据变化,view自动响应变化 常用的搭配有四种 State :修饰的变量实现组件内的动态响应 父State+子PropLink:父子数据单向同步,父组件数据变化,父子组件都可以接收响应,子组件修改数据,父组件不会收到 父State+子Link:父子数据双向同步,父子组件的数据任何一个发生变化,view都会响应变化 父Provide+子Cons..

HarmonyOS NEXT
131
0
2025-06-27 22:36:51

HarmonyOS Next Refresh+List实现下拉刷新上拉加载

记录实现Refresh+List常用组件搭配 实现List刷新和加载更多功能 实现自定义刷新头和加载更多样式 实现左滑右滑展示更多操作按键功能 [图片] @Component export struct ListMessage { @State isRefreshing: boolean = false @State datas: number[] = [0..

HarmonyOS NEXT
138
0
2025-06-27 22:36:26

HarmonyOS Next Tabs组件使用

Tabs可以搭配TabContent使用也可以搭配Swiper使用,本文介绍和Swiper搭配使用 [图片] @Component export struct Colleague{ @State fontColor: string = '#182431' @State selectedFontColor: string = '#007DFF' @State ..

HarmonyOS NEXT
132
0
2025-06-27 22:36:07

HarmonyOS Next 自定义组件@Component的生命周期

[图片] @Entry @Component struct Index { @State message: string = 'Hello World'; //组件即将出现时回调该接口,具体时机为在创建自定义组件的新实例后,在执行其build()函数之前执行 aboutToAppear(): void { console.log('=========','a..

HarmonyOS NEXT
140
0
2025-06-27 22:35:36

HarmonyOS Next常用组件 TextInput

InputType枚举说明 Normal基本输入模式,无特殊限制 Password密码输入模式。密码显示小眼睛图标,默认输入文字短暂显示后变成圆点 Email邮箱地址输入模式。支持数字、字母、下划线、小数点、!、#、$、%、&、'、"、*、+、-、/、=、?、^、`、{、 |、}、~,以及@字符(只能存在一个@字符) Number纯数字输入模式 Ph..

HarmonyOS NEXT
131
0
2025-06-27 22:02:09

鸿蒙粒子动画(Particle)开发指南【1】

第一篇:粒子动画基础概念与核心原理 概述 粒子动画是现代移动应用开发中一种极具视觉冲击力的动效技术,它通过在一定范围内随机生成大量粒子并让这些粒子产生运动来组成动画效果。在鸿蒙操作系统中,粒子动画通过Particle组件来实现,为开发者提供了强大而灵活的动效创建能力。粒子动画的核心思想是将复杂的视觉效果分解为众多简单的粒子元素,每个粒子都可以独立地在颜色、透..

HarmonyOS NEXT
131
0
2025-06-27 20:53:04

鸿蒙RichEditor富文本编辑器开发指南【2】

第二篇:RichEditor高级功能与实践应用 高级功能详解 RichEditor组件不仅提供了基础的富文本编辑功能,还具备许多高级特性,这些功能使得开发者能够构建出功能强大、用户体验优秀的富文本编辑应用。这些高级功能包括自定义工具栏、内容导入导出、协同编辑支持、插件扩展机制等。 自定义工具栏系统:RichEditor允许开发者创建完全自定义的工具栏,可以根..

HarmonyOS NEXT
147
0
2025-06-27 20:33:47

鸿蒙RichEditor富文本编辑器开发指南【1】

第一篇:RichEditor组件基础介绍 概述 RichEditor是鸿蒙操作系统提供的强大富文本编辑组件,它为开发者提供了完整的富文本编辑解决方案。该组件不仅支持基础的文本输入和编辑功能,还具备丰富的格式化能力,包括字体样式设置、颜色调整、段落格式化、图片插入等高级功能。RichEditor的设计理念是为用户提供类似于专业文档编辑软件的编辑体验,同时保持移..

HarmonyOS NEXT
129
0