介绍 本示例介绍使用Scroll组件的滚动事件 onScroll 实现状态栏显隐变化。该场景多用于各种软件的首页、我的等页面中。 效果预览图 使用说明 加载完成后显示状态栏显隐变化页面，上下拖动屏幕，顶端状态栏出现显隐变化。 实现思路 在置顶位置使用stack组件添加两层状态栏。 源码参考Navig ...阅读全文

介绍 本示例介绍通过CustomDialogController类显示自定义日历选择器。 效果图预览 使用说明 加载完成后显示主界面，点当前日期后会弹出日历选择器，选择日期后会关闭弹窗，主页面日期会变成选定的日期。 实现思路 获取当前月和下个月的日期信息。源码参考GetDate.ets。 const ...阅读全文

介绍 本示例介绍使用vibrator.startVibration方法实现手机振动效果，用animateTo显示动画实现点击后的抖动动画。 效果图预览 使用说明 加载完成后显示登录界面，未勾选协议时点击一键登录按钮会触发手机振动效果和提示文本的抖动动画。 实现思路 创建一个函数startVibrat ...阅读全文

前言 弹簧曲线动画是一种模拟弹簧运动的动画效果，通过改变弹簧的拉伸或压缩来表现不同的运动状态。以下是制作弹簧曲线动画的步骤： 创建一个弹簧的模型，可以使用圆形或者曲线来代表弹簧的形状。 将弹簧固定在一个点上，这个点可以是屏幕中心或其他位置。 定义一个目标位置，弹簧将会朝向这个位置进行拉伸或压缩。 ...阅读全文

介绍 在ArkTS中调用相机拍照和录像，以及如何使用媒体库接口进行媒体文件的增、删、改、查操作。本示例用到了 权限管理能力 相机模块能力接口 图片处理接口 音视频相关媒体业务能力接口 媒体库管理接口 设备信息能力接口 文件存储管理能力接口 弹窗能力接口 效果预览 使用说明 1.启动应用，在权限弹窗中 ...阅读全文

介绍 本示例介绍如何使用Text组件实现验证码场景，并禁用对内容的选中、复制、光标。 效果图预览 使用说明 单击组件可弹出输入法 在进行验证码输入时，无法对中间单个数字进行更改，无法选中输入内容，无光标 实现思路 因为要禁用复制、选中等功能，这里使用了Text组件，而不是TextInput ForE ...阅读全文

介绍 本示例通过模拟下载场景介绍如何将Native的进度信息实时同步到ArkTS侧。 效果图预览 使用说明 点击“Start Download“按钮后，Native侧启动子线程模拟下载任务 Native侧启动子线程模拟下载，并通过Arkts的回调函数将进度信息实时传递到Arkts侧 实现思路 前端进 ...阅读全文

前言 转场动画是一种在电影、视频和演示文稿中使用的动画效果，用于平滑地切换不同的场景或幻灯片。转场动画可以增加视觉吸引力，改善观众的观看体验。 常见的转场动画包括淡入淡出、滑动、旋转、放大缩小等效果。这些动画效果可以在场景之间创建无缝的过渡，使观众感到自然流畅。 在电影中，转场动画通常用于切换不 ...阅读全文

介绍 翻页动效是应用开发中常见的动效场景，常见的有书籍翻页，日历翻页等。本例将介绍如何通过ArkUI提供的显示动画接口animateTo实现翻页的效果。 效果图预览 使用说明 本例通过setInterval函数每秒调用一次翻页动画，实现连续翻页效果。 实现思路 如图，左右两侧分别代表打开书籍的左右两 ...阅读全文

介绍 本示例介绍使用第三方库的PullToRefresh组件实现列表的下拉刷新数据和上滑加载后续数据。 效果图预览 使用说明 进入页面，下拉列表触发刷新数据事件，等待数据刷新完成。 上滑列表到底部，触发加载更多数据事件，等待数据加载完成。 实现思路 使用第三方库pullToRefresh组件，将列表 ...阅读全文

介绍 本示例介绍了文本宽度过宽时，如何实现文本首尾相接循环滚动并显示在可视区，以及每循环滚动一次之后会停滞一段时间后再滚动。 效果图预览 使用说明： 1.进入页面，检票口文本处，实现文本首尾相接循环滚动，且在同一可视区，滚动完成之后，停滞一段时间后继续滚动。 实现思路 由于ArkUI中的Marque ...阅读全文

介绍 本示例介绍在开发应用以适应深色模式时，对于深色和浅色模式的适配方案，采取了多种策略如下： 固定属性适配：对于部分组件的颜色属性，如背景色或字体颜色，若保持不变，可直接设定固定色值或引用固定的资源文件。 双资源目录适配：在resources目录下新增dark子目录，用于存放深色模式下的特定颜色配 ...阅读全文

介绍 本示例介绍了通过应用事件打点hiAppEvent获取上一次应用异常信息的方法，主要分为应用崩溃、应用卡死以及系统查杀三种。 效果图预览 使用说明： 点击构建应用崩溃事件，3s之后应用退出，然后打开应用进入应用异常页面，隔1min左右后，显示上次异常退出信息。 点击构建应用卡死事件，需手动退出， ...阅读全文

TypeScript 与 JavaScript 类似，支持 Number 对象。 Number 对象是原始数值的包装对象。 语法 var num = new Number(value); 注意： 如果一个参数值不能转换为一个数字将返回 NaN (非数字值)。 Number 对象属性 下表列出了 Nu ...阅读全文

前言 动画是一种通过连续展示一系列静止的图像（称为帧）来创造出运动效果的艺术形式。它可以以手绘、计算机生成或其他各种形式呈现。在动画中，每一帧都具有微小的变化，当这些帧被快速播放时，人眼会产生视觉上的错觉，认为物体在运动。动画可以用来表达故事、观念、想法、情感或其他形式的艺术创作。它在电影、电视 ...阅读全文

介绍 针对JS与C/C++跨语言访问场景，NAPI使用比较繁琐。而AKI提供了极简语法糖使用方式，一行代码完成JS与C/C++的无障碍跨语言互调，使用方便。本示例将介绍使用AKI编写C++跨线程调用JS函数场景。通过调用C++全局函数，创建子线程来调用JS函数，实现对变量value的加10操作，为开 ...阅读全文

一、Canvas Canvas组件是一种图形渲染组件，它提供了一个画布（canvas），开发者可以在上面绘制各种图形、文本等。Canvas组件通常用于创建游戏、数据可视化等需要动态绘制图形的应用程序。 Canvas组件提供了多个API，开发者可以使用这些API进行绘制操作。常用的API包括绘制矩 ...阅读全文

函数是一组一起执行一个任务的语句。 您可以把代码划分到不同的函数中。如何划分代码到不同的函数中是由您来决定的，但在逻辑上，划分通常是根据每个函数执行一个特定的任务来进行的。 函数声明告诉编译器函数的名称、返回类型和参数。函数定义提供了函数的实际主体。 函数定义 函数就是包裹在花括号中的代码块，前面使 ...阅读全文

介绍 本示例介绍使用了Tab组件实现自定义增删Tab页签的功能。该场景多用于浏览器等场景。 效果图预览 使用说明： 点击新增按钮，新增Tab页面。 点击删除按钮，删除Tab页面。 实现思路 设置Tab组件的barHeight为0，隐藏组件自带的TabBar。 Tabs() { ... } .barH ...阅读全文

介绍 本示例介绍使用第三方库的Axios获取GBK格式的网络数据时，通过util实现GBK转换UTF-8格式。该场景多用于需要转换编码格式的应用。 效果图预览 使用说明 直接进入页面就可获取GBK格式的用户名信息并进行解码操作。 实现思路 使用第三方库Axios获取网络数据，并将获取数据类型设置为A ...阅读全文