diff --git a/code/DocsSample/ArkUISample/Animation/.gitignore b/code/DocsSample/ArkUISample/Animation/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..d2ff20141ceed86d87c0ea5d99481973005bab2b --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/.gitignore @@ -0,0 +1,12 @@ +/node_modules +/oh_modules +/local.properties +/.idea +**/build +/.hvigor +.cxx +/.clangd +/.clang-format +/.clang-tidy +**/.test +/.appanalyzer \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/AppScope/app.json5 b/code/DocsSample/ArkUISample/Animation/AppScope/app.json5 new file mode 100644 index 0000000000000000000000000000000000000000..1e01400f30809cb5d43a42816db5eaf8d22ca7b6 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/AppScope/app.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "bundleName": "com.samples.animation", + "vendor": "example", + "versionCode": 1000000, + "versionName": "1.0.0", + "icon": "$media:layered_image", + "label": "$string:app_name" + } +} diff --git a/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/element/string.json b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..b86e4d568762b2d514c1bf734000d12e6a04e9d1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/element/string.json @@ -0,0 +1,8 @@ +{ + "string": [ + { + "name": "app_name", + "value": "animation" + } + ] +} diff --git a/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/background.png b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/AppScope/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/README_zh.md b/code/DocsSample/ArkUISample/Animation/README_zh.md new file mode 100644 index 0000000000000000000000000000000000000000..34235df004e369b2c7f0f65997dc16fd9354bd08 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/README_zh.md @@ -0,0 +1,165 @@ +# ArkUI使用动效组件指南文档示例 + +### 介绍 + +本示例通过使用[ArkUI指南文档](https://gitee.com/openharmony/docs/tree/master/zh-cn/application-dev/ui)中各场景的开发示例，展示在工程中，帮助开发者更好地理解ArkUI提供的组件及组件属性并合理使用。该工程中展示的代码详细描述可查如下链接： + +1. [显示动画（animateTo）](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-explicit-animation.md)。 +2. [属性动画（animation）](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-animatorproperty.md)。 +3. [动画衔接](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-animation-smoothing.md)。 +4. [关键帧动画](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-keyframeAnimateTo.md)。 +5. [页面间转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-page-transition-animation.md)。 +6. [组件内转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-transition-animation-component.md)。 +7. [共享元素转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-transition-animation-shared-elements.md)。 +8. [路径动画](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-motion-path-animation.md)。 +9. [粒子动画](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-particle-animation.md)。 +10. [帧动画](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-animator.md)。 +11. [显式动画立即下发](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-explicit-animatetoimmediately.md)。 +12. [旋转屏动画](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-rotation-transition-animation.md)。 + + +### 效果预览 + +| 首页 | +|------------------------------------| +| ![](screenshots/device/image1.png) | + +### 使用说明 + +1. 在主界面，可以点击对应卡片，选择需要参考的组件示例。 + +2. 在组件目录选择详细的示例参考。 + +3. 进入示例界面，查看参考示例。 + +4. 通过自动测试框架可进行测试及维护。 + +### 工程目录 +``` +entry/src/main/ets/ +|---entryability +|---pages +| |---animateTo // 显示动画（animateTo） +| | |---template1 +| | | |---Index.ets // 示例1（在组件出现时创建动画） +| | |---template2 +| | | |---Index.ets // 示例2（动画执行结束后组件消失） +| | |---template3 +| | | |---Index.ets // 示例3（在状态管理V2中使用animateTo） +| |---animateToImmediately // 显式动画立即下发 +| | |---template1 +| | | |---Index.ets +| |---animation // 属性动画（animation） +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets // 示例2（使用animateTo产生属性动画） +| | |---template3 +| | | |---Index.ets // 示例3（使用animation产生属性动画） +| | |---template4 +| | | |---Index.ets // 示例4（使用keyframeAnimateTo产生属性动画） +| |---animator // 帧动画 +| | |---template1 // 示例1（基于ArkTS扩展的声明式开发范式） +| | | |---Index.ets +| | |---template2 // 示例2（位移动画示例） +| | | |---Index.ets +| | |---template3 // 示例3（使用帧动画实现小球抛物运动） +| | | |---Index.ets +| |---cohesion // 动画衔接 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| |---compTransition // 组件内转场 +| | |---template1 +| | | |---Index.ets // 示例1（使用同一接口实现图片出现消失） +| | |---template2 +| | | |---Index.ets // 示例2（使用不同接口实现图片出现消失） +| | |---template3 +| | | |---Index.ets // 示例3（设置父子组件为transition） +| | |---template4 +| | | |---Index.ets // 示例4（出现/消失转场） +| | |---template5 +| | | |---Index.ets // 示例5（多个组件渐次出现消失） +| |---keyframeAnimateTo // 关键帧动画 +| | |---template1 +| | | |---Index.ets +| |---motionPath // 路径动画 +| | |---template1 +| | | |---Index.ets +| |---pageTransition // 页面间转场 +| | |---template1 +| | | |---Index.ets // 示例1（设置退入场动画） +| | |---template2 +| | | |---Index.ets // 示例2（设置退入场平移效果） +| | |---template3 +| | | |---Index.ets // 示例3（不推荐)（利用pushUrl跳转能力） +| | |---template4 +| | | |---Index.ets // 示例4（不推荐)（type为None的页面转场） +| |---particle // 粒子动画 +| | |---template1 +| | | |---Index.ets // 示例1（圆形初始化粒子） +| | |---template2 +| | | |---Index.ets // 示例2（图片初始化粒子） +| | |---template3 +| | | |---Index.ets // 示例3（粒子扰动场的干扰下运动轨迹发生变化） +| | |---template4 +| | | |---Index.ets // 示例4（调整粒子发射器位置） +| | |---template5 +| | | |---Index.ets // 示例5（环形发射器创建） +| | |---template6 +| | | |---Index.ets // 示例6（环形发射器更新） +| |---rotation // 旋转屏动画 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| |---shareTransition // 共享元素转场 +| | |---template1 +| | | |---Index.ets +|---pages +| |---Index.ets // 应用主页面 +entry/src/ohosTest/ +|---ets +| |---test +| | |---AnimateTo.test.ets // 显示动画（animateTo）示例代码测试代码 +| | |---AnimateToImmediately.test.ets // 显式动画立即下发示例代码测试代码 +| | |---Animation.test.ets // 属性动画（animation）示例代码测试代码 +| | |---Animator.test.ets // 帧动画示例代码测试代码 +| | |---Cohesion.test.ets // 动画衔接示例代码测试代码 +| | |---ComponentTransition.test.ets // 组件内转场示例代码测试代码 +| | |---KeyFrameAnimateTo.test.ets // 关键帧动画示例代码测试代码 +| | |---MotionPath.test.ets // 路径动画示例代码测试代码 +| | |---PageTransition.test.ets // 页面间转场示例代码测试代码 +| | |---Particle.test.ets // 粒子动画示例代码测试代码 +| | |---Rotation.test.ets // 旋转屏动画示例代码测试代码 +| | |---ShareTransition.test.ets // 共享元素转场示例代码测试代码 +``` + +### 相关权限 + +不涉及。 + +### 依赖 + +不涉及。 + +### 约束与限制 + +1.本示例仅支持标准系统上运行, 支持设备：RK3568。 + +2.本示例为Stage模型，支持API20版本SDK，版本号：6.0.0.33，镜像版本号：OpenHarmony_6.0.0.33。 + +3.本示例需要使用DevEco Studio 6.0.0 Canary1 (Build Version: 6.0.0.270， built on May 9, 2025)及以上版本才可编译运行。 + +### 下载 + +如需单独下载本工程，执行如下命令： + +```` +git init +git config core.sparsecheckout true +echo code/DocsSample/ArkUIDocSample/Animation > .git/info/sparse-checkout +git remote add origin https://gitee.com/openharmony/applications_app_samples.git +git pull origin master +```` \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/build-profile.json5 b/code/DocsSample/ArkUISample/Animation/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..e1244ceecbe969910aa0eb4f5ec4543c58ee4225 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/build-profile.json5 @@ -0,0 +1,56 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "signingConfigs": [], + "products": [ + { + "name": "default", + "signingConfig": "default", + "targetSdkVersion": "20", + "compatibleSdkVersion": "20", + "runtimeOS": "OpenHarmony", + "buildOption": { + "strictMode": { + "caseSensitiveCheck": true, + "useNormalizedOHMUrl": true + } + } + } + ], + "buildModeSet": [ + { + "name": "debug", + }, + { + "name": "release" + } + ] + }, + "modules": [ + { + "name": "entry", + "srcPath": "./entry", + "targets": [ + { + "name": "default", + "applyToProducts": [ + "default" + ] + } + ] + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/code-linter.json5 b/code/DocsSample/ArkUISample/Animation/code-linter.json5 new file mode 100644 index 0000000000000000000000000000000000000000..5c4682f8164874ec7e9cb8f99ff8b3228ffbc126 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/code-linter.json5 @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "files": [ + "**/*.ets" + ], + "ignore": [ + "**/src/ohosTest/**/*", + "**/src/test/**/*", + "**/src/mock/**/*", + "**/node_modules/**/*", + "**/oh_modules/**/*", + "**/build/**/*", + "**/.preview/**/*" + ], + "ruleSet": [ + "plugin:@performance/recommended", + "plugin:@typescript-eslint/recommended" + ], + "rules": { + "@security/no-unsafe-aes": "error", + "@security/no-unsafe-hash": "error", + "@security/no-unsafe-mac": "warn", + "@security/no-unsafe-dh": "error", + "@security/no-unsafe-dsa": "error", + "@security/no-unsafe-ecdsa": "error", + "@security/no-unsafe-rsa-encrypt": "error", + "@security/no-unsafe-rsa-sign": "error", + "@security/no-unsafe-rsa-key": "error", + "@security/no-unsafe-dsa-key": "error", + "@security/no-unsafe-dh-key": "error", + "@security/no-unsafe-3des": "error" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/.gitignore b/code/DocsSample/ArkUISample/Animation/entry/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..e2713a2779c5a3e0eb879efe6115455592caeea5 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/.gitignore @@ -0,0 +1,6 @@ +/node_modules +/oh_modules +/.preview +/build +/.cxx +/.test \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/build-profile.json5 b/code/DocsSample/ArkUISample/Animation/entry/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..982dbb524bd63408e05cfbed7204dd87a31dd681 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/build-profile.json5 @@ -0,0 +1,42 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "apiType": "stageMode", + "buildOption": { + }, + "buildOptionSet": [ + { + "name": "release", + "arkOptions": { + "obfuscation": { + "ruleOptions": { + "enable": false, + "files": [ + "./obfuscation-rules.txt" + ] + } + } + } + }, + ], + "targets": [ + { + "name": "default" + }, + { + "name": "ohosTest", + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/hvigorfile.ts b/code/DocsSample/ArkUISample/Animation/entry/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..8774588471ede4c1563f09d9a1d22f764bb1fd9e --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hapTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/Animation/entry/obfuscation-rules.txt b/code/DocsSample/ArkUISample/Animation/entry/obfuscation-rules.txt new file mode 100644 index 0000000000000000000000000000000000000000..272efb6ca3f240859091bbbfc7c5802d52793b0b --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/obfuscation-rules.txt @@ -0,0 +1,23 @@ +# Define project specific obfuscation rules here. +# You can include the obfuscation configuration files in the current module's build-profile.json5. +# +# For more details, see +# https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/source-obfuscation-V5 + +# Obfuscation options: +# -disable-obfuscation: disable all obfuscations +# -enable-property-obfuscation: obfuscate the property names +# -enable-toplevel-obfuscation: obfuscate the names in the global scope +# -compact: remove unnecessary blank spaces and all line feeds +# -remove-log: remove all console.* statements +# -print-namecache: print the name cache that contains the mapping from the old names to new names +# -apply-namecache: reuse the given cache file + +# Keep options: +# -keep-property-name: specifies property names that you want to keep +# -keep-global-name: specifies names that you want to keep in the global scope + +-enable-property-obfuscation +-enable-toplevel-obfuscation +-enable-filename-obfuscation +-enable-export-obfuscation \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/oh-package.json5 b/code/DocsSample/ArkUISample/Animation/entry/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..10cda399b0aec3099b257299a57d284393e4e55a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "name": "entry", + "version": "1.0.0", + "description": "Please describe the basic information.", + "main": "", + "author": "", + "license": "", + "dependencies": {} +} + diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/common/resource.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/common/resource.ets new file mode 100644 index 0000000000000000000000000000000000000000..723a394265ee2e6bf6d895e9503c4b2d8e49207a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/common/resource.ets @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export class P2PManager { + public resourceToString(resource: Resource): string { + return getContext(this).resourceManager.getStringSync(resource); + } +} + +// 默认导出let +let p2pManager = new P2PManager(); + +export default p2pManager as P2PManager; \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entryability/EntryAbility.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entryability/EntryAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..081b700cacec6def24d204fbc37ab93985f7b4ec --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entryability/EntryAbility.ets @@ -0,0 +1,95 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AbilityConstant, ConfigurationConstant, UIAbility, Want } from '@kit.AbilityKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { display, uiObserver, window } from '@kit.ArkUI'; + +const DOMAIN = 0x0000; + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +function callBackFunc2(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag2 navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +export default class EntryAbility extends UIAbility { + onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { + this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onCreate'); + uiObserver.on('navDestinationSwitch', this.context, callBackFunc); + uiObserver.on('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc2); + } + + onDestroy(): void { + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onDestroy'); + uiObserver.off('navDestinationSwitch', this.context, callBackFunc); + uiObserver.off('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc); + } + + onWindowStageCreate(windowStage: window.WindowStage): void { + // Main window is created, set main page for this ability + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); + let mainWindow: window.Window; + try { + mainWindow = windowStage.getMainWindowSync(); + let displayClass: display.Display = display.getDefaultDisplaySync(); + AppStorage.setOrCreate('orientation', displayClass.orientation); + // 监听窗口的windowsSizeChange事件，旋转屏时会触发该事件 + mainWindow.on('windowSizeChange', (data) => { + console.info('Succeeded in enabling the listener for window size changes. Data: ' + JSON.stringify(data)); + let displayClass: display.Display | null = null; + try { + displayClass = display.getDefaultDisplaySync(); + console.info('display orientation is ' + JSON.stringify(displayClass.orientation)); + // 获取屏幕的显示方向 + AppStorage.set('orientation', displayClass.orientation); + } catch { + return; + } + }) + } catch { + hilog.info(0x0000, 'testTag', '%{public}s', 'error'); + return; + } + windowStage.loadContent('pages/Index', (err) => { + if (err.code) { + hilog.error(DOMAIN, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err)); + return; + } + hilog.info(DOMAIN, 'testTag', 'Succeeded in loading the content.'); + }); + } + + onWindowStageDestroy(): void { + // Main window is destroyed, release UI related resources + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); + } + + onForeground(): void { + // Ability has brought to foreground + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onForeground'); + } + + onBackground(): void { + // Ability has back to background + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onBackground'); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..4ce6449f0e91914e73d4502c9f2e8e9a395ea4b1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets @@ -0,0 +1,30 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { BackupExtensionAbility, BundleVersion } from '@kit.CoreFileKit'; + +const DOMAIN = 0x0000; + +export default class EntryBackupAbility extends BackupExtensionAbility { + async onBackup() { + hilog.info(DOMAIN, 'testTag', 'onBackup ok'); + await Promise.resolve(); + } + + async onRestore(bundleVersion: BundleVersion) { + hilog.info(DOMAIN, 'testTag', 'onRestore ok %{public}s', JSON.stringify(bundleVersion)); + await Promise.resolve(); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..95665e92fe385e0b9c308e320101d63fd1eedabb --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/Index.ets @@ -0,0 +1,237 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import curves from '@ohos.curves'; +import { Route, RouteGroup } from './common/Index'; +import { KeyboardAvoidMode } from '@kit.ArkUI'; +import router from '@ohos.router'; + +@Styles +function cardPressedStyle() { + .backgroundColor('rgba(0,0,0,0.1)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardNormalStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardDisabledStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(0.5) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + + +@Entry +@Component +struct AnimateIndex { + @Provide('router') router: NavPathStack = new NavPathStack(); + @State routes: RouteGroup[] = [ + { + name: "animateTo", + label: $r('app.string.animate_to_label'), + children: [ + { name: 'template1/Index', label: $r('app.string.animate_to_temp_label1') }, + { name: 'template2/Index', label: $r('app.string.animate_to_temp_label2') }, + { name: 'template3/Index', label: $r('app.string.animate_to_temp_label3') } + ] + },{ + name: "animation", + label: $r("app.string.animation_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.temp1") }, + { name: 'template2/Index', label: $r("app.string.animation_temp_label2") }, + { name: 'template3/Index', label: $r("app.string.animation_temp_label3") }, + { name: 'template4/Index', label: $r("app.string.animation_temp_label4") } + ] + }, { + name: "cohesion", + label: $r("app.string.cohesion_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.cohesion_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.cohesion_temp_label2") } + ] + }, { + name: "keyframeAnimateTo", + label: $r("app.string.keyframeAnimateTo_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.temp1") } + ] + }, { + name: "pageTransition", + label: $r("app.string.pageTransition_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.pageTransition_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.pageTransition_temp_label2") }, + { name: 'template3/pageTransitionSrc1', label: $r("app.string.pageTransition_temp_label3") }, + { name: 'template4/pageTransitionSrc2', label: $r("app.string.pageTransition_temp_label4") } + ] + }, { + name: "compTransition", + label: $r("app.string.compTransition_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.compTransition_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.compTransition_temp_label2") }, + { name: 'template3/Index', label: $r("app.string.compTransition_temp_label3") }, + { name: 'template4/Index', label: $r("app.string.compTransition_temp_label4") }, + { name: 'template5/Index', label: $r("app.string.compTransition_temp_label5") } + ] + }, { + name: "shareTransition", + label: $r("app.string.shareTransition_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.temp1") } + ] + }, { + name: "motionPath", + label: $r("app.string.motionPath_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.temp1") } + ] + }, { + name: "particle", + label: $r("app.string.particle_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.particle_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.particle_temp_label2") }, + { name: 'template3/Index', label: $r("app.string.particle_temp_label3") }, + { name: 'template4/Index', label: $r("app.string.particle_temp_label4") }, + { name: 'template5/Index', label: $r("app.string.particle_temp_label5") }, + { name: 'template6/Index', label: $r("app.string.particle_temp_label6") } + ] + }, { + name: "animator", + label: $r("app.string.animator_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.animator_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.animator_temp_label2") }, + { name: 'template3/Index', label: $r("app.string.animator_temp_label3") } + ] + }, { + name: "animateToImmediately", + label: $r("app.string.animateToImmediately_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.temp1") } + ] + }, { + name: "rotation", + label: $r("app.string.rotation_label"), + children:[ + { name: 'template1/Index', label: $r("app.string.rotation_temp_label1") }, + { name: 'template2/Index', label: $r("app.string.rotation_temp_label2") } + ] + } + ]; + @State selection: string | null = null; + + @Builder + ListItemGroupHeader(route: RouteGroup) { + Row() { + Text(route.label) + .fontColor($r('sys.color.ohos_id_color_text_primary')) + .fontWeight(FontWeight.Medium) + + Blank() + + Text(`${route.children.length}`) + .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .opacity(this.selection === route.name ? 0 : 1) + + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + .rotate({ angle: this.selection === route.name ? 90 : 0 }) + .animation({ curve: curves.interpolatingSpring(0, 1, 228, 30) }) + } + .borderRadius(20) + .width('100%') + .padding(8) + .enabled(!!route.children.length) + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .onClick(() => { + animateTo( + { curve: curves.interpolatingSpring(0, 1, 228, 25) }, + () => { + if (this.selection === route.name) { + this.selection = null; + } else { + this.selection = route.name; + } + }); + }) + } + + aboutToAppear(): void{ + this.getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE); + } + build() { + Column() { + Text("AnimateIndex") + List() { + ForEach(this.routes, (routeGroup: RouteGroup) => { + ListItemGroup({ + header: this.ListItemGroupHeader(routeGroup), + style: ListItemGroupStyle.CARD, + }) { + if (routeGroup.name === this.selection) { + ForEach(routeGroup.children, (route: Route) => { + ListItem() { + Row() { + Text(route.label).fontSize(16) + Blank() + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + } + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .borderRadius(20) + .padding(8) + .transition( + TransitionEffect.OPACITY.animation({ + curve: curves.interpolatingSpring(0, 1, 228, 30) + }) + ) + .width('100%') + .onClick(() => { + const name = `pages/${routeGroup.name}/${route.name}`; + router.pushUrl({url: name}) + }) + } + .width('100%') + }) + } + } + .padding(2) + .divider({ strokeWidth: 0.5 }) + }) + }.padding({bottom: 10}) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..c487840e0060b57cb9a879f83058e8fd7d72fd06 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template1/Index.ets @@ -0,0 +1,83 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct AnimateToExample { + @State widthSize: number = 250; + @State heightSize: number = 100; + @State rotateAngle: number = 0; + private flag: boolean = true; + + build() { + Column() { + Button('change size') + .width(this.widthSize) + .height(this.heightSize) + .margin(30) + .onClick(() => { + if (this.flag) { + // 建议使用this.getUIContext()?.animateTo() + this.getUIContext()?.animateTo({ + duration: 2000, + curve: Curve.EaseOut, + iterations: 3, + playMode: PlayMode.Normal, + onFinish: () => { + console.info('play end'); + } + }, () => { + this.widthSize = 150; + this.heightSize = 60; + }) + } else { + // 建议使用this.getUIContext()?.animateTo() + this.getUIContext()?.animateTo({}, () => { + this.widthSize = 250; + this.heightSize = 100; + }) + } + this.flag = !this.flag; + }) + Button('stop rotating') + .margin(50) + .rotate({ x: 0, y: 0, z: 1, angle: this.rotateAngle }) + .onAppear(() => { + // 组件出现时开始做动画 + // 建议使用this.getUIContext()?.animateTo() + this.getUIContext()?.animateTo({ + duration: 1200, + curve: Curve.Friction, + delay: 500, + iterations: -1, // 设置-1表示动画无限循环 + playMode: PlayMode.Alternate, + expectedFrameRateRange: { + min: 10, + max: 120, + expected: 60, + } + }, () => { + this.rotateAngle = 90; + }) + }) + .onClick(() => { + // 建议使用this.getUIContext()?.animateTo() + this.getUIContext()?.animateTo({ duration: 0 }, () => { + // this.rotateAngle之前为90，在duration为0的动画中修改属性，可以停止该属性之前的动画，按新设置的属性显示 + this.rotateAngle = 0; + }) + }) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ff96a620d84ad792704f5d7453a7228c3c7706f9 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template2/Index.ets @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct AnimateToExample2 { + @State heightSize: number = 100; + @State isShow: boolean= true; + @State count: number= 0; + private isToBottom: boolean = true; // 向下 + + build() { + Column() { + if (this.isShow) { + Column() + .width(200) + .height(this.heightSize) + .backgroundColor('blue') + .onClick(() => { + // 建议使用this.getUIContext()?.animateTo() + this.getUIContext()?.animateTo({ + duration: 2000, + curve: Curve.EaseOut, + iterations: 1, + playMode: PlayMode.Normal, + onFinish: () => { + this.count--; + if (this.count == 0 && !this.isToBottom) { // 组件只有在向下做完动画才会消失 + this.isShow = false; + } + } + }, () => { + this.count++; + if (this.isToBottom) { + this.heightSize = 60; + } else { + this.heightSize = 100; + } + this.isToBottom = !this.isToBottom; + }) + }) + } + }.width('100%').height('100%').margin({ top: 5 }) + .justifyContent(FlexAlign.End) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template3/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..e6041d21080aeaff67b3441021df03899d849fc4 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateTo/template3/Index.ets @@ -0,0 +1,51 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@ComponentV2 +struct AnimateToExample3 { + @Local w: number = 50; // 宽度 + @Local h: number = 50; // 高度 + @Local message: string = 'Hello'; + + build() { + Column() { + Button('change size') + .margin(20) + .onClick(() => { + // 在执行动画前，存在额外的修改 + this.w = 100; + this.h = 100; + this.message = 'Hello Word'; + animateToImmediately({ + duration: 0 + }, () => { + }) + this.getUIContext().animateTo({ + duration: 1000 + }, () => { + this.w = 200; + this.h = 200; + this.message = 'Hello ArkUI'; + }) + }) + Column() { + Text(`${this.message}`) + } + .backgroundColor('#ff17a98d') + .width(this.w) + .height(this.h) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateToImmediately/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateToImmediately/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d32df74972df165757f680aa7ba3d5528c2f86ec --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animateToImmediately/template1/Index.ets @@ -0,0 +1,66 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct AnimateToImmediatelyExample { + @State widthSize: number = 250; + @State heightSize: number = 100; + @State opacitySize: number = 0; + private flag: boolean = true; + + build() { + Column() { + Column() + .width(this.widthSize) + .height(this.heightSize) + .backgroundColor(Color.Green) + .opacity(this.opacitySize) + Button('change size') + .margin(30) + .onClick(() => { + if (this.flag) { + animateToImmediately({ + delay: 0, + duration: 1000 + }, () => { + this.opacitySize = 1; + }) + this.getUIContext()?.animateTo({ + delay: 1000, + duration: 1000 + }, () => { + this.widthSize = 150; + this.heightSize = 60; + }) + } else { + animateToImmediately({ + delay: 0, + duration: 1000 + }, () => { + this.widthSize = 250; + this.heightSize = 100; + }) + this.getUIContext()?.animateTo({ + delay: 1000, + duration: 1000 + }, () => { + this.opacitySize = 0; + }) + } + this.flag = !this.flag; + }) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..9e9fa69304ba32657ed5ab8a6cc67a34139fb51d --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template1/Index.ets @@ -0,0 +1,65 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct AttrAnimationExample { + @State widthSize: number = 250; + @State heightSize: number = 100; + @State rotateAngle: number = 0; + @State flag: boolean = true; + + build() { + Column() { + Button('change size') + .onClick(() => { + if (this.flag) { + this.widthSize = 150 + this.heightSize = 60 + } else { + this.widthSize = 250 + this.heightSize = 100 + } + this.flag = !this.flag + }) + .margin(30) + .width(this.widthSize) + .height(this.heightSize) + .animation({ + duration: 2000, + curve: Curve.EaseOut, + iterations: 3, + playMode: PlayMode.Normal + }) + Button('change rotate angle') + .onClick(() => { + this.rotateAngle = 90 + }) + .margin(50) + .rotate({ angle: this.rotateAngle }) + .animation({ + duration: 1200, + curve: Curve.Friction, + delay: 500, + iterations: -1, // 设置-1表示动画无限循环 + playMode: PlayMode.Alternate, + expectedFrameRateRange: { + min: 20, + max: 120, + expected: 90, + } + }) + }.width('100%').margin({ top: 20 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..aa2721ce7f1711946abd17ced205b3170370c3a8 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template2/Index.ets @@ -0,0 +1,67 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct attrAnimateToDemo2 { + @State animate: boolean = false; + // 第一步: 声明相关状态变量 + @State rotateValue: number = 0; // 组件一旋转角度 + @State translateX: number = 0; // 组件二偏移量 + @State opacityValue: number = 1; // 组件二透明度 + + // 第二步：将状态变量设置到相关可动画属性接口 + build() { + Row() { + // 组件一 + Column() { + } + .rotate({ angle: this.rotateValue }) + .backgroundColor('#317AF7') + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .borderRadius(30) + .onClick(() => { + this.getUIContext()?.animateTo({ curve: curves.springMotion() }, () => { + this.animate = !this.animate; + // 第三步：闭包内通过状态变量改变UI界面 + // 这里可以写任何能改变UI的逻辑比如数组添加，显隐控制，系统会检测改变后的UI界面与之前的UI界面的差异，对有差异的部分添加动画 + // 组件一的rotate属性发生变化，所以会给组件一添加rotate旋转动画 + this.rotateValue = this.animate ? 90 : 0; + // 组件二的透明度发生变化，所以会给组件二添加透明度的动画 + this.opacityValue = this.animate ? 0.6 : 1; + // 组件二的translate属性发生变化，所以会给组件二添加translate偏移动画 + this.translateX = this.animate ? 50 : 0; + }) + }) + + // 组件二 + Column() { + } + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .backgroundColor('#D94838') + .borderRadius(30) + .opacity(this.opacityValue) + .translate({ x: this.translateX }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template3/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..5709dc86b4edfdc1f5dbd63d40d0fc1f659295d8 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template3/Index.ets @@ -0,0 +1,69 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct attrAnimationDemo3 { + @State animate: boolean = false; + // 第一步: 声明相关状态变量 + @State rotateValue: number = 0; // 组件一旋转角度 + @State translateX: number = 0; // 组件二偏移量 + @State opacityValue: number = 1; // 组件二透明度 + + // 第二步：将状态变量设置到相关可动画属性接口 + build() { + Row() { + // 组件一 + Column() { + } + .opacity(this.opacityValue) + .rotate({ angle: this.rotateValue }) + // 第三步：通过属性动画接口开启属性动画 + .animation({ curve: curves.springMotion() }) + .backgroundColor('#317AF7') + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .borderRadius(30) + .onClick(() => { + this.animate = !this.animate; + // 第四步：闭包内通过状态变量改变UI界面 + // 这里可以写任何能改变UI的逻辑比如数组添加，显隐控制，系统会检测改变后的UI界面与之前的UI界面的差异，对有差异的部分添加动画 + // 组件一的rotate属性发生变化，所以会给组件一添加rotate旋转动画 + this.rotateValue = this.animate ? 90 : 0; + // 组件二的translate属性发生变化，所以会给组件二添加translate偏移动画 + this.translateX = this.animate ? 50 : 0; + // 父组件column的opacity属性有变化，会导致其子节点的透明度也变化，所以这里会给column和其子节点的透明度属性都加动画 + this.opacityValue = this.animate ? 0.6 : 1; + }) + + // 组件二 + Column() { + } + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .backgroundColor('#D94838') + .borderRadius(30) + .opacity(this.opacityValue) + .translate({ x: this.translateX }) + .animation({ curve: curves.springMotion() }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template4/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8ffd8960a3cb3d7221b7b11bbd794a847be7a49f --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animation/template4/Index.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct KeyframeAnimateToDemo { + // 第一步: 声明相关状态变量 + @State rotateValue: number = 0; // 组件一旋转角度 + @State translateX: number = 0; // 组件二偏移量 + @State opacityValue: number = 1; // 组件二透明度 + // 第二步：将状态变量设置到相关可动画属性接口 + build() { + Row() { + // 组件一 + Column() { + } + .rotate({ angle: this.rotateValue }) + .backgroundColor('#317AF7') + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .borderRadius(30) + .onClick(() => { + // 第三步：调用keyframeAnimateTo接口 + this.getUIContext()?.keyframeAnimateTo({ + iterations: 1 + }, [ + { + // 第一段关键帧动画时长为800ms，组件一顺时针旋转90度，组件二的透明度变从1变为0.6，组件二的translate从0位移到50 + duration: 800, + event: () => { + this.rotateValue = 90; + this.opacityValue = 0.6; + this.translateX = 50; + } + }, + { + // 第二段关键帧动画时长为500ms，组件一逆时针旋转90度恢复至0度，组件二的透明度变从0.6变为1，组件二的translate从50位移到0 + duration: 500, + event: () => { + this.rotateValue = 0; + this.opacityValue = 1; + this.translateX = 0; + } + } + ]); + }) + // 组件二 + Column() { + } + .justifyContent(FlexAlign.Center) + .width(100) + .height(100) + .backgroundColor('#D94838') + .borderRadius(30) + .opacity(this.opacityValue) + .translate({ x: this.translateX }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..b4650375cfeec49f1b5db75086089cc5d6d0c2ab --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template1/Index.ets @@ -0,0 +1,175 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { Animator as animator, AnimatorResult } from '@kit.ArkUI'; + +@Entry +@Component +struct AnimatorTest { + private TAG: string = '[AnimatorTest]'; + private backAnimator: AnimatorResult | undefined = undefined; + private flag: boolean = false; + @State wid: number = 100; + @State hei: number = 100; + + create() { + this.backAnimator = animator.create({ + // 建议使用 this.getUIContext.createAnimator()接口 + duration: 2000, + easing: "ease", + delay: 0, + fill: "forwards", + direction: 'normal', + iterations: 1, + begin: 100, + end: 200 + }) + this.backAnimator.onFinish = () => { + this.flag = true + console.info(this.TAG, 'backAnimator onFinish') + } + this.backAnimator.onRepeat = () => { + console.info(this.TAG, 'backAnimator repeat') + } + this.backAnimator.onCancel = () => { + console.info(this.TAG, 'backAnimator cancel') + } + this.backAnimator.onFrame = (value: number) => { + this.wid = value + this.hei = value + } + } + + aboutToDisappear() { + // 自定义组件消失时调用finish使未完成的动画结束，避免动画继续运行。 + // 由于backAnimator在onframe中引用了this, this中保存了backAnimator， + // 在自定义组件消失时应该将保存在组件中的backAnimator置空，避免内存泄漏 + this.backAnimator?.finish(); + this.backAnimator = undefined; + } + + build() { + Column() { + Column() { + Column() + .width(this.wid) + .height(this.hei) + .backgroundColor(Color.Red) + } + .width('100%') + .height(300) + + Column() { + Row() { + Button('create') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.create() + }) + } + .padding(10) + + Row() { + Button('play') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.flag = false + if (this.backAnimator) { + this.backAnimator.play() + } + }) + } + .padding(10) + + Row() { + Button('pause') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + if (this.backAnimator) { + this.backAnimator.pause() + } + }) + } + .padding(10) + + Row() { + Button('finish') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.flag = true + if (this.backAnimator) { + this.backAnimator.finish() + } + }) + } + .padding(10) + + Row() { + Button('reverse') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.flag = false + if (this.backAnimator) { + this.backAnimator.reverse() + } + }) + } + .padding(10) + + Row() { + Button('cancel') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + if (this.backAnimator) { + this.backAnimator.cancel() + } + }) + } + .padding(10) + + Row() { + Button('reset') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + if (this.flag) { + this.flag = false + if (this.backAnimator) { + this.backAnimator.reset({ + duration: 3000, + easing: "ease-in", + delay: 0, + fill: "forwards", + direction: "alternate", + iterations: 3, + begin: 100, + end: 300 + }) + } + } else { + console.info(this.TAG, 'Animation not ended') + } + }) + } + .padding(10) + } + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..e2fe7a514330fc64ff8f90c1d61287146178236d --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template2/Index.ets @@ -0,0 +1,106 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AnimatorResult, SimpleAnimatorOptions } from '@kit.ArkUI'; + +@Entry +@Component +struct AnimatorTest { + private TAG: string = '[AnimatorTest]'; + private backAnimator: AnimatorResult | undefined = undefined; + private flag: boolean = false; + @State translate_: number = 0; + + create() { + this.backAnimator = this.getUIContext()?.createAnimator( + new SimpleAnimatorOptions(0, 100) + ) + this.backAnimator.onFinish = ()=> { + this.flag = true + console.info(this.TAG, 'backAnimator onFinish') + } + this.backAnimator.onFrame = (value:number)=> { + this.translate_ = value + } + } + + aboutToDisappear() { + // 由于backAnimator在onFrame中引用了this, this中保存了backAnimator， + // 在自定义组件消失时应该将保存在组件中的backAnimator置空，避免内存泄漏 + this.backAnimator = undefined; + } + + build() { + Column() { + Column() { + Column() + .width(100) + .height(100) + .translate({x: this.translate_}) + .backgroundColor(Color.Green) + } + .width('100%') + .height(300) + + Column() { + Column() { + Button('create') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.create() + }) + } + .padding(10) + + Column() { + Button('play') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + this.flag = false + if(this.backAnimator){ + this.backAnimator.play() + } + }) + } + .padding(10) + + Column() { + Button('reset') + .fontSize(30) + .fontColor(Color.Black) + .onClick(() => { + if (this.flag) { + this.flag = false + if(this.backAnimator){ + this.backAnimator.reset( + new SimpleAnimatorOptions(0, -100) + .duration(2000) + .easing("ease-in") + .fill(FillMode.Forwards) + .direction(PlayMode.Alternate) + .iterations(2) + ) + } + } else { + console.info(this.TAG, 'Animation not ended') + } + }) + } + .padding(10) + } + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template3/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..7828bbb49678c43375d785d5fd44d32493c6441e --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/animator/template3/Index.ets @@ -0,0 +1,94 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AnimatorOptions, AnimatorResult } from '@kit.ArkUI'; +import resource from '../../../common/resource'; + +@Entry +@Component +struct Index { + @State animatorOptions: AnimatorResult | undefined = undefined; + @State animatorStatus: Resource = $r('app.string.create'); + begin: number = 0; + end: number = 300; + topWidth: number = 150; + bottomHeight: number = 100; + g: number = 0.18; + animatorOption: AnimatorOptions = { + duration: 4000, + delay: 0, + easing: 'linear', + iterations: 1, + fill: "forwards", + direction: 'normal', + begin: this.begin, + end: this.end + }; + @State translateX: number = 0; + @State translateY: number = 0; + + onPageShow(): void { + this.animatorOptions = this.getUIContext().createAnimator(this.animatorOption); + this.animatorOptions.onFrame = (progress: number) => { + this.translateX = progress; + if (progress > this.topWidth && this.translateY < this.bottomHeight) { + this.translateY = Math.pow(progress - this.topWidth, 2) * this.g; + } + } + this.animatorOptions.onCancel = () => { + this.animatorStatus = $r('app.string.cancel'); + } + this.animatorOptions.onFinish = () => { + this.animatorStatus = $r('app.string.complete'); + } + this.animatorOptions.onRepeat = () => { + console.log('repeat play'); + } + } + + onPageHide(): void { + this.animatorOptions = undefined; + } + + build() { + Column() { + Column({ space: 30 }) { + Button($r('app.string.play')).onClick(() => { + this.animatorOptions?.play(); + this.animatorStatus = $r('app.string.playing'); + }).width(80).height(35) + Button($r('app.string.reset')).onClick(() => { + this.translateX = 0; + this.translateY = 0; + }).width(80).height(35) + Button($r('app.string.pause')).onClick(() => { + this.animatorOptions?.pause(); + this.animatorStatus = $r('app.string.pause'); + }).width(80).height(35) + }.width('100%').height('25%') + + Stack() { + Button() + .width(60) + .height(60) + .translate({ x: this.translateX, y: this.translateY }) + } + .width('100%') + .height('45%') + .align(Alignment.Start) + + Text(resource.resourceToString($r('app.string.animatorStatus')) + resource.resourceToString(this.animatorStatus)) + }.width('100%').height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..217dd8dcc21b98ac1bdf6274be98c5972b329bae --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template1/Index.ets @@ -0,0 +1,60 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +class SetSlt { + isAnimation: boolean = true + + set(): void { + this.isAnimation = !this.isAnimation; + } +} + +@Entry +@Component +struct AnimationToAnimationDemo { + // 第一步：声明相关状态变量 + @State setAnimation: SetSlt = new SetSlt(); + + build() { + Column() { + Text('ArkUI') + .fontWeight(FontWeight.Bold) + .fontSize(12) + .fontColor(Color.White) + .textAlign(TextAlign.Center) + .borderRadius(10) + .backgroundColor(0xf56c6c) + .width(100) + .height(100) + .scale({ + // 第二步：将状态变量设置到相关可动画属性接口 + x: this.setAnimation.isAnimation ? 2 : 1, + y: this.setAnimation.isAnimation ? 2 : 1 + }) + .animation({ curve: curves.springMotion(0.4, 0.8) }) // 第四步：通过animation接口开启动画，动画终点值改变时，系统自动添加衔接动画 + + Button('Click') + .margin({ top: 200 }) + .onClick(() => { + // 第三步：通过点击事件改变状态变量值，影响可动画属性值 + this.setAnimation.set() + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8ab6bb78d82bc15c33ae51db1e2bbc1d1a1cc978 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/cohesion/template2/Index.ets @@ -0,0 +1,69 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct SpringMotionDemo { + // 第一步：声明相关状态变量 + @State positionX: number = 100; + @State positionY: number = 100; + diameter: number = 50; + + build() { + Column() { + Row() { + Circle({ width: this.diameter, height: this.diameter }) + .fill(Color.Blue) + .position({ x: this.positionX, y: this.positionY })// 第二步：将状态变量设置到相关可动画属性接口 + .onTouch((event?: TouchEvent) => { + // 第三步：在跟手过程改变状态变量值，并且采用responsiveSpringMotion动画运动到新的值 + if (event) { + if (event.type === TouchType.Move) { + // 跟手过程，使用responsiveSpringMotion曲线 + this.getUIContext()?.animateTo({ curve: curves.responsiveSpringMotion() }, () => { + // 减去半径，以使球的中心运动到手指位置 + this.positionX = event.touches[0].windowX - this.diameter / 2; + this.positionY = event.touches[0].windowY - this.diameter / 2; + console.info(`move, animateTo x:${this.positionX}, y:${this.positionY}`); + }) + } else if (event.type === TouchType.Up) { + // 第四步：在离手过程设定状态变量终点值，并且用springMotion动画运动到新的值，springMotion动画将继承跟手阶段的动画速度 + this.getUIContext()?.animateTo({ curve: curves.springMotion() }, () => { + this.positionX = 100; + this.positionY = 100; + console.info(`touchUp, animateTo x:100, y:100`); + }) + } + } + }) + } + .width('100%').height("80%") + .clip(true) // 如果球超出父组件范围，使球不可见 + .backgroundColor(Color.Orange) + + Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Start, justifyContent: FlexAlign.Center }) { + Text("拖动小球").fontSize(16) + } + .width('100%') + + Row() { + Text('点击位置: [x: ' + Math.round(this.positionX) + ', y:' + Math.round(this.positionY) + ']').fontSize(16) + } + .padding(10) + .width('100%') + }.height('100%').width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/common/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/common/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..02c5c6b987280c6731d3e40af7c56c416176a3af --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/common/Index.ets @@ -0,0 +1,23 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export interface Route { + name: string; + label: ResourceStr; +} + +export interface RouteGroup extends Route { + children: Route[]; +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..3882e01414f1fdf48b5df9b45993c783f3025342 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template1/Index.ets @@ -0,0 +1,44 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct TransitionEffectExample1 { + @State flag: boolean = true; + @State show: string = 'show'; + + build() { + Column() { + Button(this.show).width(80).height(30).margin(30) + .onClick(() => { + // 点击Button控制Image的显示和消失 + if (this.flag) { + this.show = 'hide'; + } else { + this.show = 'show'; + } + this.flag = !this.flag; + }) + if (this.flag) { + // Image的显示和消失配置为相同的过渡效果（出现和消失互为逆过程） + // 出现时从指定的透明度为0、绕z轴旋转180°的状态，变为默认的透明度为1、旋转角为0的状态，透明度与旋转动画时长都为2000ms + // 消失时从默认的透明度为1、旋转角为0的状态，变为指定的透明度为0、绕z轴旋转180°的状态，透明度与旋转动画时长都为2000ms + Image($r('app.media.testImg')).width(200).height(200) + .transition(TransitionEffect.OPACITY.animation({ duration: 2000, curve: Curve.Ease }).combine( + TransitionEffect.rotate({ z: 1, angle: 180 }) + )) + } + }.width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..784df84f6931e39aad853f4b492d469d6f1d7492 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template2/Index.ets @@ -0,0 +1,63 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct TransitionEffectExample2 { + @State flag: boolean = true; + @State show: string = 'show'; + + build() { + Column() { + Button(this.show).width(80).height(30).margin(30) + .onClick(() => { + // 点击Button控制Image的显示和消失 + if (this.flag) { + this.show = 'hide'; + } else { + this.show = 'show'; + } + this.getUIContext().animateTo({ duration: 2000 }, () => { + // 第一张图的TransitionEffect包含了animation，transition的动画参数由TransitionEffect指定 + // 第二张图的TransitionEffect不包含animation，transition的动画参数由animateTo指定 + this.flag = !this.flag; + }); + }) + if (this.flag) { + // Image的显示和消失配置为不同的过渡效果 + // 出现时做从指定的透明度为0变为默认的透明度1的动画，该动画时长为1000ms，以及做从指定的绕z轴旋转180°变为默认的旋转角为0的动画，该动画1000ms后播放，时长为1000ms + // 消失时做从默认的透明度为1变为指定的透明度0的动画，该动画1000ms后播放，时长为1000ms，以及做从默认的旋转角0变为指定的绕z轴旋转180°的动画，该动画时长为1000ms + Image($r('app.media.testImg')).width(200).height(200) + .transition( + TransitionEffect.asymmetric( + TransitionEffect.OPACITY.animation({ duration: 1000 }).combine( + TransitionEffect.rotate({ z: 1, angle: 180 }).animation({ delay: 1000, duration: 1000 })) + , + TransitionEffect.OPACITY.animation({ delay: 1000, duration: 1000 }).combine( + TransitionEffect.rotate({ z: 1, angle: 180 }).animation({ duration: 1000 })) + ) + ) + // 出现时做从x方向和y方向scale都为0变为默认的x方向和y方向scale都为1的动画，该动画时长为animateTo中指定的2000ms + // 消失时无转场效果 + Image($r('app.media.testImg')).width(200).height(200).margin({ top: 100 }) + .transition( + TransitionEffect.asymmetric( + TransitionEffect.scale({ x: 0, y: 0 }), + TransitionEffect.IDENTITY + ) + ) + } + }.width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template3/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0a6234142ee5974171548614189043059137822f --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template3/Index.ets @@ -0,0 +1,60 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct TransitionEffectExample3 { + @State flag: boolean = true; + @State show: string = 'show'; + + build() { + Column() { + Button(this.show).width(80).height(30).margin(30) + .onClick(() => { + // 点击Button控制Image的显示和消失 + if (this.flag) { + this.show = 'hide'; + } else { + this.show = 'show'; + } + this.flag = !this.flag; + }) + if (this.flag) { + // 改flag条件时，会触发id为"column1"、"image1"、"image2"的transition动画。 + // id为"column1"的组件是这棵新出现/消失的子树的根节点。 + Column() { + Row() { + Image($r('app.media.testImg')).width(150).height(150).id("image1") + .transition(TransitionEffect.OPACITY.animation({ duration: 1000 })) + } + + Image($r('app.media.testImg')) + .width(150) + .height(150) + .margin({ top: 50 }) + .id("image2") + .transition(TransitionEffect.scale({ x: 0, y: 0 }).animation({ duration: 1000 })) + Text("view").margin({ top: 50 }) + } + .id("column1") + .transition(TransitionEffect.opacity(0.99).animation({ duration: 1000 }), + // 结束回调设置在消失的第一层节点上，确保能有消失的结束回调 + (transitionIn: boolean) => { + console.info("transition finish, transitionIn:" + transitionIn); + } + ) + } + }.width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template4/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..270b39e18f0460e40bcaa49cab71e302f1dab72a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template4/Index.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct TransitionEffectDemo { + @State isPresent: boolean = false; + // 第一步，创建TransitionEffect + private effect: TransitionEffect = + // 创建默认透明度转场效果，并指定了springMotion(0.6, 0.8)曲线 + TransitionEffect.OPACITY.animation({ + curve: curves.springMotion(0.6, 0.8) + })// 通过combine方法，这里的动画参数会跟随上面的TransitionEffect，也就是springMotion(0.6, 0.8) + .combine(TransitionEffect.scale({ + x: 0, + y: 0 + }))// 添加旋转转场效果，这里的动画参数会跟随上面带animation的TransitionEffect，也就是springMotion(0.6, 0.8) + .combine(TransitionEffect.rotate({ angle: 90 }))// 添加平移转场效果，这里的动画参数使用指定的springMotion() + .combine(TransitionEffect.translate({ y: 150 }) + .animation({ curve: curves.springMotion() }))// 添加move转场效果，这里的动画参数会跟随上面的TransitionEffect，也就是springMotion() + .combine(TransitionEffect.move(TransitionEdge.END)); + + build() { + Stack() { + if (this.isPresent) { + Column() { + Text('ArkUI') + .fontWeight(FontWeight.Bold) + .fontSize(20) + .fontColor(Color.White) + } + .justifyContent(FlexAlign.Center) + .width(150) + .height(150) + .borderRadius(10) + .backgroundColor(0xf56c6c) + // 第二步：将转场效果通过transition接口设置到组件 + .transition(this.effect) + } + + // 边框 + Column() + .width(155) + .height(155) + .border({ + width: 5, + radius: 10, + color: Color.Black + }) + + // 第三步：新增或者删除组件触发转场，控制新增或者删除组件 + Button('Click') + .margin({ top: 320 }) + .onClick(() => { + this.isPresent = !this.isPresent; + }) + } + .width('100%') + .height('60%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template5/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0bed356b71ee31b2c286d6597fa4cc6479476c73 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/compTransition/template5/Index.ets @@ -0,0 +1,72 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +const ITEM_COUNTS = 9; +const ITEM_COLOR = '#ED6F21'; +const INTERVAL = 30; +const DURATION = 300; + +@Entry +@Component +struct Index1 { + @State isGridShow: boolean = false; + private dataArray: number[] = new Array(ITEM_COUNTS); + + aboutToAppear(): void { + for (let i = 0; i < ITEM_COUNTS; i++) { + this.dataArray[i] = i; + } + } + + build() { + Stack() { + if (this.isGridShow) { + Grid() { + ForEach(this.dataArray, (item: number, index: number) => { + GridItem() { + Stack() { + Text((item + 1).toString()) + } + .size({ width: 50, height: 50 }) + .backgroundColor(ITEM_COLOR) + .transition(TransitionEffect.OPACITY + .combine(TransitionEffect.scale({ x: 0.5, y: 0.5 }))// 对每个方格的转场添加delay，实现组件的渐次出现消失效果 + .animation({ duration: DURATION, curve: Curve.Friction, delay: INTERVAL * index })) + .borderRadius(10) + } + // 消失时，如果不对方格的所有父控件添加转场效果，则方格的消失转场不会生效 + // 此处让方格的父控件在出现消失转场时一直以0.99的透明度显示，使得方格的转场效果不受影响 + .transition(TransitionEffect.opacity(0.99)) + }, (item: number) => item.toString()) + } + .columnsTemplate('1fr 1fr 1fr') + .rowsGap(15) + .columnsGap(15) + .size({ width: 180, height: 180 }) + // 消失时，如果不对方格的所有父控件添加转场效果，则方格的消失转场不会生效 + // 此处让父控件在出现消失转场时一直以0.99的透明度显示，使得方格的转场效果不受影响 + .transition(TransitionEffect.opacity(0.99)) + } + } + .size({ width: '100%', height: '100%' }) + .onClick(() => { + this.getUIContext()?.animateTo({ + duration: DURATION + INTERVAL * (ITEM_COUNTS - 1), + curve: Curve.Friction + }, () => { + this.isGridShow = !this.isGridShow; + }) + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/keyframeAnimateTo/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/keyframeAnimateTo/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..18b29a34b679e15637ec2f60a6d4486fc8ff6d51 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/keyframeAnimateTo/template1/Index.ets @@ -0,0 +1,68 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { UIContext } from '@kit.ArkUI'; + +@Entry +@Component +struct KeyframeDemo { + @State myScale: number = 1.0; + uiContext: UIContext | undefined = undefined; + + aboutToAppear() { + this.uiContext = this.getUIContext?.(); + } + + build() { + Column() { + Circle() + .width(100) + .height(100) + .fill("#46B1E3") + .margin(100) + .scale({ x: this.myScale, y: this.myScale }) + .onClick(() => { + if (!this.uiContext) { + console.info("no uiContext, keyframe failed"); + return; + } + this.myScale = 1; + // 设置关键帧动画整体播放3次 + this.uiContext.keyframeAnimateTo({ + iterations: 3, + expectedFrameRateRange: { + min: 10, + max: 120, + expected: 60, + } + }, [ + { + // 第一段关键帧动画时长为800ms，scale属性做从1到1.5的动画 + duration: 800, + event: () => { + this.myScale = 1.5; + } + }, + { + // 第二段关键帧动画时长为500ms，scale属性做从1.5到1的动画 + duration: 500, + event: () => { + this.myScale = 1; + } + } + ]); + }) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/motionPath/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/motionPath/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..97db6e2734688969e1f36cee799bea3a3e9de205 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/motionPath/template1/Index.ets @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct MotionPathExample { + @State toggle: boolean = true; + + build() { + Column() { + Button('click me').margin(50) + .motionPath({ + path: 'Mstart.x start.y L300 200 L300 500 Lend.x end.y', + from: 0.0, + to: 1.0, + rotatable: true + }) // 执行动画：从起点移动到(300,200)，再到(300,500)，再到终点 + .onClick(() => { + this.getUIContext()?.animateTo({ duration: 4000, curve: Curve.Linear }, () => { + this.toggle = !this.toggle; // 通过this.toggle变化组件的位置 + }); + }) + }.width('100%').height('100%').alignItems(this.toggle ? HorizontalAlign.Start : HorizontalAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..985716355150f40b4fdb091fd4a4920617d7143a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Index.ets @@ -0,0 +1,50 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct pageTransition1 { + @State scale1: number = 1; + @State opacity1: number = 1; + + build() { + Column() { + Image($r("app.media.transition_image1")).width('100%').height('100%') + } + .width('100%') + .height('100%') + .scale({ x: this.scale1 }) + .opacity(this.opacity1) + .onClick(() => { + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template1/Page1' }); + }) + } + + pageTransition() { + PageTransitionEnter({ duration: 1200, curve: Curve.Linear }) + .onEnter((type: RouteType, progress: number) => { + if (type == RouteType.Push || type == RouteType.Pop) { + this.scale1 = progress; + this.opacity1 = progress; + } + }) + PageTransitionExit({ duration: 1200, curve: Curve.Ease }) + .onExit((type: RouteType, progress: number) => { + if (type == RouteType.Push) { + this.scale1 = 1 - progress; + this.opacity1 = 1 - progress; + } + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Page1.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Page1.ets new file mode 100644 index 0000000000000000000000000000000000000000..02727ee0ffd1579b5fadf0e76435ff40f06a42c9 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template1/Page1.ets @@ -0,0 +1,50 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct pageTransitionPage1 { + @State scale2: number = 1; + @State opacity2: number = 1; + + build() { + Column() { + Image($r("app.media.transition_image2")).width('100%').height('100%') // 图片存放在media文件夹下 + } + .width('100%') + .height('100%') + .scale({ x: this.scale2 }) + .opacity(this.opacity2) + .onClick(() => { + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template1/Index' }); + }) + } + + pageTransition() { + PageTransitionEnter({ duration: 1200, curve: Curve.Linear }) + .onEnter((type: RouteType, progress: number) => { + if (type == RouteType.Push || type == RouteType.Pop) { + this.scale2 = progress; + } + this.opacity2 = progress; + }) + PageTransitionExit({ duration: 1200, curve: Curve.Ease }) + .onExit((type: RouteType, progress: number) => { + if (type == RouteType.Pop) { + this.scale2 = 1 - progress; + this.opacity2 = 1 - progress; + } + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..b334a8f43305046339d2df7f507fc039f319e213 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Index.ets @@ -0,0 +1,51 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct pageTransition2 { + @State scale1: number = 1; + @State opacity1: number = 1; + + build() { + Column() { + Button($r('app.string.page1')).onClick(() => { + this.getUIContext().getRouter().pushUrl({ + url: "pages/pageTransition/template2/Page1" + }) + }) + .width(200) + .height(60) + .fontSize(36) + Text("START") + .fontSize(36) + .textAlign(TextAlign.Center) + } + .scale({ x: this.scale1 }) + .opacity(this.opacity1) + .height('100%') + .width('100%') + .justifyContent(FlexAlign.Center) + } + + // 自定义方式2：使用系统提供的多种默认效果(平移、缩放、透明度等) + pageTransition() { + //设置入场动效 + PageTransitionEnter({ duration: 200 }) + .slide(SlideEffect.START) + //设置退场动效 + PageTransitionExit({ delay: 100 }) + .slide(SlideEffect.START) //Left + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Page1.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Page1.ets new file mode 100644 index 0000000000000000000000000000000000000000..61f33307bd9b70d150a4f18163967bc8f9b43f4b --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template2/Page1.ets @@ -0,0 +1,49 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct Page1 { + @State scale1: number = 1; + @State opacity1: number = 1; + + build() { + Column() { + Button($r('app.string.page2')).onClick(() => { + this.getUIContext().getRouter().pushUrl({ + url: "pages/pageTransition/template2/Index" + }); + }) + .width(200) + .height(60) + .fontSize(36) + Text("END") + .fontSize(36) + .textAlign(TextAlign.Center) + } + .scale({ x: this.scale1 }) + .opacity(this.opacity1) + .height('100%') + .width('100%') + .justifyContent(FlexAlign.Center) + } + + // 自定义方式2：使用系统提供的多种默认效果(平移、缩放、透明度等) + pageTransition() { + PageTransitionEnter({ duration: 200 }) + .slide(SlideEffect.END) //Right + PageTransitionExit({ delay: 100 }) + .slide(SlideEffect.END) //Right + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionDst1.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionDst1.ets new file mode 100644 index 0000000000000000000000000000000000000000..dbab53fbd2d24268b341982673d4634e2f4ca332 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionDst1.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct PageTransitionDst1 { + build() { + Column() { + Image($r('app.media.forest')) + .width('90%') + .height('80%') + .objectFit(ImageFit.Fill) + .syncLoad(true) // 同步加载图片，使页面出现时图片已经加载完成 + .margin(30) + + Row({ space: 10 }) { + Button("pushUrl") + .onClick(() => { + // 路由到下一页面，push操作 + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template3/pageTransitionSrc1' }); + }) + Button("back") + .onClick(() => { + // 返回到上一页面，相当于pop操作 + this.getUIContext().getRouter().back(); + }) + }.justifyContent(FlexAlign.Center) + } + .width('100%').height('100%') + .alignItems(HorizontalAlign.Center) + } + + pageTransition() { + // 定义页面进入时的效果，从右侧滑入，时长为1000ms，页面栈发生push操作时该效果才生效 + PageTransitionEnter({ type: RouteType.Push, duration: 1000 }) + .slide(SlideEffect.Right) + // 定义页面进入时的效果，从左侧滑入，时长为1000ms，页面栈发生pop操作时该效果才生效 + PageTransitionEnter({ type: RouteType.Pop, duration: 1000 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，向左侧滑出，时长为1000ms，页面栈发生push操作时该效果才生效 + PageTransitionExit({ type: RouteType.Push, duration: 1000 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，向右侧滑出，时长为1000ms，页面栈发生pop操作时该效果才生效 + PageTransitionExit({ type: RouteType.Pop, duration: 1000 }) + .slide(SlideEffect.Right) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionSrc1.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionSrc1.ets new file mode 100644 index 0000000000000000000000000000000000000000..8b037962b68a865cabf738dab0d29b4f141219df --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template3/pageTransitionSrc1.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct PageTransitionSrc1 { + build() { + Column() { + Image($r('app.media.mountain')) + .width('90%') + .height('80%') + .objectFit(ImageFit.Fill) + .syncLoad(true) // 同步加载图片，使页面出现时图片已经加载完成 + .margin(30) + + Row({ space: 10 }) { + Button("pushUrl") + .onClick(() => { + // 路由到下一个页面，push操作 + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template3/pageTransitionDst1' }); + }) + Button("back") + .onClick(() => { + // 返回到上一页面，相当于pop操作 + this.getUIContext().getRouter().back(); + }) + }.justifyContent(FlexAlign.Center) + } + .width('100%').height('100%') + .alignItems(HorizontalAlign.Center) + } + + pageTransition() { + // 定义页面进入时的效果，从右侧滑入，时长为1000ms，页面栈发生push操作时该效果才生效 + PageTransitionEnter({ type: RouteType.Push, duration: 1000 }) + .slide(SlideEffect.Right) + // 定义页面进入时的效果，从左侧滑入，时长为1000ms，页面栈发生pop操作时该效果才生效 + PageTransitionEnter({ type: RouteType.Pop, duration: 1000 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，向左侧滑出，时长为1000ms，页面栈发生push操作时该效果才生效 + PageTransitionExit({ type: RouteType.Push, duration: 1000 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，向右侧滑出，时长为1000ms，页面栈发生pop操作时该效果才生效 + PageTransitionExit({ type: RouteType.Pop, duration: 1000 }) + .slide(SlideEffect.Right) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionDst2.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionDst2.ets new file mode 100644 index 0000000000000000000000000000000000000000..b1f8574084b1d42f093e706238810ccf5b03ac75 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionDst2.ets @@ -0,0 +1,53 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct PageTransitionDst2 { + build() { + Column() { + Image($r('app.media.forest')) + .width('90%') + .height('80%') + .objectFit(ImageFit.Fill) + .syncLoad(true) // 同步加载图片，使页面出现时图片已经加载完成 + .margin(30) + + Row({ space: 10 }) { + Button("pushUrl") + .onClick(() => { + // 路由到下一页面，push操作 + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template4/pageTransitionSrc2' }); + }) + Button("back") + .onClick(() => { + // 返回到上一页面，相当于pop操作 + this.getUIContext().getRouter().back(); + }) + }.justifyContent(FlexAlign.Center) + } + .width('100%').height('100%') + .alignItems(HorizontalAlign.Center) + } + + pageTransition() { + // 定义页面进入时的效果，从左侧滑入，时长为1200ms，无论页面栈发生push还是pop操作均可生效 + PageTransitionEnter({ duration: 1200 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，相对于正常页面位置x方向平移100vp，y方向平移100vp，透明度变为0，时长为1000ms，无论页面栈发生push还是pop操作均可生效 + PageTransitionExit({ duration: 1000 }) + .translate({ x: 100.0, y: 100.0 }) + .opacity(0) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionSrc2.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionSrc2.ets new file mode 100644 index 0000000000000000000000000000000000000000..c2e11e676b27b465f7d1d599ebc6afd00847e729 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/pageTransition/template4/pageTransitionSrc2.ets @@ -0,0 +1,53 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct PageTransitionSrc2 { + build() { + Column() { + Image($r('app.media.mountain')) + .width('90%') + .height('80%') + .objectFit(ImageFit.Fill) + .syncLoad(true) // 同步加载图片，使页面出现时图片已经加载完成 + .margin(30) + + Row({ space: 10 }) { + Button("pushUrl") + .onClick(() => { + // 路由到下一页面，push操作 + this.getUIContext().getRouter().pushUrl({ url: 'pages/pageTransition/template4/pageTransitionDst2' }); + }) + Button("back") + .onClick(() => { + // 返回到上一页面，相当于pop操作 + this.getUIContext().getRouter().back(); + }) + }.justifyContent(FlexAlign.Center) + } + .width('100%').height('100%') + .alignItems(HorizontalAlign.Center) + } + + pageTransition() { + // 定义页面进入时的效果，从左侧滑入，时长为1000ms，无论页面栈发生push还是pop操作均可生效 + PageTransitionEnter({ duration: 1000 }) + .slide(SlideEffect.Left) + // 定义页面退出时的效果，相对于正常页面位置x方向平移100vp，y方向平移100vp，透明度变为0，时长为1200ms，无论页面栈发生push还是pop操作均可生效 + PageTransitionExit({ duration: 1200 }) + .translate({ x: 100.0, y: 100.0 }) + .opacity(0) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..66873f88f674aa93306ed9a3e40d54e58f742ae1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template1/Index.ets @@ -0,0 +1,124 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ParticleExample { + build() { + Stack() { + Text() + .width(300).height(300).backgroundColor(Color.Black) + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.POINT, //粒子类型 + config: { + radius: 10//圆点半径 + }, + count: 500, //粒子总数 + lifetime: 10000, //粒子生命周期，单位ms + lifetimeRange: 100//粒子生命周期取值范围，单位ms + }, + emitRate: 10, //每秒发射粒子数 + position: [0, 0], + shape: ParticleEmitterShape.RECTANGLE//发射器形状 + }, + color: { + range: [Color.Red, Color.Yellow], //初始颜色范围 + updater: { + type: ParticleUpdater.CURVE, //变化方式为曲线变化 + config: [ + { + from: Color.White, //变化起始值 + to: Color.Pink, //变化终点值 + startMillis: 0, //开始时间 + endMillis: 3000, //结束时间 + curve: Curve.EaseIn//变化曲线 + }, + { + from: Color.Pink, + to: Color.Orange, + startMillis: 3000, + endMillis: 5000, + curve: Curve.EaseIn + }, + { + from: Color.Orange, + to: Color.Pink, + startMillis: 5000, + endMillis: 8000, + curve: Curve.EaseIn + }, + ] + } + }, + opacity: { + range: [0.0, 1.0], //粒子透明度的初始值从【0.0到1.0】随机产生 + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 1.0, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 1.0, + to: 0.0, + startMillis: 5000, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + }, + scale: { + range: [0.0, 0.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 0.5, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + } + ] + } + }, + acceleration: { + //加速度的配置，从大小和方向两个维度变化，speed表示加速度大小，angle表示加速度方向 + speed: { + range: [3, 9], + updater: { + type: ParticleUpdater.RANDOM, //Speed的变化方式是随机变化 + config: [1, 20] + } + }, + angle: { + range: [90, 90] + } + } + + } + ] + }).width(300).height(300) + }.width('100%').height('100%').align(Alignment.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..77952169301832567b14abaf53a802248ad68558 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template2/Index.ets @@ -0,0 +1,399 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ParticleExample2 { + @State + myCount: number = 100; + flag: boolean = false; + + build() { + Column() { + Stack() { + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.IMAGE, + config: { + src: $r("app.media.book"), + size: [10, 10] + }, + count: this.myCount, + lifetime: 10000, + lifetimeRange: 100 + }, + emitRate: 3, + shape: ParticleEmitterShape.CIRCLE + }, + color: { + range: [Color.White, Color.White] + }, + opacity: { + range: [1.0, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 1.0, + startMillis: 0, + endMillis: 6000 + }, + { + from: 1.0, + to: 0, + startMillis: 6000, + endMillis: 10000 + } + ] + } + }, + scale: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 1.5, + startMillis: 0, + endMillis: 8000, + curve: Curve.EaseIn + } + + ] + } + }, + acceleration: { + speed: { + range: [3, 9], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 10, + to: 20, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 10, + to: 2, + startMillis: 3000, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + }, + angle: { + range: [0, 180], + updater: { + type: ParticleUpdater.CURVE, + config: [{ + from: 1, + to: 2, + startMillis: 0, + endMillis: 1000, + curve: Curve.EaseIn + }, + { + from: 50, + to: -50, + startMillis: 1000, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 3, + to: 5, + startMillis: 3000, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + } + }, + spin: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 360, + startMillis: 0, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + }, + } + , { + emitter: { + particle: { + type: ParticleType.IMAGE, + config: { + src: $r('app.media.heart'), + size: [10, 10] + }, + count: this.myCount, + lifetime: 10000, + lifetimeRange: 100 + }, + emitRate: 3, + shape: ParticleEmitterShape.CIRCLE + }, + color: { + range: [Color.White, Color.White] + }, + opacity: { + range: [1.0, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 1.0, + startMillis: 0, + endMillis: 6000 + }, + { + from: 1.0, + to: 0, + startMillis: 6000, + endMillis: 10000 + } + ] + } + }, + scale: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 2.0, + startMillis: 0, + endMillis: 10000, + curve: Curve.EaseIn + } + + ] + } + }, + acceleration: { + speed: { + range: [3, 9], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 10, + to: 20, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 10, + to: 2, + startMillis: 3000, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + }, + angle: { + range: [0, 180], + updater: { + type: ParticleUpdater.CURVE, + config: [{ + from: 1, + to: 2, + startMillis: 0, + endMillis: 1000, + curve: Curve.EaseIn + }, + { + from: 50, + to: -50, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 3, + to: 5, + startMillis: 3000, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + } + }, + spin: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 360, + startMillis: 0, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + }, + }, { + emitter: { + particle: { + type: ParticleType.IMAGE, + config: { + src: $r('app.media.sun'), + size: [10, 10] + }, + count: this.myCount, + lifetime: 10000, + lifetimeRange: 100 + }, + emitRate: 3, + shape: ParticleEmitterShape.CIRCLE + }, + color: { + range: [Color.White, Color.White] + }, + opacity: { + range: [1.0, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 1.0, + startMillis: 0, + endMillis: 6000 + }, + { + from: 1.0, + to: 0, + startMillis: 6000, + endMillis: 10000 + } + ] + } + }, + scale: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 2.0, + startMillis: 0, + endMillis: 10000, + curve: Curve.EaseIn + } + + ] + } + }, + acceleration: { + speed: { + range: [3, 9], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 10, + to: 20, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 10, + to: 2, + startMillis: 3000, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + }, + angle: { + range: [0, 180], + updater: { + type: ParticleUpdater.CURVE, + config: [{ + from: 1, + to: 2, + startMillis: 0, + endMillis: 1000, + curve: Curve.EaseIn + }, + { + from: 50, + to: -50, + startMillis: 1000, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 3, + to: 5, + startMillis: 3000, + endMillis: 8000, + curve: Curve.EaseIn + } + ] + } + } + }, + spin: { + range: [0.1, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0, + to: 360, + startMillis: 0, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + }, + } + ] + }).width(300).height(300) + + }.width(500).height(500).align(Alignment.Center) + }.width('100%').height('100%') + + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template3/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..599a29139fae91ce5b7a44707736de0a7945c453 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template3/Index.ets @@ -0,0 +1,132 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ParticleExample3 { + build() { + Stack() { + Text() + .width(300).height(300).backgroundColor(Color.Black) + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.POINT, //粒子类型 + config: { + radius: 10//圆点半径 + }, + count: 500, //粒子总数 + lifetime: 10000//粒子生命周期，单位ms + }, + emitRate: 10, //每秒发射粒子数 + position: [0, 0], + shape: ParticleEmitterShape.RECTANGLE//发射器形状 + }, + color: { + range: [Color.Red, Color.Yellow], //初始颜色范围 + updater: { + type: ParticleUpdater.CURVE, //变化方式为曲线变化 + config: [ + { + from: Color.White, //变化起始值 + to: Color.Pink, //变化终点值 + startMillis: 0, //开始时间 + endMillis: 3000, //结束时间 + curve: Curve.EaseIn//变化曲线 + }, + { + from: Color.Pink, + to: Color.Orange, + startMillis: 3000, + endMillis: 5000, + curve: Curve.EaseIn + }, + { + from: Color.Orange, + to: Color.Pink, + startMillis: 5000, + endMillis: 8000, + curve: Curve.EaseIn + }, + ] + } + }, + opacity: { + range: [0.0, 1.0], //粒子透明度的初始值从[0.0,1.0]随机产生 + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 1.0, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 1.0, + to: 0.0, + startMillis: 5000, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + }, + scale: { + range: [0.0, 0.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 0.5, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + } + ] + } + }, + acceleration: { + //加速度的配置，从大小和方向两个维度变化，speed表示加速度大小，angle表示加速度方向 + speed: { + range: [3, 9], + updater: { + type: ParticleUpdater.RANDOM, + config: [1, 20] + } + }, + angle: { + range: [90, 90] + } + } + + } + ] + }).width(300).height(300).disturbanceFields([{ + strength: 10, + shape: DisturbanceFieldShape.RECT, + size: { width: 100, height: 100 }, + position: { x: 100, y: 100 }, + feather: 15, + noiseScale: 10, + noiseFrequency: 15, + noiseAmplitude: 5 + }]) + }.width('100%').height('100%').align(Alignment.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template4/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..63b91468f7adefaa9f584588d4db01236bbb84ce --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template4/Index.ets @@ -0,0 +1,84 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ParticleExample4 { + @State emitterProperties: Array = [ + { + index: 0, + emitRate: 100, + position: { x: 60, y: 80 }, + size: { width: 200, height: 200 } + } + ]; + + build() { + Stack() { + Text() + .width(300).height(300).backgroundColor(Color.Black) + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.POINT, // 粒子类型 + config: { + radius: 5// 圆点半径 + }, + count: 400, // 粒子总数 + lifetime: -1// 粒子的生命周期，-1表示粒子生命周期无限大 + }, + emitRate: 10, // 每秒发射粒子数 + position: [0, 0], // 粒子发射位置 + shape: ParticleEmitterShape.CIRCLE// 发射器形状 + }, + color: { + range: [Color.Red, Color.Yellow], // 初始颜色范围 + updater: { + type: ParticleUpdater.CURVE, // 变化方式为曲线变化 + config: [ + { + from: Color.White, + to: Color.Pink, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: Color.Pink, + to: Color.Orange, + startMillis: 3000, + endMillis: 5000, + curve: Curve.EaseIn + }, + { + from: Color.Orange, + to: Color.Pink, + startMillis: 5000, + endMillis: 8000, + curve: Curve.EaseIn + }, + ] + } + }, + }, + ] + }) + .width(300) + .height(300) + .emitter(this.emitterProperties) + }.width('100%').height('100%').align(Alignment.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template5/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..671ed22d43cd855da23b1544adbc34bb8e74d0f4 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template5/Index.ets @@ -0,0 +1,92 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI'; + +@Entry +@Component +struct ParticleExample5 { + build() { + Stack() { + Text() + .width(300).height(300).backgroundColor(Color.Black) + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.POINT, //粒子类型 + config: { + radius: 5//圆点半径 + }, + count: 2000, //粒子总数 + lifetime: 10000, //粒子生命周期，单位ms + lifetimeRange: 100//粒子生命周期取值范围，单位ms + }, + emitRate: 100, //每秒发射粒子数 + shape: ParticleEmitterShape.ANNULUS,//环形发射器 + annulusRegion:{ + center:{x:LengthMetrics.percent(0.5),y:LengthMetrics.percent(0.5)}, // 圆环的圆心坐标 + innerRadius:LengthMetrics.vp(100), // 圆环的外圆半径 + outerRadius:LengthMetrics.vp(120), // 圆环的内圆半径 + startAngle:0, // 圆环的起始角度 + endAngle:360 // 圆环的结束角度 + } + }, + color: { + range: [Color.Pink, Color.White], + }, + opacity: { + range: [0.0, 1.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 1.0, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + }, + { + from: 1.0, + to: 0.0, + startMillis: 5000, + endMillis: 10000, + curve: Curve.EaseIn + } + ] + } + }, + scale: { + range: [0.0, 0.0], + updater: { + type: ParticleUpdater.CURVE, + config: [ + { + from: 0.0, + to: 0.5, + startMillis: 0, + endMillis: 3000, + curve: Curve.EaseIn + } + ] + } + }, + } + ] + }).width(300).height(300) + }.width('100%').height('100%').align(Alignment.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template6/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..3ab83a65df9c150d2c6a17f6542d2f0b8ea6a684 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/particle/template6/Index.ets @@ -0,0 +1,129 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI' + +@Entry +@Component +struct ParticleExample6 { + + @State radius: number = 1; + @State shape: ParticleEmitterShape = ParticleEmitterShape.ANNULUS; + @State emitRate: number = 200; + @State count: number = 2000; + private timerID: number = -1; + private centerX: LengthMetrics = LengthMetrics.percent(0.5); + private centerY: LengthMetrics = LengthMetrics.percent(0.5); + private inRadius: LengthMetrics = LengthMetrics.vp(120); + private outRadius: LengthMetrics = LengthMetrics.vp(120); + private startAngle: number = 0; + private endAngle: number = 90; + @State emitterProperties: Array = [ + { + index: 0, + emitRate: 100, + annulusRegion: { + center:{x:this.centerX, y: this.centerY}, // 圆环的圆心坐标 + outerRadius: this.outRadius, // 圆环的外圆半径 + innerRadius: this.inRadius, // 圆环的内圆半径 + startAngle: -90, // 圆环的起始角度 + endAngle: 0 // 圆环的结束角度 + } + } + ]; + @State region: ParticleAnnulusRegion = { + center:{x:this.centerX, y: this.centerY}, + outerRadius: this.outRadius, + innerRadius: this.inRadius, + startAngle: -90, + endAngle: 0 + }; + + aboutToDisappear(): void { + // 页面销毁时清除计时器 + if (this.timerID != -1) { + clearInterval(this.timerID); + } + } + + build() { + Column({ space: 10}) { + Stack() { + Text() + .width(300).height(300).backgroundColor(Color.Black) + + Particle({ + particles: [ + { + emitter: { + particle: { + type: ParticleType.POINT, // 粒子类型 + config: { + radius: this.radius // 圆点半径 + }, + count: this.count, // 粒子总数 + lifetime: -1 // 粒子的生命周期，-1表示粒子生命周期无限大 + }, + emitRate: this.emitRate, // 每秒发射粒子数 + shape: this.shape, //发射器形状 + annulusRegion: this.region + }, + color: { + range: [Color.White, Color.Pink], // 初始颜色范围 + }, + }, + ] + }).width('100%') + .height('100%') + .emitter(this.emitterProperties) + .onClick(()=>{ + // 清除已有定时器 + if (this.timerID != -1) { + clearInterval(this.timerID); + } + + // 创建定时器（每秒更新） + this.timerID = setInterval(() => { + this.emitterProperties = [ + { + index: 0, + emitRate: this.emitRate, + annulusRegion: { + center:{x:this.centerX, y: this.centerY}, + outerRadius: this.outRadius, + innerRadius: this.inRadius, + startAngle: this.startAngle, + endAngle: this.endAngle + } + } + ]; + if (this.endAngle >= 270) { + if (this.timerID != -1) { + clearInterval(this.timerID); + } + return; + } + // 更新角度值（5度/秒） + this.startAngle += 30; + this.endAngle += 30; + }, 1000); + + }) + } + .width('100%') + .height('100%') + .align(Alignment.Center) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ec7946947d9710cb03e48463203c133899e82866 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template1/Index.ets @@ -0,0 +1,31 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { display } from '@kit.ArkUI'; + +@Entry +@Component +struct rotation { + + build() { + Stack() { + Image($r('app.media.tree')) + .position({ x: 0, y: 0 }) + .size({ width: 100, height: 100 }) + .id('image1') + } + .backgroundColor(Color.White) + .size({ width: '100%', height: '100%' }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template2/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..29f6df2372d6e936055ff5a0d10091c2c4fb4d9e --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/rotation/template2/Index.ets @@ -0,0 +1,48 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { display } from '@kit.ArkUI'; + +@Entry +@Component +struct rotation { + + // 获取通过监听窗口的windowsSizeChange事件得到的屏幕显示方向 + @StorageLink('orientation') myOrientation: display.Orientation = display.Orientation.PORTRAIT; + + build() { + Stack() { + + // 当屏幕显示方向变化时，切换组件的视图效果 + if (this.myOrientation == display.Orientation.PORTRAIT || this.myOrientation == display.Orientation.PORTRAIT_INVERTED) { + Image($r('app.media.sky')) + .size({ width: 100, height: 100 }) + .id('image1') + + // 开发者也可以通过自行设置transition的TransitionEffect.OPACITY转场效果来实现旋转屏动画的透明度变化 + // .transition(TransitionEffect.OPACITY) + } else { + Image($r('app.media.tree')) + .position({ x: 0, y: 0 }) + .size({ width: 200, height: 200 }) + .id('image2') + + // 开发者也可以通过自行设置transition的TransitionEffect.OPACITY来实现旋转屏动画的透明度变化 + // .transition(TransitionEffect.OPACITY) + } + } + .backgroundColor(Color.White) + .size({ width: '100%', height: '100%' }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/Index.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..520b62a1a3b93bab55d1c0cf8c1346253909ea71 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/Index.ets @@ -0,0 +1,28 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SharedTransitionExample { + + build() { + Column() { + Image($r('app.media.ic_health_heart')).width(50).height(50).margin({ left: 20, top: 20 }) + .sharedTransition('sharedImage', { duration: 800, curve: Curve.Linear, delay: 100 }) + }.width('100%').height('100%').alignItems(HorizontalAlign.Start) + .onClick(() => { + this.getUIContext().getRouter().pushUrl({ url: 'pages/shareTransition/template1/PageB' }) + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/PageB.ets b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/PageB.ets new file mode 100644 index 0000000000000000000000000000000000000000..7fa35ab5e86e2a2dfeeaf34f60aafa9aa1ccad58 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/ets/pages/shareTransition/template1/PageB.ets @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct pageBExample { + build() { + Stack() { + Image($r('app.media.ic_health_heart')).width(150).height(150) + .sharedTransition('sharedImage', { duration: 800, curve: Curve.Linear, delay: 100 }) + }.width('100%').height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/module.json5 b/code/DocsSample/ArkUISample/Animation/entry/src/main/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..196e6b3978857f196aa334edffc3c5b431c6bc83 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/module.json5 @@ -0,0 +1,65 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry", + "type": "entry", + "description": "$string:module_desc", + "mainElement": "EntryAbility", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false, + "pages": "$profile:main_pages", + "abilities": [ + { + "name": "EntryAbility", + "srcEntry": "./ets/entryability/EntryAbility.ets", + "description": "$string:EntryAbility_desc", + "icon": "$media:layered_image", + "label": "$string:EntryAbility_label", + "startWindowIcon": "$media:startIcon", + "orientation": "auto_rotation", + "startWindowBackground": "$color:start_window_background", + "exported": true, + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "ohos.want.action.home" + ] + } + ] + } + ], + "extensionAbilities": [ + { + "name": "EntryBackupAbility", + "srcEntry": "./ets/entrybackupability/EntryBackupAbility.ets", + "type": "backup", + "exported": false, + "metadata": [ + { + "name": "ohos.extension.backup", + "resource": "$profile:backup_config" + } + ], + } + ] + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/color.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..3c712962da3c2751c2b9ddb53559afcbd2b54a02 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#FFFFFF" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/float.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/float.json new file mode 100644 index 0000000000000000000000000000000000000000..153478e3f449f86a897686bc35316bd4fc96fb99 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/float.json @@ -0,0 +1,17 @@ +{ + "float": [ + { + "name": "page_text_font_size", + "value": "50fp" + }, { + "name": "size_16", + "value": "16" + }, { + "name": "size_100", + "value": "100" + }, { + "name": "size_64", + "value": "64" + } + ] +} diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/string.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..e5f0207d763e6602f3417ccda3fb5cdfed04d0bc --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/element/string.json @@ -0,0 +1,232 @@ +{ + "string": [ + { + "name": "module_desc", + "value": "module description" + }, + { + "name": "EntryAbility_desc", + "value": "description" + }, + { + "name": "EntryAbility_label", + "value": "Animation" + }, + { + "name": "navigation_toolbar_add", + "value": "add" + }, + { + "name": "navigation_toolbar_app", + "value": "app" + }, + { + "name": "page1", + "value": "页面1" + }, + { + "name": "page2", + "value": "页面2" + }, + { + "name": "create", + "value": "创建" + }, + { + "name": "cancel", + "value": "取消" + }, + { + "name": "complete", + "value": "完成" + }, + { + "name": "playing", + "value": "播放中" + }, + { + "name": "animatorStatus", + "value": "当前动画状态为:" + }, + { + "name": "play", + "value": "播放" + }, + { + "name": "reset", + "value": "重置" + }, + { + "name": "pause", + "value": "暂停" + }, + { + "name": "navigation_toolbar_collect", + "value": "collect" + }, + { + "name": "temp1", + "value": "示例1" + }, + { + "name": "animate_to_label", + "value": "显示动画（animateTo）" + }, + { + "name": "animate_to_temp_label1", + "value": "示例1（在组件出现时创建动画）" + }, + { + "name": "animate_to_temp_label2", + "value": "示例2（动画执行结束后组件消失）" + }, + { + "name": "animate_to_temp_label3", + "value": "示例3（在状态管理V2中使用animateTo）" + }, + { + "name": "animation_label", + "value": "属性动画（animation）" + }, + { + "name": "animation_temp_label2", + "value": "示例2（使用animateTo产生属性动画）" + }, + { + "name": "animation_temp_label3", + "value": "示例3（使用animation产生属性动画）" + }, + { + "name": "animation_temp_label4", + "value": "示例4（使用keyframeAnimateTo产生属性动画）" + }, + { + "name": "cohesion_label", + "value": "动画衔接" + }, + { + "name": "cohesion_temp_label1", + "value": "示例1（动画衔接）" + }, + { + "name": "cohesion_temp_label2", + "value": "示例2（手势与动画的衔接）" + }, + { + "name": "keyframeAnimateTo_label", + "value": "关键帧动画" + }, + { + "name": "pageTransition_label", + "value": "页面间转场" + }, + { + "name": "pageTransition_temp_label1", + "value": "示例1（设置退入场动画）" + }, + { + "name": "pageTransition_temp_label2", + "value": "示例2（设置退入场平移效果）" + }, + { + "name": "pageTransition_temp_label3", + "value": "示例3（不推荐)（利用pushUrl跳转能力）" + }, + { + "name": "pageTransition_temp_label4", + "value": "示例4（不推荐)（type为None的页面转场）" + }, + { + "name": "compTransition_label", + "value": "组件内转场" + }, + { + "name": "compTransition_temp_label1", + "value": "示例1（使用同一接口实现图片出现消失）" + }, + { + "name": "compTransition_temp_label2", + "value": "示例2（使用不同接口实现图片出现消失）" + }, + { + "name": "compTransition_temp_label3", + "value": "示例3（设置父子组件为transition）" + }, + { + "name": "compTransition_temp_label4", + "value": "示例4（出现/消失转场）" + }, + { + "name": "compTransition_temp_label5", + "value": "示例5（多个组件渐次出现消失）" + }, + { + "name": "shareTransition_label", + "value": "共享元素转场" + }, + { + "name": "motionPath_label", + "value": "路径动画" + }, + { + "name": "particle_label", + "value": "粒子动画" + }, + { + "name": "particle_temp_label1", + "value": "示例1（圆形初始化粒子）" + }, + { + "name": "particle_temp_label2", + "value": "示例2（图片初始化粒子）" + }, + { + "name": "particle_temp_label3", + "value": "示例3（粒子扰动场的干扰下运动轨迹发生变化）" + }, + { + "name": "particle_temp_label4", + "value": "示例4（调整粒子发射器位置）" + }, + { + "name": "particle_temp_label5", + "value": "示例5（环形发射器创建）" + }, + { + "name": "particle_temp_label6", + "value": "示例6（环形发射器更新）" + }, + { + "name": "animator_label", + "value": "帧动画" + }, + { + "name": "animator_temp_label1", + "value": "示例1（基于ArkTS扩展的声明式开发范式）" + }, + { + "name": "animator_temp_label2", + "value": "示例2（位移动画示例）" + }, + { + "name": "animator_temp_label3", + "value": "示例3（使用帧动画实现小球抛物运动）" + }, + { + "name": "animateToImmediately_label", + "value": "显式动画立即下发" + }, + { + "name": "rotation_label", + "value": "旋转屏动画" + }, + { + "name": "rotation_temp_label1", + "value": "示例1（布局切换的旋转屏动画）" + }, + { + "name": "rotation_temp_label2", + "value": "示例2（透明度变化的旋转屏动画）" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/background.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/bg.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/bg.JPG new file mode 100644 index 0000000000000000000000000000000000000000..77d1db9c5ae70097ed69f7c9d2fcae8a751e8fff Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/bg.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/book.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/book.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/book.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/drawer.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/drawer.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/drawer.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/forest.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/forest.png new file mode 100644 index 0000000000000000000000000000000000000000..25165d3dac9606d9078b49a9853c66c9cb77320a Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/forest.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/heart.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/heart.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_health_heart.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_health_heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c0843441f0fa499317d594a0f81a0f169ac4cad9 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_health_heart.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlights.svg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlights.svg new file mode 100644 index 0000000000000000000000000000000000000000..7f0c77423290d138e1c06b9de163af52d0ba0195 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlights.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collect + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlightsed.svg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlightsed.svg new file mode 100644 index 0000000000000000000000000000000000000000..bda82973349ceba0d7de8e9f85d704844cb31318 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/ic_public_highlightsed.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collected + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon_2.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon_2.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/icon_2.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image.JPG new file mode 100644 index 0000000000000000000000000000000000000000..29bd746fee2f280b5a97640c3c91125bb0934ca1 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image_1.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image_1.png new file mode 100644 index 0000000000000000000000000000000000000000..8b474587838c8cc696fc7747dfe9b1c70f80dc2d Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/image_1.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/img_1.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/img_1.JPG new file mode 100644 index 0000000000000000000000000000000000000000..461eda6a6847cb09d9d6569a4258009d414610e8 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/img_1.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/mountain.jpg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/mountain.jpg new file mode 100644 index 0000000000000000000000000000000000000000..3c244ab4218031e18dd0069e240e558622924668 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/mountain.jpg differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/r.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/r.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cd3fef02a58cabe165cb12fde35cb4c249afa5a4 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/r.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sky.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sky.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sky.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/startIcon.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/startIcon.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sun.jpg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sun.jpg new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/sun.jpg differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/test.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/test.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/test.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImage.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImage.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImage.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImg.jpg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImg.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testImg.jpg differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG new file mode 100644 index 0000000000000000000000000000000000000000..e2e542fcde54adf541a680c384bf8477b41548eb Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image1.jpg b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image1.jpg differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image2.png b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image2.png new file mode 100644 index 0000000000000000000000000000000000000000..af8d4c98a86f23a41841d07b74636926a17d1c89 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/transition_image2.png differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/tree.JPG b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/tree.JPG new file mode 100644 index 0000000000000000000000000000000000000000..bdad6db5558c4190bccb951489e8bc67fc0ababe Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/media/tree.JPG differ diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/backup_config.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/backup_config.json new file mode 100644 index 0000000000000000000000000000000000000000..78f40ae7c494d71e2482278f359ec790ca73471a --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/backup_config.json @@ -0,0 +1,3 @@ +{ + "allowToBackupRestore": true +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/main_pages.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/main_pages.json new file mode 100644 index 0000000000000000000000000000000000000000..3ec03f97d5d6d11b3ca3d50ab362fceebce1e460 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/base/profile/main_pages.json @@ -0,0 +1,43 @@ +{ + "src": [ + "pages/Index", + "pages/animateTo/template1/Index", + "pages/animateTo/template2/Index", + "pages/animateTo/template3/Index", + "pages/animation/template1/Index", + "pages/animation/template2/Index", + "pages/animation/template3/Index", + "pages/animation/template4/Index", + "pages/animator/template1/Index", + "pages/animator/template2/Index", + "pages/animator/template3/Index", + "pages/particle/template1/Index", + "pages/particle/template2/Index", + "pages/particle/template3/Index", + "pages/particle/template4/Index", + "pages/particle/template5/Index", + "pages/particle/template6/Index", + "pages/keyframeAnimateTo/template1/Index", + "pages/pageTransition/template1/Index", + "pages/pageTransition/template1/Page1", + "pages/pageTransition/template2/Index", + "pages/pageTransition/template2/Page1", + "pages/pageTransition/template3/pageTransitionDst1", + "pages/pageTransition/template3/pageTransitionSrc1", + "pages/pageTransition/template4/pageTransitionDst2", + "pages/pageTransition/template4/pageTransitionSrc2", + "pages/compTransition/template1/Index", + "pages/compTransition/template2/Index", + "pages/compTransition/template3/Index", + "pages/compTransition/template4/Index", + "pages/compTransition/template5/Index", + "pages/shareTransition/template1/Index", + "pages/shareTransition/template1/PageB", + "pages/motionPath/template1/Index", + "pages/animateToImmediately/template1/Index", + "pages/rotation/template1/Index", + "pages/rotation/template2/Index", + "pages/cohesion/template1/Index", + "pages/cohesion/template2/Index" + ] +} diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/dark/element/color.json b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/dark/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..79b11c2747aec33e710fd3a7b2b3c94dd9965499 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/main/resources/dark/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#000000" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/mock/mock-config.json5 b/code/DocsSample/ArkUISample/Animation/entry/src/mock/mock-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..7a73a41bfdf76d6f793007240d80983a52f15f97 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/mock/mock-config.json5 @@ -0,0 +1,2 @@ +{ +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Ability.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Ability.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..aed4de76e80ab8b0faebfb534695eec8911ad966 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Ability.test.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function abilityTest() { + describe('ActsAbilityTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }) + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }) + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }) + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }) + /* + * @tc.number: Animation_assertContain + * @tc.name: Test ability + * @tc.desc: Test ability + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + hilog.info(0x0000, 'testTag', '%{public}s', 'it begin'); + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + hilog.info(0x0000, 'testTag', '%{public}s', 'it end'); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateTo.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateTo.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..77b70639c521d91c92f3d33abd8469d0755dfc45 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateTo.test.ets @@ -0,0 +1,114 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function AnimateToTest() { + describe('Animation_AnimateToTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.animate_to_label')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_AnimateToTest_001 + * @tc.name: Set animate + * @tc.desc: Set animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimateToTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.animate_to_temp_label1')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change size')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_001_end'); + }) + + /* + * @tc.number: Animation_AnimateToTest_002 + * @tc.name: component disappear in animate + * @tc.desc: component disappear in animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimateToTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.animate_to_temp_label2')))); + await aimComponent.click(); + await driver.delayMs(1000); + + let columns = await driver.findComponents(ON.type('Column')) + await columns[1].click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_002_end'); + }) + + /* + * @tc.number: Animation_AnimateToTest_003 + * @tc.name: Set animate in componentV2 + * @tc.desc: Set animate in componentV2 + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimateToTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.animate_to_temp_label3')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change size')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimateToTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateToImmediately.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateToImmediately.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..c96cf0018a67be47b7659442c3cd2844ddd7551d --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/AnimateToImmediately.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function AnimateToImmediatelyTest() { + describe('Animation_AnimateToImmediatelyTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animateToImmediately_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_AnimateToImmediatelyTest_001 + * @tc.name: Set animate Immediately + * @tc.desc: Set animate Immediately + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimateToImmediatelyTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimateToImmediatelyTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.temp1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change size')); + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimateToImmediatelyTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animation.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animation.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..2af2bf3a5b62377950038e0009781f2d683ef816 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animation.test.ets @@ -0,0 +1,138 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function AnimationTest() { + describe('Animation_AnimationTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animation_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_AnimationTest_001 + * @tc.name: Set attribute animate use animation + * @tc.desc: Set attribute animate use animation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimationTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.temp1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change size')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change rotate angle')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_001_end'); + }) + + /* + * @tc.number: Animation_AnimationTest_002 + * @tc.name: Set attribute animate use animationTo + * @tc.desc: Set attribute animate use animationTo + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimationTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animation_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Column')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_002_end'); + }) + + /* + * @tc.number: Animation_AnimationTest_003 + * @tc.name: Set attribute animate use animation + * @tc.desc: Set attribute animate use animation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimationTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animation_temp_label3")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Column')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_003_end'); + }) + + /* + * @tc.number: Animation_AnimationTest_004 + * @tc.name: Set attribute animate use keyframeAnimateTo + * @tc.desc: Set attribute animate use keyframeAnimateTo + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimationTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animation_temp_label4")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Column')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_AnimationTest_004_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animator.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animator.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..7192e0ba46fb723f088b8a85b3fff0db0c979c9f --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Animator.test.ets @@ -0,0 +1,170 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function AnimatorTest() { + describe('Animation_AnimatorTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animator_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_AnimatorTest_001 + * @tc.name: Set frame animate in arkTs + * @tc.desc: Set frame animate in arkTs + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimatorTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animator_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('create')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('play')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pause')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('finish')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('reverse')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('play')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('cancel')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('reset')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('play')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_001_end'); + }) + + /* + * @tc.number: Animation_AnimatorTest_002 + * @tc.name: Set frame animate + * @tc.desc: Set frame animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimatorTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animator_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('create')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('play')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('reset')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('play')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_002_end'); + }) + + /* + * @tc.number: Animation_AnimatorTest_003 + * @tc.name: Show ball moving with frame animate + * @tc.desc: Show ball moving with frame animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'AnimatorTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.animator_temp_label3")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.play')))); + await aimComponent.click(); + await driver.delayMs(5000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.reset')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.play')))); + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.pause')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Animation_AnimatorTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Cohesion.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Cohesion.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..92f43ce2dd1aa18b0b5c8ac1af2a5008bcc3a630 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Cohesion.test.ets @@ -0,0 +1,96 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function CohesionTest() { + describe('Animation_CohesionTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.cohesion_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_CohesionTest_001 + * @tc.name: Set Cohesion animate + * @tc.desc: Set Cohesion animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'CohesionTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_CohesionTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.cohesion_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Click')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Animation_CohesionTest_001_end'); + }) + + /* + * @tc.number: Animation_CohesionTest_002 + * @tc.name: Set Cohesion animate with gesture + * @tc.desc: Set Cohesion animate with gesture + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'CohesionTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_CohesionTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.cohesion_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let x = Math.floor(size.x * 0.284) + + await driver.swipe(x, Math.floor(size.y * 0.2013), x, Math.floor(size.y * 0.5544)); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Animation_CohesionTest_002_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ComponentTransition.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ComponentTransition.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..366862440cc398fcc11a478018bfa0ea5a42e835 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ComponentTransition.test.ets @@ -0,0 +1,174 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function ComponentTransitionTest() { + describe('Animation_ComponentTransitionTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_ComponentTransitionTest_001 + * @tc.name: Set image animate with one api + * @tc.desc: Set image animate with one api + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ComponentTransitionTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('show')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('hide')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_001_end'); + }) + + /* + * @tc.number: Animation_ComponentTransitionTest_002 + * @tc.name: Set image animate with different api + * @tc.desc: Set image animate with different api + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ComponentTransitionTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('show')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('hide')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_002_end'); + }) + + /* + * @tc.number: Animation_ComponentTransitionTest_003 + * @tc.name: Set Parent component transition + * @tc.desc: Set Parent component transition + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ComponentTransitionTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_temp_label3")))); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('show')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('hide')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_003_end'); + }) + + /* + * @tc.number: Animation_ComponentTransitionTest_004 + * @tc.name: Transition in show and disappear + * @tc.desc: Transition in show and disappear + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ComponentTransitionTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_temp_label4")))); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('Click')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('Click')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_004_end'); + }) + + /* + * @tc.number: Animation_ComponentTransitionTest_005 + * @tc.name: Show components and disappear + * @tc.desc: Show components and disappear + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ComponentTransitionTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.compTransition_temp_label5")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.type('root')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ComponentTransitionTest_005_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/KeyFrameAnimateTo.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/KeyFrameAnimateTo.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..21c1ff6bf3195aaa8a4bbb1d1c9532a2a1529e4c --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/KeyFrameAnimateTo.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function KeyFrameAnimateToTest() { + describe('Animation_KeyFrameAnimateToTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.keyframeAnimateTo_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_KeyFrameAnimateToTest_001 + * @tc.name: Set keyFrameAnimate + * @tc.desc: Set keyFrameAnimate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'KeyFrameAnimateToTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_KeyFrameAnimateToTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.temp1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Circle')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_KeyFrameAnimateToTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/List.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..07ec779dd0efc1492add195b6cb32db00c3b6821 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/List.test.ets @@ -0,0 +1,41 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AnimateToTest } from './AnimateTo.test'; +import { AnimationTest } from './Animation.test'; +import { CohesionTest } from './Cohesion.test'; +import { KeyFrameAnimateToTest } from './KeyFrameAnimateTo.test'; +import { PageTransitionTest } from './PageTransition.test'; +import { ComponentTransitionTest } from './ComponentTransition.test'; +import { ShareTransitionTest } from './ShareTransition.test'; +import { MotionPathTest } from './MotionPath.test'; +import { ParticleTest } from './Particle.test'; +import { AnimatorTest } from './Animator.test'; +import { AnimateToImmediatelyTest } from './AnimateToImmediately.test'; +import { RotationTest } from './Rotation.test'; + +export default function testsuite() { + AnimateToTest(); + AnimationTest(); + CohesionTest(); + KeyFrameAnimateToTest(); + PageTransitionTest(); + ComponentTransitionTest(); + ShareTransitionTest(); + MotionPathTest(); + ParticleTest(); + AnimatorTest(); + AnimateToImmediatelyTest(); + RotationTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/MotionPath.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/MotionPath.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..60eede8e336a3854be774d46ac5592f0173cc637 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/MotionPath.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function MotionPathTest() { + describe('Animation_MotionPathTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.motionPath_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_MotionPathTest_001 + * @tc.name: Set motionPath + * @tc.desc: Set motionPath + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'MotionPathTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_MotionPathTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.temp1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('click me')); + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_MotionPathTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/PageTransition.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/PageTransition.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..c3fff5d9cb140f2dbcdc7a7ed8da7e141537e867 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/PageTransition.test.ets @@ -0,0 +1,142 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function PageTransitionTest() { + describe('Animation_PageTransitionTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.pageTransition_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_PageTransitionTest_001 + * @tc.name: Set pageTransition + * @tc.desc: Set pageTransition + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'PageTransitionTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.pageTransition_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_001_end'); + }) + + /* + * @tc.number: Animation_PageTransitionTest_002 + * @tc.name: Set move effect + * @tc.desc: Set move effect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'PageTransitionTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.pageTransition_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.page1')))); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r('app.string.page2')))); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_002_end'); + }) + + /* + * @tc.number: Animation_PageTransitionTest_003 + * @tc.name: Set pageTransition with pushUrl + * @tc.desc: Set pageTransition with pushUrl + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'PageTransitionTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.pageTransition_temp_label3")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushUrl')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('back')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_003_end'); + }) + + /* + * @tc.number: Animation_PageTransitionTest_004 + * @tc.name: Set none type pageTransition + * @tc.desc: Set none type pageTransition + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'PageTransitionTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.pageTransition_temp_label4")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushUrl')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('back')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_PageTransitionTest_004_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Particle.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Particle.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..0234306984dcf8672dbeaaef77dd267f9a3af85f --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Particle.test.ets @@ -0,0 +1,186 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function ParticleTest() { + describe('Animation_ParticleTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_ParticleTest_001 + * @tc.name: Set circle particle + * @tc.desc: Set circle particle + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 20; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_001_end'); + }) + + /* + * @tc.number: Animation_ParticleTest_002 + * @tc.name: Set image particle + * @tc.desc: Set image particle + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 20; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_002_end'); + }) + + /* + * @tc.number: Animation_ParticleTest_003 + * @tc.name: Set particle animate + * @tc.desc: Set particle animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label3")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 20; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_003_end'); + }) + + /* + * @tc.number: Animation_ParticleTest_004 + * @tc.name: Set particle position + * @tc.desc: Set particle position + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label4")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 10; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_004_end'); + }) + + /* + * @tc.number: Animation_ParticleTest_005 + * @tc.name: Create circle launcher + * @tc.desc: Create circle launcher + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label5")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 10; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_005_end'); + }) + + /* + * @tc.number: Animation_ParticleTest_006 + * @tc.name: Update circle launcher + * @tc.desc: Update circle launcher + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ParticleTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.particle_temp_label6")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + for (let index = 0; index < 10; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'Animation_ParticleTest_006_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Rotation.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Rotation.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..d0dfda62ca99569dc819c8652eef5580b9b5b2f5 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/Rotation.test.ets @@ -0,0 +1,96 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, DisplayRotation, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function RotationTest() { + describe('Animation_RotationTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.rotation_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_RotationTest_001 + * @tc.name: Set rotate animate + * @tc.desc: Set rotate animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'RotationTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_RotationTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.rotation_temp_label1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.setDisplayRotation(DisplayRotation.ROTATION_90) + await driver.delayMs(1000); + await driver.setDisplayRotation(DisplayRotation.ROTATION_0) + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Animation_RotationTest_001_end'); + }) + + /* + * @tc.number: Animation_RotationTest_002 + * @tc.name: Set rotate animate with opacity + * @tc.desc: Set rotate animate with opacity + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'RotationTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_RotationTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.rotation_temp_label2")))); + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.setDisplayRotation(DisplayRotation.ROTATION_90) + await driver.delayMs(1000); + await driver.setDisplayRotation(DisplayRotation.ROTATION_0) + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Animation_RotationTest_002_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ShareTransition.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ShareTransition.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..ee41e1c9de7eb37557a0f418eb5c3f07fdb5b251 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/ets/test/ShareTransition.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import resource from '../../../main/ets/common/resource'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Animation_' +const TAG = '[Sample_Animation]'; +const DOMAIN = 0xF811 + +let aimComponent : Component + +export function ShareTransitionTest() { + describe('Animation_ShareTransitionTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.animation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.shareTransition_label")))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('AnimateIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Animation_ShareTransitionTest_001 + * @tc.name: Set share transition animate + * @tc.desc: Set share transition animate + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ShareTransitionTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Animation_ShareTransitionTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resource.resourceToString($r("app.string.temp1")))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('root')); + await aimComponent.click(); + await driver.delayMs(3000); + hilog.info(DOMAIN, TAG, 'Animation_ShareTransitionTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/module.json5 b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..1cafc28b86d7d9f2b34f24d26a75c0dbd7299715 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/ohosTest/module.json5 @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry_test", + "type": "feature", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false + } +} diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/test/List.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..a60c87c5cbb0badf7c3fd8975034590e6fafa992 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/test/List.test.ets @@ -0,0 +1,19 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import localUnitTest from './LocalUnit.test'; + +export default function testsuite() { + localUnitTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/entry/src/test/LocalUnit.test.ets b/code/DocsSample/ArkUISample/Animation/entry/src/test/LocalUnit.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..841bfd77e56060e50ec0924302a5ae624e76e3aa --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/entry/src/test/LocalUnit.test.ets @@ -0,0 +1,47 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function localUnitTest() { + describe('localUnitTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }); + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }); + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }); + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }); + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + }); + }); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Animation/hvigor/hvigor-config.json5 b/code/DocsSample/ArkUISample/Animation/hvigor/hvigor-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..a3a86df0cd5b8fbf375409dc5825e13202ab2284 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/hvigor/hvigor-config.json5 @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "6.0.0", + "dependencies": { + }, + "execution": { + // "analyze": "normal", /* Define the build analyze mode. Value: [ "normal" | "advanced" | false ]. Default: "normal" */ + // "daemon": true, /* Enable daemon compilation. Value: [ true | false ]. Default: true */ + // "incremental": true, /* Enable incremental compilation. Value: [ true | false ]. Default: true */ + // "parallel": true, /* Enable parallel compilation. Value: [ true | false ]. Default: true */ + // "typeCheck": false, /* Enable typeCheck. Value: [ true | false ]. Default: false */ + }, + "logging": { + // "level": "info" /* Define the log level. Value: [ "debug" | "info" | "warn" | "error" ]. Default: "info" */ + }, + "debugging": { + // "stacktrace": false /* Disable stacktrace compilation. Value: [ true | false ]. Default: false */ + }, + "nodeOptions": { + // "maxOldSpaceSize": 8192 /* Enable nodeOptions maxOldSpaceSize compilation. Unit M. Used for the daemon process. Default: 8192*/ + // "exposeGC": true /* Enable to trigger garbage collection explicitly. Default: true*/ + } +} diff --git a/code/DocsSample/ArkUISample/Animation/hvigorfile.ts b/code/DocsSample/ArkUISample/Animation/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..6b365cacd0191d3b1178eb6b9807b1ae0add6271 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { appTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: appTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/Animation/oh-package.json5 b/code/DocsSample/ArkUISample/Animation/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..41b8b63948628728b745e7be8cd53d68d9345b75 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "6.0.0", + "description": "Please describe the basic information.", + "dependencies": { + }, + "devDependencies": { + "@ohos/hypium": "1.0.21", + "@ohos/hamock": "1.0.0" + } +} diff --git a/code/DocsSample/ArkUISample/Animation/ohosTest.md b/code/DocsSample/ArkUISample/Animation/ohosTest.md new file mode 100644 index 0000000000000000000000000000000000000000..5e4a5cff507f79631563b306640e95c002d7ca79 --- /dev/null +++ b/code/DocsSample/ArkUISample/Animation/ohosTest.md @@ -0,0 +1,18 @@ +# Animation 测试用例归档 + +## 用例表 + +| 测试功能 | 预置条件 | 输入 | 预期输出 | 是否自动 | 测试结果 | +| ------------------- | -------------- | ----------------------- | ------------------------------------------------------------ | :------- | -------- | +| 显示动画示例代码验证 | 设备正常运行 | 进入各个示例代码页面，触发不同的动画效果 | 动画效果正常 | 是 | Pass | +| 显式动画立即下发示例代码验证 | 设备正常运行 | 点击各种动画按钮，触发不同的动画效果 | 动画效果正常 | 是 | Pass | +| 属性动画（animation）示例代码测试代码 | 设备正常运行 | 点击页面，触发属性动画效果 | 动画效果正常 | 是 | Pass | +| 帧动画示例代码验证 | 设备正常运行 | 点击目标组件，触发动画效果 | 动画效果正常 | 是 | Pass | +| 动画衔接示例代码验证 | 设备正常运行 | 点击Click按钮 | 控件缩放的动画效果正常 | 是 | Pass | +| 组件内转场示例代码验证 | 设备正常运行 | 点击show按钮 | 动画效果正常 | 是 | Pass | +| 关键帧动画示例代码测试代码 | 设备正常运行 | 点击目标组件，触发动画效果 | 动画效果正常 | 是 | Pass | +| 路径动画示例代码测试代码 | 设备正常运行 | 点击目标组件，触发路径动画效果 | 动画效果正常 | 是 | Pass | +| 页面间转场示例代码测试代码 | 设备正常运行 | 点击目标组件，触发页面转场动画效果 | 动画效果正常 | 是 | Pass | +| 粒子动画示例代码验证 | 设备正常运行 | 点击各种动画按钮，触发不同的动画效果 | 动画效果正常 | 是 | Pass | +| 旋转屏动画示例代码验证 | 设备正常运行 | 旋转屏幕 | 目标控件的动画效果正常 | 否 | Pass | +| 共享元素转场示例代码验证 | 设备正常运行 | 点击页面触发动画 | 动画效果正常 | 是 | Pass | diff --git a/code/DocsSample/ArkUISample/Animation/screenshots/device/image1.png b/code/DocsSample/ArkUISample/Animation/screenshots/device/image1.png new file mode 100644 index 0000000000000000000000000000000000000000..21beca22c8e570fa4534a29e9b60402c53adf0b6 Binary files /dev/null and b/code/DocsSample/ArkUISample/Animation/screenshots/device/image1.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/.gitignore b/code/DocsSample/ArkUISample/BindSheet/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..d2ff20141ceed86d87c0ea5d99481973005bab2b --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/.gitignore @@ -0,0 +1,12 @@ +/node_modules +/oh_modules +/local.properties +/.idea +**/build +/.hvigor +.cxx +/.clangd +/.clang-format +/.clang-tidy +**/.test +/.appanalyzer \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/AppScope/app.json5 b/code/DocsSample/ArkUISample/BindSheet/AppScope/app.json5 new file mode 100644 index 0000000000000000000000000000000000000000..867532eb9a552b283ee74bd5fc009dec4733a4fa --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/AppScope/app.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "bundleName": "com.samples.bindsheet", + "vendor": "example", + "versionCode": 1000000, + "versionName": "1.0.0", + "icon": "$media:layered_image", + "label": "$string:app_name" + } +} diff --git a/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/element/string.json b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..53a288c841496a30f98c0bf0d583722c7d91fa09 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/element/string.json @@ -0,0 +1,8 @@ +{ + "string": [ + { + "name": "app_name", + "value": "BindSheet" + } + ] +} diff --git a/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/background.png b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/AppScope/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/README_zh.md b/code/DocsSample/ArkUISample/BindSheet/README_zh.md new file mode 100644 index 0000000000000000000000000000000000000000..2aea995151dd39ba9440cd8ae64631d892a97810 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/README_zh.md @@ -0,0 +1,114 @@ +# ArkUI使用模态组件指南文档示例 + +### 介绍 + +本示例通过使用[ArkUI指南文档](https://gitee.com/openharmony/docs/tree/master/zh-cn/application-dev/ui)中各场景的开发示例，展示在工程中，帮助开发者更好地理解ArkUI提供的组件及组件属性并合理使用。该工程中展示的代码详细描述可查如下链接： + +1. [全模态转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-modal-transition.md)。 +2. [半模态转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-sheet-transition.md)。 +3. [命令式打开半模态](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-arkui-UIContext.md#openbindsheet12)。 +4. [模态转场](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-modal-transition.md)。 +5. [绑定全模态页面](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-contentcover-page.md)。 + +### 效果预览 + +| 首页 | +|------------------------------------| +| ![](screenshots/device/image1.png) | + +### 使用说明 + +1. 在主界面，可以点击对应卡片，选择需要参考的组件示例。 + +2. 在组件目录选择详细的示例参考。 + +3. 进入示例界面，查看参考示例。 + +4. 通过自动测试框架可进行测试及维护。 + +### 工程目录 +``` +entry/src/main/ets/ +|---entryability +|---pages +| |---bindContentCover // 全模态转场 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| | |---template5 +| | | |---Index.ets +| | |---template6 +| | | |---Index.ets +| | |---template7 +| | | |---Index.ets +| |---bindSheet // 半模态转场 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| | |---template5 +| | | |---Index.ets +| | |---template6 +| | | |---Index.ets +| | |---template7 +| | | |---Index.ets +| | |---template8 +| | | |---Index.ets +| | |---template9 +| | | |---Index.ets +| | |---template10 +| | | |---Index.ets +| |---bindSheetCmd // 命令式打开半模态 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +|---pages +| |---Index.ets // 应用主页面 +entry/src/ohosTest/ +|---ets +| |---test +| | |---BindContentCover.test.ets // 全模态转场示例代码测试代码 +| | |---BindSheet.test.ets // 半模态转场示例代码测试代码 +| | |---OpenSheet.test.ets // 命令式打开半模态示例代码测试代码 + +``` + +### 相关权限 + +不涉及。 + +### 依赖 + +不涉及。 + +### 约束与限制 + +1.本示例仅支持标准系统上运行, 支持设备：RK3568。 + +2.本示例为Stage模型，支持API20版本SDK，版本号：6.0.0.33，镜像版本号：OpenHarmony_6.0.0.33。 + +3.本示例需要使用DevEco Studio 6.0.0 Canary1 (Build Version: 6.0.0.270， built on May 9, 2025)及以上版本才可编译运行。 + +### 下载 + +如需单独下载本工程，执行如下命令： + +```` +git init +git config core.sparsecheckout true +echo code/DocsSample/ArkUIDocSample/BindSheet > .git/info/sparse-checkout +git remote add origin https://gitee.com/openharmony/applications_app_samples.git +git pull origin master +```` \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/build-profile.json5 b/code/DocsSample/ArkUISample/BindSheet/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..e1244ceecbe969910aa0eb4f5ec4543c58ee4225 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/build-profile.json5 @@ -0,0 +1,56 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "signingConfigs": [], + "products": [ + { + "name": "default", + "signingConfig": "default", + "targetSdkVersion": "20", + "compatibleSdkVersion": "20", + "runtimeOS": "OpenHarmony", + "buildOption": { + "strictMode": { + "caseSensitiveCheck": true, + "useNormalizedOHMUrl": true + } + } + } + ], + "buildModeSet": [ + { + "name": "debug", + }, + { + "name": "release" + } + ] + }, + "modules": [ + { + "name": "entry", + "srcPath": "./entry", + "targets": [ + { + "name": "default", + "applyToProducts": [ + "default" + ] + } + ] + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/code-linter.json5 b/code/DocsSample/ArkUISample/BindSheet/code-linter.json5 new file mode 100644 index 0000000000000000000000000000000000000000..5c4682f8164874ec7e9cb8f99ff8b3228ffbc126 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/code-linter.json5 @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "files": [ + "**/*.ets" + ], + "ignore": [ + "**/src/ohosTest/**/*", + "**/src/test/**/*", + "**/src/mock/**/*", + "**/node_modules/**/*", + "**/oh_modules/**/*", + "**/build/**/*", + "**/.preview/**/*" + ], + "ruleSet": [ + "plugin:@performance/recommended", + "plugin:@typescript-eslint/recommended" + ], + "rules": { + "@security/no-unsafe-aes": "error", + "@security/no-unsafe-hash": "error", + "@security/no-unsafe-mac": "warn", + "@security/no-unsafe-dh": "error", + "@security/no-unsafe-dsa": "error", + "@security/no-unsafe-ecdsa": "error", + "@security/no-unsafe-rsa-encrypt": "error", + "@security/no-unsafe-rsa-sign": "error", + "@security/no-unsafe-rsa-key": "error", + "@security/no-unsafe-dsa-key": "error", + "@security/no-unsafe-dh-key": "error", + "@security/no-unsafe-3des": "error" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/.gitignore b/code/DocsSample/ArkUISample/BindSheet/entry/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..e2713a2779c5a3e0eb879efe6115455592caeea5 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/.gitignore @@ -0,0 +1,6 @@ +/node_modules +/oh_modules +/.preview +/build +/.cxx +/.test \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/build-profile.json5 b/code/DocsSample/ArkUISample/BindSheet/entry/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..982dbb524bd63408e05cfbed7204dd87a31dd681 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/build-profile.json5 @@ -0,0 +1,42 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "apiType": "stageMode", + "buildOption": { + }, + "buildOptionSet": [ + { + "name": "release", + "arkOptions": { + "obfuscation": { + "ruleOptions": { + "enable": false, + "files": [ + "./obfuscation-rules.txt" + ] + } + } + } + }, + ], + "targets": [ + { + "name": "default" + }, + { + "name": "ohosTest", + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/hvigorfile.ts b/code/DocsSample/ArkUISample/BindSheet/entry/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..8774588471ede4c1563f09d9a1d22f764bb1fd9e --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hapTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/obfuscation-rules.txt b/code/DocsSample/ArkUISample/BindSheet/entry/obfuscation-rules.txt new file mode 100644 index 0000000000000000000000000000000000000000..272efb6ca3f240859091bbbfc7c5802d52793b0b --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/obfuscation-rules.txt @@ -0,0 +1,23 @@ +# Define project specific obfuscation rules here. +# You can include the obfuscation configuration files in the current module's build-profile.json5. +# +# For more details, see +# https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/source-obfuscation-V5 + +# Obfuscation options: +# -disable-obfuscation: disable all obfuscations +# -enable-property-obfuscation: obfuscate the property names +# -enable-toplevel-obfuscation: obfuscate the names in the global scope +# -compact: remove unnecessary blank spaces and all line feeds +# -remove-log: remove all console.* statements +# -print-namecache: print the name cache that contains the mapping from the old names to new names +# -apply-namecache: reuse the given cache file + +# Keep options: +# -keep-property-name: specifies property names that you want to keep +# -keep-global-name: specifies names that you want to keep in the global scope + +-enable-property-obfuscation +-enable-toplevel-obfuscation +-enable-filename-obfuscation +-enable-export-obfuscation \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/oh-package.json5 b/code/DocsSample/ArkUISample/BindSheet/entry/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..10cda399b0aec3099b257299a57d284393e4e55a --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "name": "entry", + "version": "1.0.0", + "description": "Please describe the basic information.", + "main": "", + "author": "", + "license": "", + "dependencies": {} +} + diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entryability/EntryAbility.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entryability/EntryAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..081b700cacec6def24d204fbc37ab93985f7b4ec --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entryability/EntryAbility.ets @@ -0,0 +1,95 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AbilityConstant, ConfigurationConstant, UIAbility, Want } from '@kit.AbilityKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { display, uiObserver, window } from '@kit.ArkUI'; + +const DOMAIN = 0x0000; + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +function callBackFunc2(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag2 navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +export default class EntryAbility extends UIAbility { + onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { + this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onCreate'); + uiObserver.on('navDestinationSwitch', this.context, callBackFunc); + uiObserver.on('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc2); + } + + onDestroy(): void { + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onDestroy'); + uiObserver.off('navDestinationSwitch', this.context, callBackFunc); + uiObserver.off('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc); + } + + onWindowStageCreate(windowStage: window.WindowStage): void { + // Main window is created, set main page for this ability + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); + let mainWindow: window.Window; + try { + mainWindow = windowStage.getMainWindowSync(); + let displayClass: display.Display = display.getDefaultDisplaySync(); + AppStorage.setOrCreate('orientation', displayClass.orientation); + // 监听窗口的windowsSizeChange事件，旋转屏时会触发该事件 + mainWindow.on('windowSizeChange', (data) => { + console.info('Succeeded in enabling the listener for window size changes. Data: ' + JSON.stringify(data)); + let displayClass: display.Display | null = null; + try { + displayClass = display.getDefaultDisplaySync(); + console.info('display orientation is ' + JSON.stringify(displayClass.orientation)); + // 获取屏幕的显示方向 + AppStorage.set('orientation', displayClass.orientation); + } catch { + return; + } + }) + } catch { + hilog.info(0x0000, 'testTag', '%{public}s', 'error'); + return; + } + windowStage.loadContent('pages/Index', (err) => { + if (err.code) { + hilog.error(DOMAIN, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err)); + return; + } + hilog.info(DOMAIN, 'testTag', 'Succeeded in loading the content.'); + }); + } + + onWindowStageDestroy(): void { + // Main window is destroyed, release UI related resources + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); + } + + onForeground(): void { + // Ability has brought to foreground + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onForeground'); + } + + onBackground(): void { + // Ability has back to background + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onBackground'); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..4ce6449f0e91914e73d4502c9f2e8e9a395ea4b1 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets @@ -0,0 +1,30 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { BackupExtensionAbility, BundleVersion } from '@kit.CoreFileKit'; + +const DOMAIN = 0x0000; + +export default class EntryBackupAbility extends BackupExtensionAbility { + async onBackup() { + hilog.info(DOMAIN, 'testTag', 'onBackup ok'); + await Promise.resolve(); + } + + async onRestore(bundleVersion: BundleVersion) { + hilog.info(DOMAIN, 'testTag', 'onRestore ok %{public}s', JSON.stringify(bundleVersion)); + await Promise.resolve(); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..f66347f114c366fe07800c07dfcaee6694ce1482 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/Index.ets @@ -0,0 +1,181 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import curves from '@ohos.curves'; +import { Route, RouteGroup } from './common/Index'; +import { KeyboardAvoidMode } from '@kit.ArkUI'; +import router from '@ohos.router'; + +@Styles +function cardPressedStyle() { + .backgroundColor('rgba(0,0,0,0.1)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardNormalStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardDisabledStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(0.5) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + + +@Entry +@Component +struct Index { + @Provide('router') router: NavPathStack = new NavPathStack(); + @State routes: RouteGroup[] = [ + { + name: "bindContentCover", + label: $r('app.string.bindContentCover_label'), + children: [ + { name:"template1/Index", label: $r('app.string.bindContentCover_label1') }, + { name:"template2/Index", label: $r('app.string.bindContentCover_label2') }, + { name:"template3/Index", label: $r('app.string.bindContentCover_label3') }, + { name:"template4/Index", label: $r('app.string.bindContentCover_label4') }, + { name:"template5/Index", label: $r('app.string.bindContentCover_label5') }, + { name:"template6/Index", label: $r('app.string.bindContentCover_label6') }, + { name:"template7/Index", label: $r('app.string.bindContentCover_label7') }, + + ] + }, { + name: "bindSheet", + label: $r('app.string.bindSheet_label'), + children: [ + { name:"template1/Index", label: $r('app.string.bindSheet_label1') }, + { name:"template2/Index", label: $r('app.string.bindSheet_label2') }, + { name:"template3/Index", label: $r('app.string.bindSheet_label3') }, + { name:"template4/Index", label: $r('app.string.bindSheet_label4') }, + { name:"template5/Index", label: $r('app.string.bindSheet_label5') }, + { name:"template6/Index", label: $r('app.string.bindSheet_label6') }, + { name:"template7/Index", label: $r('app.string.bindSheet_label7') }, + { name:"template8/Index", label: $r('app.string.bindSheet_label8') }, + { name:"template9/Index", label: $r('app.string.bindSheet_label9') }, + { name:"template10/Index", label: $r('app.string.bindSheet_label10') }, + ] + }, { + name: "bindSheetCmd", + label: $r('app.string.bindSheetCmd_label'), + children: [ + { name:"template1/Index", label: $r('app.string.bindSheetCmd_label1') }, + { name:"template2/Index", label: $r('app.string.bindSheetCmd_label2') }, + { name:"template3/Index", label: $r('app.string.bindSheetCmd_label3') }, + ] + } + ]; + @State selection: string | null = null; + + @Builder + ListItemGroupHeader(route: RouteGroup) { + Row() { + Text(route.label) + .fontColor($r('sys.color.ohos_id_color_text_primary')) + .fontWeight(FontWeight.Medium) + + Blank() + + Text(`${route.children.length}`) + .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .opacity(this.selection === route.name ? 0 : 1) + + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + .rotate({ angle: this.selection === route.name ? 90 : 0 }) + .animation({ curve: curves.interpolatingSpring(0, 1, 228, 30) }) + } + .borderRadius(20) + .width('100%') + .padding(8) + .enabled(!!route.children.length) + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .onClick(() => { + animateTo( + { curve: curves.interpolatingSpring(0, 1, 228, 25) }, + () => { + if (this.selection === route.name) { + this.selection = null; + } else { + this.selection = route.name; + } + }); + }) + } + + aboutToAppear(): void{ + this.getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE); + } + build() { + Column() { + Text('Index') + List() { + ForEach(this.routes, (routeGroup: RouteGroup) => { + ListItemGroup({ + header: this.ListItemGroupHeader(routeGroup), + style: ListItemGroupStyle.CARD, + }) { + if (routeGroup.name === this.selection) { + ForEach(routeGroup.children, (route: Route) => { + ListItem() { + Row() { + Text(route.label).fontSize(16) + Blank() + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + } + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .borderRadius(20) + .padding(8) + .transition( + TransitionEffect.OPACITY.animation({ + curve: curves.interpolatingSpring(0, 1, 228, 30) + }) + ) + .width('100%') + .onClick(() => { + const name = `pages/${routeGroup.name}/${route.name}`; + router.pushUrl({url: name}) + }) + } + .width('100%') + }) + } + } + .padding(2) + .divider({ strokeWidth: 0.5 }) + }) + }.padding({bottom: 10}) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template1/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..925dcbbfd91be7aad5e144c0daa75e6710d25e8b --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template1/Index.ets @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ModalTransitionExample { + @State isShow: boolean = false; + @State isShow2: boolean = false; + + @Builder + myBuilder2() { + Column() { + Button("close modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = false; + }) + } + .width('100%') + .height('100%') + } + + @Builder + myBuilder() { + Column() { + Button("transition modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = true; + }).bindContentCover(this.isShow2, this.myBuilder2(), { + modalTransition: ModalTransition.NONE, + backgroundColor: Color.Orange, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + + Button("close modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindContentCover(this.isShow, this.myBuilder(), { + modalTransition: ModalTransition.NONE, + backgroundColor: Color.Pink, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .backgroundColor("#ff49c8ab") + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template2/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..475d8793a3084697d707d7e05fb3a848b47d8a15 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template2/Index.ets @@ -0,0 +1,118 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct ModalTransitionExample2 { + @State @Watch("isShow1Change") isShow: boolean = false; + @State @Watch("isShow2Change") isShow2: boolean = false; + @State isScale1: number = 1; + @State isScale2: number = 1; + + isShow1Change() { + this.isShow ? this.isScale1 = 0.95 : this.isScale1 = 1; + } + + isShow2Change() { + this.isShow2 ? this.isScale2 = 0.95 : this.isScale2 = 1; + } + + @Builder + myBuilder2() { + Column() { + Button("close modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = false; + }) + } + .width('100%') + .height('100%') + } + + @Builder + myBuilder() { + Column() { + Button("transition modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = true; + }).bindContentCover(this.isShow2, this.myBuilder2(), { + modalTransition: ModalTransition.NONE, + backgroundColor: Color.Orange, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + + Button("close modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + .scale({ x: this.isScale2, y: this.isScale2 }) + .animation({ curve: curves.springMotion() }) + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindContentCover(this.isShow, this.myBuilder(), { + modalTransition: ModalTransition.NONE, + backgroundColor: Color.Pink, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .backgroundColor("#ff49c8ab") + .width('100%') + .height('100%') + .scale({ x: this.isScale1, y: this.isScale1 }) + .animation({ curve: curves.springMotion() }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template3/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..64547766fd0cf6a2615252e54f69df9fd6fc8d51 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template3/Index.ets @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ModalTransitionExample3 { + @State isShow: boolean = false; + @State isShow2: boolean = false; + + @Builder + myBuilder2() { + Column() { + Button("close modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = false; + }) + } + .width('100%') + .height('100%') + } + + @Builder + myBuilder() { + Column() { + Button("transition modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = true; + }).bindContentCover(this.isShow2, this.myBuilder2(), { + modalTransition: ModalTransition.DEFAULT, + backgroundColor: Color.Gray, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + + Button("close modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindContentCover(this.isShow, this.myBuilder(), { + modalTransition: ModalTransition.DEFAULT, + backgroundColor: Color.Pink, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .backgroundColor(Color.White) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template4/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..3b8564911dd5840f803520fe09f2c20628a44f95 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template4/Index.ets @@ -0,0 +1,103 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ModalTransitionExample4 { + @State isShow: boolean = false; + @State isShow2: boolean = false; + + @Builder + myBuilder2() { + Column() { + Button("close modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + @Builder + myBuilder() { + Column() { + Button("transition modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = true; + }).bindContentCover(this.isShow2, this.myBuilder2(), { + modalTransition: ModalTransition.ALPHA, + backgroundColor: Color.Gray, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + + Button("close modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindContentCover(this.isShow, this.myBuilder(), { + modalTransition: ModalTransition.ALPHA, + backgroundColor: Color.Pink, + onWillAppear: () => { + console.log('BindContentCover onWillAppear.'); + }, + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onWillDisappear: () => { + console.log('BindContentCover onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindContentCover onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .backgroundColor(Color.White) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template5/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a1d8beba7a58ececa3f6554469e2158ed98ad254 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template5/Index.ets @@ -0,0 +1,120 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ModalTransitionExample5 { + @State isShow: boolean = false; + @State isShow2: boolean = false; + + @Builder + myBuilder2() { + Column() { + Button('Close Modal 2') + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + @Builder + myBuilder() { + Column() { + Button("Transition Modal 2") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow2 = true; + }) + .bindContentCover( + this.isShow2, + this.myBuilder2(), + { + modalTransition: ModalTransition.DEFAULT, + backgroundColor: Color.Gray, + transition: TransitionEffect.SLIDE.animation({ duration: 5000, curve: Curve.LinearOutSlowIn }), + onWillDismiss: ((dismissContentCoverAction: DismissContentCoverAction) => { + if (dismissContentCoverAction.reason == DismissReason.PRESS_BACK) { + console.log('BindContentCover dismiss reason is back pressed'); + } + dismissContentCoverAction.dismiss(); + }), + onAppear: () => { + console.info('BindContentCover onAppear.'); + }, + onDisappear: () => { + this.isShow2 = false; + console.info('BindContentCover onDisappear.'); + } + }) + + Button("Close Modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } + + build() { + Column() { + Button("Transition Modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindContentCover( + this.isShow, + this.myBuilder(), + { + modalTransition: ModalTransition.DEFAULT, + backgroundColor: Color.Pink, + transition: TransitionEffect.asymmetric( + TransitionEffect.OPACITY.animation({ duration: 1100 }).combine( + TransitionEffect.rotate({ z: 1, angle: 180 }).animation({ delay: 1000, duration: 1000 })) + , + TransitionEffect.OPACITY.animation({ duration: 1200 }).combine( + TransitionEffect.rotate({ z: 1, angle: 180 }).animation({ duration: 1300 })) + ), + onWillDismiss: ((dismissContentCoverAction: DismissContentCoverAction) => { + if (dismissContentCoverAction.reason == DismissReason.PRESS_BACK) { + console.log('back pressed'); + } + dismissContentCoverAction.dismiss(); + }), + onAppear: () => { + console.log('BindContentCover onAppear.'); + }, + onDisappear: () => { + this.isShow = false; + console.log('BindContentCover onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .backgroundColor(Color.White) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template6/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8a5ebb287efeb5f5a56ee29f6a0201cad62923db --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template6/Index.ets @@ -0,0 +1,205 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +interface PersonList { + name: string, + cardnum: string +} + +@Entry +@Component +struct BindContentCoverDemo { + private personList: Array = [ + { name: 'wang**', cardnum: '1234***********789' }, + { name: 'song*', cardnum: '2345***********789' }, + { name: 'xu**', cardnum: '3456***********789' }, + { name: 'tang*', cardnum: '4567***********789' } + ]; + // 半模态转场控制变量 + @State isSheetShow: boolean = false; + // 全模态转场控制变量 + @State isPresent: boolean = false; + + @Builder + MyContentCoverBuilder() { + Column() { + Row() { + Text($r('app.string.bindSheetCmd_label1')) + .fontSize(20) + .fontColor(Color.White) + .width('100%') + .textAlign(TextAlign.Center) + .padding({ top: 30, bottom: 15 }) + } + .backgroundColor(0x007dfe) + + Row() { + Text($r('app.string.bindSheetCmd_label2')) + .fontSize(16) + .fontColor(0x333333) + .margin({ top: 10 }) + .padding({ top: 20, bottom: 20 }) + .width('92%') + .borderRadius(10) + .textAlign(TextAlign.Center) + .backgroundColor(Color.White) + } + + Column() { + ForEach(this.personList, (item: PersonList, index: number) => { + Row() { + Column() { + if (index % 2 == 0) { + Column() + .width(20) + .height(20) + .border({ width: 1, color: 0x007dfe }) + .backgroundColor(0x007dfe) + } else { + Column() + .width(20) + .height(20) + .border({ width: 1, color: 0x007dfe }) + } + } + .width('20%') + + Column() { + Text(item.name) + .fontColor(0x333333) + .fontSize(18) + Text(item.cardnum) + .fontColor(0x666666) + .fontSize(14) + } + .width('60%') + .alignItems(HorizontalAlign.Start) + + Column() { + Text($r('app.string.bindSheetCmd_label3')) + .fontColor(0x007dfe) + .fontSize(16) + } + .width('20%') + } + .padding({ top: 10, bottom: 10 }) + .border({ width: { bottom: 1 }, color: 0xf1f1f1 }) + .width('92%') + .backgroundColor(Color.White) + }) + } + .padding({ top: 20, bottom: 20 }) + + Text($r('app.string.bindSheetCmd_label4')) + .width('90%') + .height(40) + .textAlign(TextAlign.Center) + .borderRadius(10) + .fontColor(Color.White) + .backgroundColor(0x007dfe) + .onClick(() => { + this.isPresent = !this.isPresent; + }) + } + .size({ width: '100%', height: '100%' }) + .backgroundColor(0xf5f5f5) + } + + @Builder + TripInfo() { + Row() { + Column() { + Text('00:25') + Text($r('app.string.bindSheetCmd_label5')) + } + .width('25%') + + Column() { + Text('G1234') + Text($r('app.string.bindSheetCmd_label6')) + } + .width('25%') + + Column() { + Text('08:26') + Text($r('app.string.bindSheetCmd_label7')) + } + .width('25%') + } + } + + // 第二步：定义半模态展示界面 + // 通过@Builder构建模态展示界面 + @Builder + MySheetBuilder() { + Column() { + Column() { + this.TripInfo() + } + .width('92%') + .margin(15) + .backgroundColor(Color.White) + .shadow({ radius: 30, color: '#aaaaaa' }) + .borderRadius(10) + + Column() { + Text($r('app.string.MySheetBuilder_text1')) + .fontSize(18) + .fontColor(Color.Orange) + .fontWeight(FontWeight.Bold) + .padding({ top: 10, bottom: 10 }) + .width('60%') + .textAlign(TextAlign.Center) + .borderRadius(15) + .onClick(() => { + // 第三步：通过全模态接口调起全模态展示界面，新拉起的模态面板默认显示在最上层 + this.isPresent = !this.isPresent; + }) + // 通过全模态接口，绑定模态展示界面MyContentCoverBuilder。transition属性支持自定义转场效果，此处定义了x轴横向入场 + .bindContentCover($$this.isPresent, this.MyContentCoverBuilder(), { + transition: TransitionEffect.translate({ x: 500 }).animation({ curve: curves.springMotion(0.6, 0.8) }) + }) + } + .padding({ top: 60 }) + } + } + + build() { + Column() { + Row() { + this.TripInfo() + Text($r('app.string.MySheetBuilder_text2')) + .fontColor(Color.Blue) + .width('25%') + } + .width('100%') + .margin({top: 200, bottom: 30}) + .borderRadius(10) + .backgroundColor(Color.White) + .onClick(()=>{ + this.isSheetShow = !this.isSheetShow; + }) + // 第一步：定义半模态转场效果 + .bindSheet($$this.isSheetShow, this.MySheetBuilder(), { + height: SheetSize.MEDIUM, + title: {title: $r('app.string.MySheetBuilder_text3')}, + }) + } + .width('100%') + .height('100%') + .backgroundColor('#30aaaaaa') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template7/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template7/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..487b87b042a4fd6e49975459ac1e59f537eaaaea --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindContentCover/template7/Index.ets @@ -0,0 +1,190 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +interface PersonList { + name: string, + cardnum: string +} + +@Entry +@Component +struct BindContentCoverDemo { + private personList: Array = [ + { name: 'wang**', cardnum: '1234***********789' }, + { name: 'song*', cardnum: '2345***********789' }, + { name: 'xu**', cardnum: '3456***********789' }, + { name: 'tang*', cardnum: '4567***********789' } + ]; + // 第一步：定义全屏模态转场效果bindContentCover + // 模态转场控制变量 + @State isPresent: boolean = false; + + // 第二步：定义模态展示界面 + // 通过@Builder构建模态展示界面 + @Builder + MyBuilder() { + Column() { + Row() { + Text($r('app.string.MyContentCoverBuilder_text1')) + .fontSize(20) + .fontColor(Color.White) + .width('100%') + .textAlign(TextAlign.Center) + .padding({ top: 30, bottom: 15 }) + } + .backgroundColor(0x007dfe) + + Row() { + Text($r('app.string.MyContentCoverBuilder_text2')) + .fontSize(16) + .fontColor(0x333333) + .margin({ top: 10 }) + .padding({ top: 20, bottom: 20 }) + .width('92%') + .borderRadius(10) + .textAlign(TextAlign.Center) + .backgroundColor(Color.White) + } + + Column() { + ForEach(this.personList, (item: PersonList, index: number) => { + Row() { + Column() { + if (index % 2 == 0) { + Column() + .width(20) + .height(20) + .border({ width: 1, color: 0x007dfe }) + .backgroundColor(0x007dfe) + } else { + Column() + .width(20) + .height(20) + .border({ width: 1, color: 0x007dfe }) + } + } + .width('20%') + + Column() { + Text(item.name) + .fontColor(0x333333) + .fontSize(18) + Text(item.cardnum) + .fontColor(0x666666) + .fontSize(14) + } + .width('60%') + .alignItems(HorizontalAlign.Start) + + Column() { + Text($r('app.string.MyContentCoverBuilder_text3')) + .fontColor(0x007dfe) + .fontSize(16) + } + .width('20%') + } + .padding({ top: 10, bottom: 10 }) + .border({ width: { bottom: 1 }, color: 0xf1f1f1 }) + .width('92%') + .backgroundColor(Color.White) + }) + } + .padding({ top: 20, bottom: 20 }) + + Text($r('app.string.MyContentCoverBuilder_text4')) + .width('90%') + .height(40) + .textAlign(TextAlign.Center) + .borderRadius(10) + .fontColor(Color.White) + .backgroundColor(0x007dfe) + .onClick(() => { + this.isPresent = !this.isPresent; + }) + } + .size({ width: '100%', height: '100%' }) + .backgroundColor(0xf5f5f5) + // 通过转场动画实现出现消失转场动画效果 + .transition(TransitionEffect.translate({ y: 1000 }).animation({ curve: curves.springMotion(0.6, 0.8) })) + } + + build() { + Column() { + Row() { + Text($r('app.string.MySheetBuilder_text')) + .fontSize(20) + .fontColor(Color.White) + .width('100%') + .textAlign(TextAlign.Center) + .padding({ top: 30, bottom: 60 }) + } + .backgroundColor(0x007dfe) + + Column() { + Row() { + Column() { + Text('00:25') + Text($r('app.string.MyContentCoverBuilder_text5')) + } + .width('30%') + + Column() { + Text('G1234') + Text($r('app.string.MyContentCoverBuilder_text6')) + } + .width('30%') + + Column() { + Text('08:26') + Text($r('app.string.MyContentCoverBuilder_text7')) + } + .width('30%') + } + } + .width('92%') + .padding(15) + .margin({ top: -30 }) + .backgroundColor(Color.White) + .shadow({ radius: 30, color: '#aaaaaa' }) + .borderRadius(10) + + Column() { + Text($r('app.string.MyContentCoverBuilder_text2')) + .fontSize(18) + .fontColor(Color.Orange) + .fontWeight(FontWeight.Bold) + .padding({ top: 10, bottom: 10 }) + .width('60%') + .textAlign(TextAlign.Center) + .borderRadius(15) + .bindContentCover(this.isPresent, this.MyBuilder(), { + modalTransition: ModalTransition.DEFAULT, + onDisappear: () => { + if (this.isPresent) { + this.isPresent = !this.isPresent; + } + } + }) + .onClick(() => { + // 第三步：通过模态接口调起模态展示界面，通过转场动画或者共享元素动画去实现对应的动画效果 + // 改变状态变量，显示模态界面 + this.isPresent = !this.isPresent; + }) + } + .padding({ top: 60 }) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template1/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..67b71f53a078cd28cd53cef0c81c40ef7b9eb29f --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template1/Index.ets @@ -0,0 +1,78 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SheetTransitionExample1 { + @State isShow: boolean = false; + @State sheetHeight: number = 300; + + @Builder + myBuilder() { + Column() { + Button("change height") + .margin(10) + .fontSize(20) + .onClick(() => { + this.sheetHeight = 500; + }) + + Button("Set Illegal height") + .margin(10) + .fontSize(20) + .onClick(() => { + this.sheetHeight = -1; + }) + + Button("close modal 1") + .margin(10) + .fontSize(20) + .onClick(() => { + this.isShow = false; + }) + } + .width('100%') + .height('100%') + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + height: this.sheetHeight, + backgroundColor: Color.Green, + onWillAppear: () => { + console.log('BindSheet onWillAppear.'); + }, + onAppear: () => { + console.log('BindSheet onAppear.'); + }, + onWillDisappear: () => { + console.log('BindSheet onWillDisappear.'); + }, + onDisappear: () => { + console.log('BindSheet onDisappear.'); + } + }) + } + .justifyContent(FlexAlign.Center) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template10/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template10/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..30a02872d9f2efb7c3318ffeedc8667c3164030f --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template10/Index.ets @@ -0,0 +1,65 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SheetDemo { + @State isShowSheet: boolean = false; + private items: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; + + @Builder + SheetBuilder() { + Column() { + // 第一步：自定义滚动容器 + List({ space: '10vp' }) { + ForEach(this.items, (item: number) => { + ListItem() { + Text(String(item)).fontSize(16).fontWeight(FontWeight.Bold) + }.width('90%').height('80vp').backgroundColor('#ff53ecd9').borderRadius(10) + }) + } + .alignListItem(ListItemAlign.Center) + .margin({ top: '10vp' }) + .width('100%') + .height('900px') + // 第二步：设置滚动组件的嵌套滚动属性 + .nestedScroll({ + scrollForward: NestedScrollMode.PARENT_FIRST, + scrollBackward: NestedScrollMode.SELF_FIRST, + }) + + Text($r('app.string.tSheetBuilder_text1')) + .width('100%') + .backgroundColor(Color.Gray) + .layoutWeight(1) + .textAlign(TextAlign.Center) + .align(Alignment.Top) + }.width('100%').height('100%') + } + + build() { + Column() { + Button('Open Sheet').width('90%').height('80vp') + .onClick(() => { + this.isShowSheet = !this.isShowSheet; + }) + .bindSheet($$this.isShowSheet, this.SheetBuilder(), { + detents: [SheetSize.MEDIUM, SheetSize.LARGE, 600], + preferType: SheetType.BOTTOM, + title: { title: $r('app.string.tSheetBuilder_text2') }, + }) + }.width('100%').height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template2/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..13f38bf423c231e961dce70267c34ec4fe353d23 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template2/Index.ets @@ -0,0 +1,53 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SheetTransitionExample2 { + @State isShow: boolean = false; + + @Builder + myBuilder() { + Column() { + Button("content1") + .margin(10) + .fontSize(20) + + Button("content2") + .margin(10) + .fontSize(20) + } + .width('100%') + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + detents: [SheetSize.MEDIUM, SheetSize.LARGE, 200], + blurStyle: BlurStyle.Thick, + showClose: true, + title: { title: "title", subtitle: "subtitle" }, + }) + } + .justifyContent(FlexAlign.Start) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template3/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d53283df1b550ce2f597706e5b3a09977364a2af --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template3/Index.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI'; + +@Entry +@Component +struct SheetTransitionExample3 { + @State isShow: boolean = false; + + @Builder + myBuilder() { + Column() { + Button("content1") + .margin(10) + .fontSize(20) + + Button("content2") + .margin(10) + .fontSize(20) + } + .width('100%') + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + detents: [SheetSize.MEDIUM, SheetSize.LARGE, 200], + backgroundColor: Color.Gray, + blurStyle: BlurStyle.Thick, + showClose: true, + title: { title: "title", subtitle: "subtitle" }, + borderWidth: { top: LengthMetrics.vp(10), start: LengthMetrics.vp(10), end: LengthMetrics.vp(20) }, + borderColor: { top: Color.Pink, start: Color.Blue, end: Color.Yellow }, + }) + } + .justifyContent(FlexAlign.Start) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template4/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..3765b5f1a2825364f1c444c9e6aadfdbefc96ba3 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template4/Index.ets @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct bindSheetExample4 { + @State isShow: Boolean = false; + + @Builder + myBuilder() { + Column() { + Button("CONTEXT") + .margin(10) + .fontSize(20) + } + } + + build() { + Column() { + Button("NoRegisterSpringback") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + height: SheetSize.MEDIUM, + blurStyle: BlurStyle.Thick, + showClose: true, + title: { title: "title", subtitle: "subtitle" }, + preferType: SheetType.CENTER, + + onWillDismiss: ((DismissSheetAction: DismissSheetAction) => { + if (DismissSheetAction.reason == DismissReason.SLIDE_DOWN) { + DismissSheetAction.dismiss(); //注册dismiss行为 + } + }), + + onWillSpringBackWhenDismiss: ((springBackAction: SpringBackAction) => { + //没有注册springBack，下拉半模态页面无回弹行为 + //springBackAction.springBack(); + }), + }) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template5/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..bf546bd157c670c231c56b922d5a7a4bf6ae1886 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template5/Index.ets @@ -0,0 +1,53 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct bindSheetExample5 { + @State isShow: boolean = false; + + @Builder + myBuilder() { + Column() { + Column() + .backgroundColor(Color.Blue) + .height(200) + .width('100%') + Column() + .backgroundColor(Color.Green) + .height(200) + .width('100%') + } + } + + build() { + Column() { + Button('BindSheet') + .onClick(() => { + this.isShow = true; + }) + .bindSheet($$this.isShow, this.myBuilder(), { + detents: [300, 600, 900], + uiContext: this.getUIContext(), + mode: SheetMode.OVERLAY, + scrollSizeMode: ScrollSizeMode.CONTINUOUS, + backgroundColor: Color.Orange, + title: { title: 'Title', subtitle: 'Subtitle' } + }) + } + .justifyContent(FlexAlign.Center) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template6/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..73706191b362382eb6331d85ef3fe7ca0157de42 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template6/Index.ets @@ -0,0 +1,121 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import window from '@ohos.window'; +import { BusinessError } from '@ohos.base'; + +@Entry +@Component +struct ListenKeyboardHeightChange { + @State isShow: boolean = false; + @State avoidMode: SheetKeyboardAvoidMode = SheetKeyboardAvoidMode.RESIZE_ONLY; + scroller = new Scroller(); + private arr: number[] = [0, 1, 2, 3, 4, 5, 6]; + windowClass: window.Window | undefined = undefined; + + aboutToAppear(): void { + try { + window.getLastWindow(this.getUIContext().getHostContext(), (err: BusinessError, data) => { + const errCode: number = err.code; + if (errCode) { + console.error(`Failed to obtain the top window, Cause code: ${err.code}, message: ${err.message}`); + return; + } + this.windowClass = data; + try { + if (this.windowClass !== undefined) { + console.log('success in listen height change'); + this.windowClass.on('keyboardHeightChange', this.callback); + } + } catch (exception) { + console.error(`Failed to enable the listener for keyboard height changes, Cause code: ${exception.code}, message: ${exception.message}`); + } + console.info('Succeeded in obtaining the top window. Data: ' + JSON.stringify(data)); + }); + } catch (exception) { + console.error(`Failed to obtain the top window, Cause code: ${exception.code}, message: ${exception.message}`); + } + } + + callback = (height: number) => { + console.log('height change: ' + height); + if (height !== 0) { + this.scroller.scrollTo({ + xOffset: 0, yOffset: height + this.scroller.currentOffset().yOffset, + animation: { duration: 1000, curve: Curve.Ease, canOverScroll: false } + }); + } + } + + @Builder + myBuilder() { + Scroll(this.scroller) { + Column() { + ForEach(this.arr, (item: number) => { + Row() { + Text(item.toString()) + .width('80%') + .height(60) + .backgroundColor('#3366CC') + .borderRadius(15) + .fontSize(16) + .textAlign(TextAlign.Center) + .margin({ top: 5 }) + } + }, (item: number) => item.toString()) + + TextInput().height('100') + + Flex({ alignItems: ItemAlign.End }) { + Row() { + Button("click") + .margin(10) + .fontSize(20) + .width('45%') + + Button("cancel") + .margin(10) + .fontSize(20) + .width('45%') + }.width('100%') + }.height(100) + }.margin({ right: 15, bottom: 50 }) + } + .height('100%') + .scrollBar(BarState.On) + .scrollable(ScrollDirection.Vertical) + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + height: 750, + backgroundColor: Color.Gray, + blurStyle: BlurStyle.Thick, + showClose: true, + title: { title: "title", subtitle: "subtitle" }, + keyboardAvoidMode: SheetKeyboardAvoidMode.RESIZE_ONLY, + }) + } + .justifyContent(FlexAlign.Start) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template7/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template7/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..70c9812a477de1b6704ca0e4fa3f962f88125bb6 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template7/Index.ets @@ -0,0 +1,54 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI'; + +@Entry +@Component +struct SheetTransitionExample7 { + @State isShow: boolean = false; + + @Builder + myBuilder() { + Column() { + Button("content1") + .margin(10) + .fontSize(20) + + Button("content2") + .margin(10) + .fontSize(20) + } + .width('100%') + } + + build() { + Column() { + Button("transition modal 1") + .onClick(() => { + this.isShow = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShow, this.myBuilder(), { + detents: [SheetSize.MEDIUM, SheetSize.LARGE, 200], + title: { title: "title", subtitle: "subtitle" }, + radius: { topStart: LengthMetrics.vp(50), topEnd: LengthMetrics.vp(10) }, + }) + } + .justifyContent(FlexAlign.Start) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template8/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template8/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..1ec718f1e11b2e500499db051cc37f9678b26d18 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template8/Index.ets @@ -0,0 +1,108 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI'; + +@Entry +@Component +struct SheetSideExample8 { + @State isShowSide: boolean = false; + @State enableOutsideInteractive: boolean = false; + @State borderWidths: LocalizedEdgeWidths | undefined = undefined; + @State borderColors: Resource | undefined = undefined; + private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]; + + @Builder + sideBuilder() { + Column() { + ForEach(this.arr, (item: number) => { + Row() { + Text(item.toString()) + .width('90%') + .height(60) + .backgroundColor('#3366CC') + .borderRadius(15) + .fontSize(16) + .textAlign(TextAlign.Center) + .margin({ top: 5 }) + } + }, (item: number) => item.toString()) + TextInput() + .margin({ top: 5 }) + Text($r('app.string.sideBuilder_text1')) + .fontSize(22).fontColor(0xFFFFFF).fontWeight(FontWeight.Bold).textAlign(TextAlign.Center) + .width('100%').height(50).backgroundColor('#2ebd82') + Button("change enableOutsideInteractive = " + this.enableOutsideInteractive) + .margin({ top: 5 }) + .onClick(() => { + this.enableOutsideInteractive = !this.enableOutsideInteractive; + if (this.enableOutsideInteractive) { + this.borderWidths = {start : LengthMetrics.vp(1)}; + this.borderColors = $r('sys.color.comp_divider'); + } else { + this.borderWidths = undefined; + this.borderColors = undefined; + } + }) + } + .width('100%') + .height('auto') + } + + + build() { + Column({space:3}) { + Button($r('app.string.sideBuilder_text2')) + .onClick(() => { + this.isShowSide = true; + }) + .fontSize(20) + .margin(10) + .bindSheet($$this.isShowSide, this.sideBuilder(), { + title: { title: "SideSheet", subtitle: $r('app.string.sideBuilder_text3') }, + backgroundColor: Color.Grey, + onWillAppear: () => { + console.log('SideSheet onWillAppear.'); + }, + onAppear: () => { + console.log('SideSheet onAppear.'); + }, + onWillDisappear: () => { + console.log('SideSheet onWillDisappear.'); + }, + onDisappear: () => { + console.log('SideSheet onDisappear.'); + }, + + preferType: SheetType.SIDE, + blurStyle: BlurStyle.Regular, + maskColor: "#4bffc62d", // 自定义蒙层颜色 + enableOutsideInteractive: this.enableOutsideInteractive, + + borderWidth: this.borderWidths, + borderColor: this.borderColors, + + onHeightDidChange: (height: number)=>{ + console.log('SideSheet eight change:' + height); + }, + onTypeDidChange: (type: SheetType) => { + console.log('SideSheet type change:' + type); + }, + }) + } + .justifyContent(FlexAlign.Center) + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template9/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template9/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0e3b7b5738e61956bd9f82a2dce374661f9bc4df --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheet/template9/Index.ets @@ -0,0 +1,100 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BindSheetDemo9 { + // 半模态转场显示隐藏控制 + @State isShowSheet: boolean = false; + private menuList: string[] = ['No spicy food', 'Put less chili', 'Add more chili', 'No coriander, please', 'No chives, please', 'No disposable tableware, please', 'Disposable tableware is needed']; + + // 通过@Builder构建半模态展示界面 + @Builder + mySheet() { + Column() { + Flex({ direction: FlexDirection.Row, wrap: FlexWrap.Wrap }) { + ForEach(this.menuList, (item: string) => { + Text(item) + .fontSize(16) + .fontColor(0x333333) + .backgroundColor(0xf1f1f1) + .borderRadius(8) + .margin(10) + .padding(10) + }) + } + .padding({ top: 18 }) + } + .width('100%') + .height('100%') + .backgroundColor(Color.White) + } + + build() { + Column() { + Text($r('app.string.temp9string_text8')) + .fontSize(28) + .padding({ top: 30, bottom: 30 }) + Column() { + Row() { + Row() + .width(10) + .height(10) + .backgroundColor('#a8a8a8') + .margin({ right: 12 }) + .borderRadius(20) + + Column() { + Text($r('app.string.temp9string_text9')) + .fontSize(16) + .fontWeight(FontWeight.Medium) + } + .alignItems(HorizontalAlign.Start) + + Blank() + + Row() + .width(12) + .height(12) + .margin({ right: 15 }) + .border({ + width: { top: 2, right: 2 }, + color: 0xcccccc + }) + .rotate({ angle: 45 }) + } + .borderRadius(15) + .shadow({ radius: 100, color: '#ededed' }) + .width('90%') + .alignItems(VerticalAlign.Center) + .padding({ left: 15, top: 15, bottom: 15 }) + .backgroundColor(Color.White) + .bindSheet(this.isShowSheet, this.mySheet(), { + height: 300, + dragBar: false, + onDisappear: () => { + this.isShowSheet = !this.isShowSheet; + } + }) + .onClick(() => { + this.isShowSheet = !this.isShowSheet; + }) + } + .width('100%') + } + .width('100%') + .height('100%') + .backgroundColor(0xf1f1f1) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template1/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..25e9b19ee43ad3edd1289b1dbd670a10f272c9ed --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template1/Index.ets @@ -0,0 +1,98 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { FrameNode, ComponentContent } from "@kit.ArkUI"; +import { BusinessError } from '@kit.BasicServicesKit'; + +class Params { + text: string = ""; + + constructor(text: string) { + this.text = text; + } +} + +let contentNode: ComponentContent; +let gUIContext: UIContext; + +@Builder +function buildText(params: Params) { + Column() { + Text(params.text) + Button('Update BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.updateBindSheet(contentNode, { + backgroundColor: Color.Pink, + }, true) + .then(() => { + console.info('updateBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('updateBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + + Button('Close BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.closeBindSheet(contentNode) + .then(() => { + console.info('closeBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('closeBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } +} + +@Entry +@Component +struct UIContextBindSheet { + @State message: string = 'BindSheet'; + + aboutToAppear() { + gUIContext = this.getUIContext(); + contentNode = new ComponentContent(this.getUIContext(), wrapBuilder(buildText), new Params(this.message)); + } + + build() { + RelativeContainer() { + Column() { + Button('Open BindSheet') + .fontSize(20) + .onClick(() => { + let uiContext = this.getUIContext(); + let uniqueId = this.getUniqueId(); + let frameNode: FrameNode | null = uiContext.getFrameNodeByUniqueId(uniqueId); + let targetId = frameNode?.getFirstChild()?.getUniqueId(); + uiContext.openBindSheet(contentNode, { + height: SheetSize.MEDIUM, + backgroundColor: Color.Green, + title: { title: "Title", subtitle: "subtitle" } + }, targetId) + .then(() => { + console.info('openBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('openBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } + } + .height('100%') + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template2/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..25e9b19ee43ad3edd1289b1dbd670a10f272c9ed --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template2/Index.ets @@ -0,0 +1,98 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { FrameNode, ComponentContent } from "@kit.ArkUI"; +import { BusinessError } from '@kit.BasicServicesKit'; + +class Params { + text: string = ""; + + constructor(text: string) { + this.text = text; + } +} + +let contentNode: ComponentContent; +let gUIContext: UIContext; + +@Builder +function buildText(params: Params) { + Column() { + Text(params.text) + Button('Update BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.updateBindSheet(contentNode, { + backgroundColor: Color.Pink, + }, true) + .then(() => { + console.info('updateBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('updateBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + + Button('Close BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.closeBindSheet(contentNode) + .then(() => { + console.info('closeBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('closeBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } +} + +@Entry +@Component +struct UIContextBindSheet { + @State message: string = 'BindSheet'; + + aboutToAppear() { + gUIContext = this.getUIContext(); + contentNode = new ComponentContent(this.getUIContext(), wrapBuilder(buildText), new Params(this.message)); + } + + build() { + RelativeContainer() { + Column() { + Button('Open BindSheet') + .fontSize(20) + .onClick(() => { + let uiContext = this.getUIContext(); + let uniqueId = this.getUniqueId(); + let frameNode: FrameNode | null = uiContext.getFrameNodeByUniqueId(uniqueId); + let targetId = frameNode?.getFirstChild()?.getUniqueId(); + uiContext.openBindSheet(contentNode, { + height: SheetSize.MEDIUM, + backgroundColor: Color.Green, + title: { title: "Title", subtitle: "subtitle" } + }, targetId) + .then(() => { + console.info('openBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('openBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } + } + .height('100%') + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template3/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..25e9b19ee43ad3edd1289b1dbd670a10f272c9ed --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/bindSheetCmd/template3/Index.ets @@ -0,0 +1,98 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { FrameNode, ComponentContent } from "@kit.ArkUI"; +import { BusinessError } from '@kit.BasicServicesKit'; + +class Params { + text: string = ""; + + constructor(text: string) { + this.text = text; + } +} + +let contentNode: ComponentContent; +let gUIContext: UIContext; + +@Builder +function buildText(params: Params) { + Column() { + Text(params.text) + Button('Update BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.updateBindSheet(contentNode, { + backgroundColor: Color.Pink, + }, true) + .then(() => { + console.info('updateBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('updateBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + + Button('Close BindSheet') + .fontSize(20) + .onClick(() => { + gUIContext.closeBindSheet(contentNode) + .then(() => { + console.info('closeBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('closeBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } +} + +@Entry +@Component +struct UIContextBindSheet { + @State message: string = 'BindSheet'; + + aboutToAppear() { + gUIContext = this.getUIContext(); + contentNode = new ComponentContent(this.getUIContext(), wrapBuilder(buildText), new Params(this.message)); + } + + build() { + RelativeContainer() { + Column() { + Button('Open BindSheet') + .fontSize(20) + .onClick(() => { + let uiContext = this.getUIContext(); + let uniqueId = this.getUniqueId(); + let frameNode: FrameNode | null = uiContext.getFrameNodeByUniqueId(uniqueId); + let targetId = frameNode?.getFirstChild()?.getUniqueId(); + uiContext.openBindSheet(contentNode, { + height: SheetSize.MEDIUM, + backgroundColor: Color.Green, + title: { title: "Title", subtitle: "subtitle" } + }, targetId) + .then(() => { + console.info('openBindSheet success'); + }) + .catch((err: BusinessError) => { + console.info('openBindSheet error: ' + err.code + ' ' + err.message); + }) + }) + } + } + .height('100%') + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/common/Index.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/common/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..02c5c6b987280c6731d3e40af7c56c416176a3af --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/ets/pages/common/Index.ets @@ -0,0 +1,23 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export interface Route { + name: string; + label: ResourceStr; +} + +export interface RouteGroup extends Route { + children: Route[]; +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/module.json5 b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..196e6b3978857f196aa334edffc3c5b431c6bc83 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/module.json5 @@ -0,0 +1,65 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry", + "type": "entry", + "description": "$string:module_desc", + "mainElement": "EntryAbility", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false, + "pages": "$profile:main_pages", + "abilities": [ + { + "name": "EntryAbility", + "srcEntry": "./ets/entryability/EntryAbility.ets", + "description": "$string:EntryAbility_desc", + "icon": "$media:layered_image", + "label": "$string:EntryAbility_label", + "startWindowIcon": "$media:startIcon", + "orientation": "auto_rotation", + "startWindowBackground": "$color:start_window_background", + "exported": true, + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "ohos.want.action.home" + ] + } + ] + } + ], + "extensionAbilities": [ + { + "name": "EntryBackupAbility", + "srcEntry": "./ets/entrybackupability/EntryBackupAbility.ets", + "type": "backup", + "exported": false, + "metadata": [ + { + "name": "ohos.extension.backup", + "resource": "$profile:backup_config" + } + ], + } + ] + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/color.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..3c712962da3c2751c2b9ddb53559afcbd2b54a02 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#FFFFFF" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/float.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/float.json new file mode 100644 index 0000000000000000000000000000000000000000..153478e3f449f86a897686bc35316bd4fc96fb99 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/float.json @@ -0,0 +1,17 @@ +{ + "float": [ + { + "name": "page_text_font_size", + "value": "50fp" + }, { + "name": "size_16", + "value": "16" + }, { + "name": "size_100", + "value": "100" + }, { + "name": "size_64", + "value": "64" + } + ] +} diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/string.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..d9f32b95ddc3f0be155a6d64068c4d5b1d13964e --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/element/string.json @@ -0,0 +1,187 @@ +{ + "string": [ + { + "name": "module_desc", + "value": "module description" + }, + { + "name": "EntryAbility_desc", + "value": "description" + }, + { + "name": "EntryAbility_label", + "value": "BindSheet" + }, + { + "name": "navigation_toolbar_add", + "value": "add" + }, + { + "name": "navigation_toolbar_app", + "value": "app" + }, + { + "name": "navigation_toolbar_collect", + "value": "collect" + }, { + "name": "please_click_button", + "value": "请点击按钮" + }, { + "name": "bindContentCover_label", + "value": "全模态转场" + }, { + "name": "bindContentCover_label1", + "value": "示例1（使用全屏模态转场）" + }, { + "name": "bindContentCover_label2", + "value": "示例2（自定义转场动画）" + }, { + "name": "bindContentCover_label3", + "value": "示例3（上下切换转场）" + }, { + "name": "bindContentCover_label4", + "value": "示例4（透明度渐变转场）" + }, { + "name": "bindContentCover_label5", + "value": "示例5（设置不同效果的自定义转场）" + }, { + "name": "bindContentCover_label6", + "value": "示例6（使用bindContentCover构建全屏模态内容覆盖半模态）" + }, { + "name": "bindContentCover_label7", + "value": "示例7（使用bindContentCover构建全屏模态转场效果）" + }, { + "name": "bindSheet_label", + "value": "半模态转场" + }, { + "name": "bindSheet_label1", + "value": "示例1（不同高度的半模态弹窗）" + }, { + "name": "bindSheet_label2", + "value": "示例2（设置三个不同高度的档位）" + }, { + "name": "bindSheet_label3", + "value": "示例3（使用边框宽度和颜色）" + }, { + "name": "bindSheet_label4", + "value": "示例4（使用关闭回调函数）" + }, { + "name": "bindSheet_label5", + "value": "示例5（设置内容区刷新时机）" + }, { + "name": "bindSheet_label6", + "value": "示例6（设置压缩模态内容）" + }, { + "name": "bindSheet_label7", + "value": "示例7（镜像场景下如何设置圆角属性）" + }, { + "name": "bindSheet_label8", + "value": "示例8（半模态Side侧边样式）" + }, { + "name": "bindSheet_label9", + "value": "示例9（使用bindSheet构建半模态转场效果）" + }, { + "name": "bindSheet_label10", + "value": "示例10（使用嵌套滚动交互）" + }, { + "name": "bindSheetCmd_label", + "value": "命令式打开半模态" + }, { + "name": "bindSheetCmd_label1", + "value": "示例1（openBindSheet）" + }, { + "name": "bindSheetCmd_label2", + "value": "示例2（updateBindSheet）" + }, { + "name": "bindSheetCmd_label3", + "value": "示例3（closeBindSheet）" + }, { + "name": "MyContentCoverBuilder_text1", + "value": "选择乘车人" + }, { + "name": "MyContentCoverBuilder_text2", + "value": "+ 添加乘车人" + }, { + "name": "MyContentCoverBuilder_text3", + "value": "编辑" + }, { + "name": "MyContentCoverBuilder_text4", + "value": "确认" + }, { + "name": "MyContentCoverBuilder_text5", + "value": "始发站" + }, { + "name": "MyContentCoverBuilder_text6", + "value": "8时1分" + }, { + "name": "MyContentCoverBuilder_text7", + "value": "终点站" + }, { + "name": "MySheetBuilder_text1", + "value": "+ 选择乘车人" + }, { + "name": "MySheetBuilder_text2", + "value": "有票" + }, { + "name": "sideBuilder_text1", + "value": "改变半模态交互模式" + }, { + "name": "sideBuilder_text2", + "value": "半模态弹窗-Side" + }, { + "name": "sideBuilder_text3", + "value": "默认宽度" + }, { + "name": "temp9string_text1", + "value": "不要辣" + }, { + "name": "temp9string_text2", + "value": "少放辣" + }, { + "name": "temp9string_text3", + "value": "多放辣" + }, { + "name": "temp9string_text4", + "value": "不要香菜" + }, { + "name": "temp9string_text5", + "value": "不要香葱" + }, { + "name": "temp9string_text6", + "value": "不要一次性餐具" + }, { + "name": "temp9string_text7", + "value": "需要一次性餐具" + }, { + "name": "temp9string_text8", + "value": "口味与餐具" + }, { + "name": "temp9string_text9", + "value": "选择点餐口味和餐具" + }, { + "name": "tSheetBuilder_text1", + "value": "非滚动区域" + }, { + "name": "tSheetBuilder_text2", + "value": "嵌套滚动场景" + }, { + "name": "MySheetBuilder_text", + "value": "确认订单" + }, { + "name": "MySheetBuilder_text3", + "value": "确认订单" + }, { + "name": "bindSheetCmd_label5", + "value": "始发站" + }, { + "name": "bindSheetCmd_label6", + "value": "8时1分" + }, { + "name": "bindSheetCmd_label7", + "value": "终点站" + }, { + "name": "bindSheetCmd_label4", + "value": "确认" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/background.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/bg.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/bg.JPG new file mode 100644 index 0000000000000000000000000000000000000000..77d1db9c5ae70097ed69f7c9d2fcae8a751e8fff Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/bg.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/book.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/book.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/book.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/drawer.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/drawer.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/drawer.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/forest.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/forest.png new file mode 100644 index 0000000000000000000000000000000000000000..25165d3dac9606d9078b49a9853c66c9cb77320a Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/forest.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/heart.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/heart.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_health_heart.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_health_heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c0843441f0fa499317d594a0f81a0f169ac4cad9 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_health_heart.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlights.svg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlights.svg new file mode 100644 index 0000000000000000000000000000000000000000..7f0c77423290d138e1c06b9de163af52d0ba0195 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlights.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collect + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlightsed.svg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlightsed.svg new file mode 100644 index 0000000000000000000000000000000000000000..bda82973349ceba0d7de8e9f85d704844cb31318 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/ic_public_highlightsed.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collected + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon_2.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon_2.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/icon_2.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image.JPG new file mode 100644 index 0000000000000000000000000000000000000000..29bd746fee2f280b5a97640c3c91125bb0934ca1 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image_1.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image_1.png new file mode 100644 index 0000000000000000000000000000000000000000..8b474587838c8cc696fc7747dfe9b1c70f80dc2d Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/image_1.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/img_1.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/img_1.JPG new file mode 100644 index 0000000000000000000000000000000000000000..461eda6a6847cb09d9d6569a4258009d414610e8 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/img_1.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/mountain.jpg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/mountain.jpg new file mode 100644 index 0000000000000000000000000000000000000000..3c244ab4218031e18dd0069e240e558622924668 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/mountain.jpg differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/r.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/r.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cd3fef02a58cabe165cb12fde35cb4c249afa5a4 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/r.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sky.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sky.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sky.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/startIcon.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/startIcon.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sun.jpg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sun.jpg new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/sun.jpg differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/test.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/test.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/test.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImage.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImage.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImage.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImg.jpg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImg.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testImg.jpg differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG new file mode 100644 index 0000000000000000000000000000000000000000..e2e542fcde54adf541a680c384bf8477b41548eb Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image1.jpg b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image1.jpg differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image2.png b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image2.png new file mode 100644 index 0000000000000000000000000000000000000000..af8d4c98a86f23a41841d07b74636926a17d1c89 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/transition_image2.png differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/tree.JPG b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/tree.JPG new file mode 100644 index 0000000000000000000000000000000000000000..bdad6db5558c4190bccb951489e8bc67fc0ababe Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/media/tree.JPG differ diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/backup_config.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/backup_config.json new file mode 100644 index 0000000000000000000000000000000000000000..78f40ae7c494d71e2482278f359ec790ca73471a --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/backup_config.json @@ -0,0 +1,3 @@ +{ + "allowToBackupRestore": true +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/main_pages.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/main_pages.json new file mode 100644 index 0000000000000000000000000000000000000000..423fc421780c3319595d4ee9b1e4af44cbdd9f66 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/base/profile/main_pages.json @@ -0,0 +1,25 @@ +{ + "src": [ + "pages/Index", + "pages/bindContentCover/template1/Index", + "pages/bindContentCover/template2/Index", + "pages/bindContentCover/template3/Index", + "pages/bindContentCover/template4/Index", + "pages/bindContentCover/template5/Index", + "pages/bindContentCover/template6/Index", + "pages/bindContentCover/template7/Index", + "pages/bindSheet/template1/Index", + "pages/bindSheet/template2/Index", + "pages/bindSheet/template3/Index", + "pages/bindSheet/template4/Index", + "pages/bindSheet/template5/Index", + "pages/bindSheet/template6/Index", + "pages/bindSheet/template7/Index", + "pages/bindSheet/template8/Index", + "pages/bindSheet/template9/Index", + "pages/bindSheet/template10/Index", + "pages/bindSheetCmd/template1/Index", + "pages/bindSheetCmd/template2/Index", + "pages/bindSheetCmd/template3/Index" + ] +} diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/dark/element/color.json b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/dark/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..79b11c2747aec33e710fd3a7b2b3c94dd9965499 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/main/resources/dark/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#000000" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/mock/mock-config.json5 b/code/DocsSample/ArkUISample/BindSheet/entry/src/mock/mock-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..323d1d611fecf4ecb751976e3a71500b3712a445 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/mock/mock-config.json5 @@ -0,0 +1,16 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/Ability.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/Ability.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..7f30942b81554a399e89aa253c7089eca4f8d8d1 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/Ability.test.ets @@ -0,0 +1,49 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function abilityTest() { + describe('ActsAbilityTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }) + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }) + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }) + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }) + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + hilog.info(0x0000, 'testTag', '%{public}s', 'it begin'); + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindContentCover.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindContentCover.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..e1604eda532051553c2b630cde6b86581f09b552 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindContentCover.test.ets @@ -0,0 +1,264 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'BindSheet_' +const TAG = '[Sample_BindSheet_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; + +let aimComponent : Component + +export function BindContentCoverTest() { + describe('BindSheet_BindContentCoverTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.bindSheet', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_001 + * @tc.name: example_one_BindContentCover + * @tc.desc: example_one_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label1')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 2')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('close modal 2')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('close modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_001_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_002 + * @tc.name: example_two_BindContentCover + * @tc.desc: example_two_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label2')))); + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_002_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_003 + * @tc.name: example_three_BindContentCover + * @tc.desc: example_three_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label3')))); + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_003_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_004 + * @tc.name: example_four_BindContentCover + * @tc.desc: example_four_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label4')))); + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('transition modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 2')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('close modal 1')) + await aimComponent.click(); + await driver.delayMs(2000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_004_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_005 + * @tc.name: example_five_BindContentCover + * @tc.desc: example_five_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label5')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Transition Modal 1')) + await aimComponent.click(); + await driver.delayMs(5000); + + aimComponent = await driver.findComponent(ON.text('Transition Modal 2')) + await aimComponent.click(); + await driver.delayMs(5000); + + aimComponent = await driver.findComponent(ON.text('Close Modal 2')) + await aimComponent.click(); + await driver.delayMs(5000); + + aimComponent = await driver.findComponent(ON.text('Close Modal 1')) + await aimComponent.click(); + await driver.delayMs(5000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_005_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_006 + * @tc.name: example_six_BindContentCover + * @tc.desc: example_six_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label6')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.MySheetBuilder_text2')))) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.MySheetBuilder_text1')))) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.MyContentCoverBuilder_text4')))) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_006_end'); + }) + + /* + * @tc.number: BindSheet_BindContentCoverTest_007 + * @tc.name: example_seven_BindContentCover + * @tc.desc: example_seven_BindContentCover + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindContentCoverTest_007', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_007_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindContentCover_label7')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.MyContentCoverBuilder_text2')))) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.MyContentCoverBuilder_text4')))) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindContentCoverTest_007_end'); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindSheet.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindSheet.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..acdceb865eb947af47ab885d48703557612d7472 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/BindSheet.test.ets @@ -0,0 +1,332 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'BindSheet_' +const TAG = '[Sample_BindSheet_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function BindSheetTest() { + describe('BindSheet_BindSheetTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.bindSheet', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: BindSheet_BindSheetTest_001 + * @tc.name: example_one_BindSheet + * @tc.desc: example_one_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label1')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change height')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Set Illegal height')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change height')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('close modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_001_end'); + + }) + + /* + * @tc.number: BindSheet_BindSheetTest_002 + * @tc.name: example_two_BindSheet + * @tc.desc: example_two_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label2')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let startX = Math.floor(size.x * 0.5) + let startY = Math.floor(size.y * 0.565) + let endX = Math.floor(size.x * 0.5) + let endY = Math.floor(size.y * 0.21186) + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + + await driver.swipe(endX, endY, startX, Math.floor(size.y * 0.53)); + await driver.delayMs(1000); + + await driver.swipe(endX, endY, startX, Math.floor(size.y * 0.883)); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_002_end'); + }) + + /* + * @tc.number: BindSheet_BindSheetTest_003 + * @tc.name: example_three_BindSheet + * @tc.desc: example_three_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label3')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_003_end'); + + }) + + /* + * @tc.number: BindSheet_BindSheetTest_004 + * @tc.name: example_four_BindSheet + * @tc.desc: example_four_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label4')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('NoRegisterSpringback')) + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let x = Math.floor(size.x * 0.5) + await driver.swipe(x, Math.floor(size.y * 0.4125), x, Math.floor(size.y * 0.95)); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_004_end'); + }) + + + /* + * @tc.number: BindSheet_BindSheetTest_005 + * @tc.name: example_five_BindSheet + * @tc.desc: example_five_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label5')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let x = Math.floor(size.x * 0.5) + + await driver.swipe(x, Math.floor(size.y * 0.706), x, Math.floor(size.y * 0.353)); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_005_end'); + }) + + /* + * @tc.number: BindSheet_BindSheetTest_006 + * @tc.name: example_six_BindSheet + * @tc.desc: example_six_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label6')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('TextInput')) + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.pressBack(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_006_end'); + + }) + + /* + * @tc.number: BindSheet_BindSheetTest_007 + * @tc.name: example_seven_BindSheet + * @tc.desc: example_seven_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_007', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_007_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label7')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('transition modal 1')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_007_end'); + }) + + /* + * @tc.number: BindSheet_BindSheetTest_008 + * @tc.name: example_eight_BindSheet + * @tc.desc: example_eight_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_008', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_008_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label8')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.sideBuilder_text2')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_008_end'); + }) + + + /* + * @tc.number: BindSheet_BindSheetTest_009 + * @tc.name: example_nine_BindSheet + * @tc.desc: example_nine_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_009', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_009_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label9')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.temp9string_text9')))); + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.pressBack(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_009_end'); + }) + + /* + * @tc.number: BindSheet_BindSheetTest_0010 + * @tc.name: example_ten_BindSheet + * @tc.desc: example_ten_BindSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BindSheetTest_0010', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_010_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheet_label10')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Open Sheet')) + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let startX = Math.floor(size.x * 0.5) + let startY = Math.floor(size.y * 0.353) + let endX = Math.floor(size.x * 0.5) + let endY = Math.floor(size.y * 0.106) + + await driver.swipe(startX, Math.floor(size.y * 0.6356), endX, endY); + await driver.delayMs(1000); + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + + await driver.swipe(startX, Math.floor(size.y * 0.282), endX, Math.floor(size.y * 0.6356)); + await driver.delayMs(1000); + + await driver.swipe(startX, Math.floor(size.y * 0.53), endX, Math.floor(size.y * 0.8828)); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_BindSheetTest_010_end'); + }) + + }) + +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/List.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..873936a37bce082d47eeada32a07cb2274e87c39 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/List.test.ets @@ -0,0 +1,23 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { BindSheetTest } from './BindSheet.test'; +import { BindContentCoverTest } from './BindContentCover.test'; +import { OpenSheetTest } from './OpenSheet.test'; + +export default function testsuite() { + BindSheetTest(); + BindContentCoverTest(); + OpenSheetTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/OpenSheet.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/OpenSheet.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..6b89fb2fae9dd7e79996f04a4425a92fa7cc9e80 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/ets/test/OpenSheet.test.ets @@ -0,0 +1,122 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'BindSheet_' +const TAG = '[Sample_BindSheet_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function OpenSheetTest() { + describe('BindSheet_OpenSheetTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.bindSheet', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheetCmd_label')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: BindSheet_OpenSheetTest_001 + * @tc.name: example_one_OpenSheet + * @tc.desc: example_one_OpenSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OpenSheetTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheetCmd_label1')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Open BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_001_end'); + }) + + /* + * @tc.number: BindSheet_OpenSheetTest_002 + * @tc.name: example_two_OpenSheet + * @tc.desc: example_two_OpenSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OpenSheetTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheetCmd_label2')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Open BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Update BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_002_end'); + + }) + + /* + * @tc.number: BindSheet_OpenSheetTest_003 + * @tc.name: example_three_OpenSheet + * @tc.desc: example_three_OpenSheet + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OpenSheetTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.bindSheetCmd_label3')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Open BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Close BindSheet')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'BindSheet_OpenSheetTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/module.json5 b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..1cafc28b86d7d9f2b34f24d26a75c0dbd7299715 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/ohosTest/module.json5 @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry_test", + "type": "feature", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false + } +} diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/test/List.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..a60c87c5cbb0badf7c3fd8975034590e6fafa992 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/test/List.test.ets @@ -0,0 +1,19 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import localUnitTest from './LocalUnit.test'; + +export default function testsuite() { + localUnitTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/entry/src/test/LocalUnit.test.ets b/code/DocsSample/ArkUISample/BindSheet/entry/src/test/LocalUnit.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..841bfd77e56060e50ec0924302a5ae624e76e3aa --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/entry/src/test/LocalUnit.test.ets @@ -0,0 +1,47 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function localUnitTest() { + describe('localUnitTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }); + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }); + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }); + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }); + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + }); + }); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/BindSheet/hvigor/hvigor-config.json5 b/code/DocsSample/ArkUISample/BindSheet/hvigor/hvigor-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..a3a86df0cd5b8fbf375409dc5825e13202ab2284 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/hvigor/hvigor-config.json5 @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "6.0.0", + "dependencies": { + }, + "execution": { + // "analyze": "normal", /* Define the build analyze mode. Value: [ "normal" | "advanced" | false ]. Default: "normal" */ + // "daemon": true, /* Enable daemon compilation. Value: [ true | false ]. Default: true */ + // "incremental": true, /* Enable incremental compilation. Value: [ true | false ]. Default: true */ + // "parallel": true, /* Enable parallel compilation. Value: [ true | false ]. Default: true */ + // "typeCheck": false, /* Enable typeCheck. Value: [ true | false ]. Default: false */ + }, + "logging": { + // "level": "info" /* Define the log level. Value: [ "debug" | "info" | "warn" | "error" ]. Default: "info" */ + }, + "debugging": { + // "stacktrace": false /* Disable stacktrace compilation. Value: [ true | false ]. Default: false */ + }, + "nodeOptions": { + // "maxOldSpaceSize": 8192 /* Enable nodeOptions maxOldSpaceSize compilation. Unit M. Used for the daemon process. Default: 8192*/ + // "exposeGC": true /* Enable to trigger garbage collection explicitly. Default: true*/ + } +} diff --git a/code/DocsSample/ArkUISample/BindSheet/hvigorfile.ts b/code/DocsSample/ArkUISample/BindSheet/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..6b365cacd0191d3b1178eb6b9807b1ae0add6271 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { appTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: appTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/BindSheet/oh-package.json5 b/code/DocsSample/ArkUISample/BindSheet/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..41b8b63948628728b745e7be8cd53d68d9345b75 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "6.0.0", + "description": "Please describe the basic information.", + "dependencies": { + }, + "devDependencies": { + "@ohos/hypium": "1.0.21", + "@ohos/hamock": "1.0.0" + } +} diff --git a/code/DocsSample/ArkUISample/BindSheet/ohosTest.md b/code/DocsSample/ArkUISample/BindSheet/ohosTest.md new file mode 100644 index 0000000000000000000000000000000000000000..11efe52ebecd2768d1daa51e242a99faa1a14fd3 --- /dev/null +++ b/code/DocsSample/ArkUISample/BindSheet/ohosTest.md @@ -0,0 +1,9 @@ +# BindSheet 测试用例归档 + +## 用例表 + +| 测试功能 | 预置条件 | 输入 | 预期输出 | 是否自动 | 测试结果 | +| ------------------- | -------------- | ----------------------- | ------------------------------------------------------------ | :------- | -------- | +| 全模态转场示例代码验证 | 设备正常运行 | 进入各个示例页面，唤起全模态 | 全模态行为正常，布局正确 | 是 | Pass | +| 半模态转场示例代码验证 | 设备正常运行 | 进入各个示例页面，唤起半模态 | 半模态行为正常，布局正确 | 是 | Pass | +| 命令式打开半模态示例代码验证 | 设备正常运行 | 进入各个示例页面，通过命令式打开半模态 | 半模态行为正常，布局正确 | 是 | Pass | diff --git a/code/DocsSample/ArkUISample/BindSheet/screenshots/device/image1.png b/code/DocsSample/ArkUISample/BindSheet/screenshots/device/image1.png new file mode 100644 index 0000000000000000000000000000000000000000..5c18b3a39d518f752050fd5193355d5a3884eea4 Binary files /dev/null and b/code/DocsSample/ArkUISample/BindSheet/screenshots/device/image1.png differ diff --git a/code/DocsSample/ArkUISample/ImageComponent/entry/src/main/ets/pages/Index.ets b/code/DocsSample/ArkUISample/ImageComponent/entry/src/main/ets/pages/Index.ets index be1564aa78756c18822f640f3debca82c171dac9..e91dc73ff96d039e8ad1a1de3c94d90cb7a828a0 100644 --- a/code/DocsSample/ArkUISample/ImageComponent/entry/src/main/ets/pages/Index.ets +++ b/code/DocsSample/ArkUISample/ImageComponent/entry/src/main/ets/pages/Index.ets @@ -78,7 +78,7 @@ struct Index { Column() { Text($r('app.string.ImageShow')) .height('8.00%') - .width("100%") + .width('100%') .textAlign(TextAlign.Center) .fontSize(20) .fontWeight(FontWeight.Bold) @@ -96,7 +96,7 @@ struct Index { .maxLines(1) Text(listitem.description) - .width("100%") + .width('100%') } .margin({ bottom: index >= demandList.length - 1 ? 100 : 0 }) .padding({ diff --git a/code/DocsSample/ArkUISample/Navigation/.gitignore b/code/DocsSample/ArkUISample/Navigation/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..d2ff20141ceed86d87c0ea5d99481973005bab2b --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/.gitignore @@ -0,0 +1,12 @@ +/node_modules +/oh_modules +/local.properties +/.idea +**/build +/.hvigor +.cxx +/.clangd +/.clang-format +/.clang-tidy +**/.test +/.appanalyzer \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/AppScope/app.json5 b/code/DocsSample/ArkUISample/Navigation/AppScope/app.json5 new file mode 100644 index 0000000000000000000000000000000000000000..f89fd6f71567e9d32e05e1d5a1dc2d7638db531e --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/AppScope/app.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "bundleName": "com.samples.navigation", + "vendor": "example", + "versionCode": 1000000, + "versionName": "1.0.0", + "icon": "$media:layered_image", + "label": "$string:app_name" + } +} diff --git a/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/element/string.json b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..03ada0a8e4aaf97e7e46249cd02c9bc407d865fe --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/element/string.json @@ -0,0 +1,8 @@ +{ + "string": [ + { + "name": "app_name", + "value": "Navigation" + } + ] +} diff --git a/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/background.png b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/AppScope/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/README_zh.md b/code/DocsSample/ArkUISample/Navigation/README_zh.md new file mode 100644 index 0000000000000000000000000000000000000000..abf2fb7b653fd2166720f0db5b84be28146b11cb --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/README_zh.md @@ -0,0 +1,133 @@ +# ArkUI使用导航组件指南文档示例 + +### 介绍 + +本示例通过使用[ArkUI指南文档](https://gitee.com/openharmony/docs/tree/master/zh-cn/application-dev/ui)中各场景的开发示例，展示在工程中，帮助开发者更好地理解ArkUI提供的组件及组件属性并合理使用。该工程中展示的代码详细描述可查如下链接： + +1. [Navigation](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-navigation.md)。 +2. [NavDestination](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-navdestination.md)。 +3. [无感监听](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-arkui-observer.md)。 +4. [SideBarContainer](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-container-sidebarcontainer.md) +5. [NavPathStack派生类](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-custom-component-api.md) +6. [Router](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-router.md) +7. [Stepper](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-stepper.md) + +### 效果预览 + +| 首页 | +|------------------------------------| +| ![](screenshots/device/image1.png) | + +### 使用说明 + +1. 在主界面，可以点击对应卡片，选择需要参考的组件示例。 + +2. 在组件目录选择详细的示例参考。 + +3. 进入示例界面，查看参考示例。 + +4. 通过自动测试框架可进行测试及维护。 + +### 工程目录 +``` +entry/src/main/ets/ +|---entryability +|---pages +| |---navDestination // NavDestination +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| |---navigation // Navigation +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| | |---template5 +| | | |---Index.ets +| | |---template6 +| | | |---Index.ets +| | |---template7 +| | | |---Index.ets +| | |---template8 +| | | |---Index.ets +| | |---template9 +| | | |---Index.ets +| | |---template10 +| | | |---Index.ets +| | |---template11 +| | | |---Index.ets +| | |---template12 +| | | |---Index.ets +| | |---template13 +| | | |---Index.ets +| |---navPathStackExtend // NavPathStack派生类 +| | |---template1 +| | | |---Index.ets +| |---observer // 无感监听 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| |---router // Router +| | |---template1 +| | | |---Index.ets +| |---sideBarContainer // SideBarContainer +| | |---template1 +| | | |---Index.ets +| |---stepper // Stepper +| | |---template1 +| | | |---Index.ets +|---pages +| |---Index.ets // 应用主页面 +entry/src/ohosTest/ +|---ets +| |---test +| | |---NavDestination.test.ets // NavDestination示例代码测试代码 +| | |---Navigation.test.ets // Navigation示例代码测试代码 +| | |---QueryNavDestinationInfo.test.ets // NavPathStack派生类示例代码测试代码 +| | |---Router.test.ets // Router示例代码测试代码 +| | |---SideBarContainer.test.ets // SideBarContainer示例代码测试代码 +| | |---Stepper.test.ets // Stepper示例代码测试代码 +| | |---UiObserver.test.ets // 无感监听示例代码测试代码 +``` + +### 相关权限 + +不涉及。 + +### 依赖 + +不涉及。 + +### 约束与限制 + +1.本示例仅支持标准系统上运行, 支持设备：RK3568。 + +2.本示例为Stage模型，支持API18版本SDK，版本号：5.1.0.56，镜像版本号：OpenHarmony_5.1.0.56。 + +3.本示例需要使用DevEco Studio 6.0.0 Canary1 (Build Version: 6.0.0.270， built on May 9, 2025)及以上版本才可编译运行。 + +### 下载 + +如需单独下载本工程，执行如下命令： + +```` +git init +git config core.sparsecheckout true +echo code/DocsSample/ArkUIDocSample/Navigation > .git/info/sparse-checkout +git remote add origin https://gitee.com/openharmony/applications_app_samples.git +git pull origin master +```` \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/build-profile.json5 b/code/DocsSample/ArkUISample/Navigation/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..e1244ceecbe969910aa0eb4f5ec4543c58ee4225 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/build-profile.json5 @@ -0,0 +1,56 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "signingConfigs": [], + "products": [ + { + "name": "default", + "signingConfig": "default", + "targetSdkVersion": "20", + "compatibleSdkVersion": "20", + "runtimeOS": "OpenHarmony", + "buildOption": { + "strictMode": { + "caseSensitiveCheck": true, + "useNormalizedOHMUrl": true + } + } + } + ], + "buildModeSet": [ + { + "name": "debug", + }, + { + "name": "release" + } + ] + }, + "modules": [ + { + "name": "entry", + "srcPath": "./entry", + "targets": [ + { + "name": "default", + "applyToProducts": [ + "default" + ] + } + ] + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/code-linter.json5 b/code/DocsSample/ArkUISample/Navigation/code-linter.json5 new file mode 100644 index 0000000000000000000000000000000000000000..5c4682f8164874ec7e9cb8f99ff8b3228ffbc126 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/code-linter.json5 @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "files": [ + "**/*.ets" + ], + "ignore": [ + "**/src/ohosTest/**/*", + "**/src/test/**/*", + "**/src/mock/**/*", + "**/node_modules/**/*", + "**/oh_modules/**/*", + "**/build/**/*", + "**/.preview/**/*" + ], + "ruleSet": [ + "plugin:@performance/recommended", + "plugin:@typescript-eslint/recommended" + ], + "rules": { + "@security/no-unsafe-aes": "error", + "@security/no-unsafe-hash": "error", + "@security/no-unsafe-mac": "warn", + "@security/no-unsafe-dh": "error", + "@security/no-unsafe-dsa": "error", + "@security/no-unsafe-ecdsa": "error", + "@security/no-unsafe-rsa-encrypt": "error", + "@security/no-unsafe-rsa-sign": "error", + "@security/no-unsafe-rsa-key": "error", + "@security/no-unsafe-dsa-key": "error", + "@security/no-unsafe-dh-key": "error", + "@security/no-unsafe-3des": "error" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/.gitignore b/code/DocsSample/ArkUISample/Navigation/entry/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..e2713a2779c5a3e0eb879efe6115455592caeea5 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/.gitignore @@ -0,0 +1,6 @@ +/node_modules +/oh_modules +/.preview +/build +/.cxx +/.test \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/build-profile.json5 b/code/DocsSample/ArkUISample/Navigation/entry/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..982dbb524bd63408e05cfbed7204dd87a31dd681 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/build-profile.json5 @@ -0,0 +1,42 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "apiType": "stageMode", + "buildOption": { + }, + "buildOptionSet": [ + { + "name": "release", + "arkOptions": { + "obfuscation": { + "ruleOptions": { + "enable": false, + "files": [ + "./obfuscation-rules.txt" + ] + } + } + } + }, + ], + "targets": [ + { + "name": "default" + }, + { + "name": "ohosTest", + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/hvigorfile.ts b/code/DocsSample/ArkUISample/Navigation/entry/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..8774588471ede4c1563f09d9a1d22f764bb1fd9e --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hapTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/Navigation/entry/obfuscation-rules.txt b/code/DocsSample/ArkUISample/Navigation/entry/obfuscation-rules.txt new file mode 100644 index 0000000000000000000000000000000000000000..272efb6ca3f240859091bbbfc7c5802d52793b0b --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/obfuscation-rules.txt @@ -0,0 +1,23 @@ +# Define project specific obfuscation rules here. +# You can include the obfuscation configuration files in the current module's build-profile.json5. +# +# For more details, see +# https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/source-obfuscation-V5 + +# Obfuscation options: +# -disable-obfuscation: disable all obfuscations +# -enable-property-obfuscation: obfuscate the property names +# -enable-toplevel-obfuscation: obfuscate the names in the global scope +# -compact: remove unnecessary blank spaces and all line feeds +# -remove-log: remove all console.* statements +# -print-namecache: print the name cache that contains the mapping from the old names to new names +# -apply-namecache: reuse the given cache file + +# Keep options: +# -keep-property-name: specifies property names that you want to keep +# -keep-global-name: specifies names that you want to keep in the global scope + +-enable-property-obfuscation +-enable-toplevel-obfuscation +-enable-filename-obfuscation +-enable-export-obfuscation \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/oh-package.json5 b/code/DocsSample/ArkUISample/Navigation/entry/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..10cda399b0aec3099b257299a57d284393e4e55a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "name": "entry", + "version": "1.0.0", + "description": "Please describe the basic information.", + "main": "", + "author": "", + "license": "", + "dependencies": {} +} + diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entryability/EntryAbility.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entryability/EntryAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..081b700cacec6def24d204fbc37ab93985f7b4ec --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entryability/EntryAbility.ets @@ -0,0 +1,95 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AbilityConstant, ConfigurationConstant, UIAbility, Want } from '@kit.AbilityKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { display, uiObserver, window } from '@kit.ArkUI'; + +const DOMAIN = 0x0000; + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +function callBackFunc2(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag2 navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +export default class EntryAbility extends UIAbility { + onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { + this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onCreate'); + uiObserver.on('navDestinationSwitch', this.context, callBackFunc); + uiObserver.on('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc2); + } + + onDestroy(): void { + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onDestroy'); + uiObserver.off('navDestinationSwitch', this.context, callBackFunc); + uiObserver.off('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc); + } + + onWindowStageCreate(windowStage: window.WindowStage): void { + // Main window is created, set main page for this ability + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); + let mainWindow: window.Window; + try { + mainWindow = windowStage.getMainWindowSync(); + let displayClass: display.Display = display.getDefaultDisplaySync(); + AppStorage.setOrCreate('orientation', displayClass.orientation); + // 监听窗口的windowsSizeChange事件，旋转屏时会触发该事件 + mainWindow.on('windowSizeChange', (data) => { + console.info('Succeeded in enabling the listener for window size changes. Data: ' + JSON.stringify(data)); + let displayClass: display.Display | null = null; + try { + displayClass = display.getDefaultDisplaySync(); + console.info('display orientation is ' + JSON.stringify(displayClass.orientation)); + // 获取屏幕的显示方向 + AppStorage.set('orientation', displayClass.orientation); + } catch { + return; + } + }) + } catch { + hilog.info(0x0000, 'testTag', '%{public}s', 'error'); + return; + } + windowStage.loadContent('pages/Index', (err) => { + if (err.code) { + hilog.error(DOMAIN, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err)); + return; + } + hilog.info(DOMAIN, 'testTag', 'Succeeded in loading the content.'); + }); + } + + onWindowStageDestroy(): void { + // Main window is destroyed, release UI related resources + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); + } + + onForeground(): void { + // Ability has brought to foreground + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onForeground'); + } + + onBackground(): void { + // Ability has back to background + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onBackground'); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..4ce6449f0e91914e73d4502c9f2e8e9a395ea4b1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets @@ -0,0 +1,30 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { BackupExtensionAbility, BundleVersion } from '@kit.CoreFileKit'; + +const DOMAIN = 0x0000; + +export default class EntryBackupAbility extends BackupExtensionAbility { + async onBackup() { + hilog.info(DOMAIN, 'testTag', 'onBackup ok'); + await Promise.resolve(); + } + + async onRestore(bundleVersion: BundleVersion) { + hilog.info(DOMAIN, 'testTag', 'onRestore ok %{public}s', JSON.stringify(bundleVersion)); + await Promise.resolve(); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..780b1537c307dfbb5c6b3ccb5dcf930de6542fc7 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/Index.ets @@ -0,0 +1,206 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import curves from '@ohos.curves'; +import { Route, RouteGroup } from './common/Index'; +import { KeyboardAvoidMode } from '@kit.ArkUI'; +import router from '@ohos.router'; + +@Styles +function cardPressedStyle() { + .backgroundColor('rgba(0,0,0,0.1)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardNormalStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardDisabledStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(0.5) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + + +@Entry +@Component +struct Index { + @Provide('router') router: NavPathStack = new NavPathStack(); + @State routes: RouteGroup[] = [ + { + name: 'navigation', + label: 'Navigation', + children: [ + { name: 'template1/Index', label: $r('app.string.stepperIndex_text1') }, + { name: 'template2/Index', label: $r('app.string.stepperIndex_text2') }, + { name: 'template3/Index', label: $r('app.string.stepperIndex_text3') }, + { name: 'template4/Index', label: $r('app.string.stepperIndex_text4') }, + { name: 'template5/Index', label: $r('app.string.stepperIndex_text5') }, + { name: 'template6/Index', label: $r('app.string.stepperIndex_text6') }, + { name: 'template7/Index', label: $r('app.string.stepperIndex_text7') }, + { name: 'template8/Index', label: $r('app.string.stepperIndex_text8') }, + { name: 'template9/Index', label: $r('app.string.stepperIndex_text9') }, + { name: 'template10/Index', label: $r('app.string.stepperIndex_text10') }, + { name: 'template11/Index', label: $r('app.string.stepperIndex_text11') }, + { name: 'template12/Index', label: $r('app.string.stepperIndex_text12') }, + { name: 'template13/Index', label: $r('app.string.stepperIndex_text13') }, + ] + }, + { + name: 'navDestination', + label: 'NavDestination', + children: [ + { name: 'template1/Index', label: $r('app.string.stepperIndex_text14') }, + { name: 'template2/Index', label: $r('app.string.stepperIndex_text15') }, + { name: 'template3/Index', label: $r('app.string.stepperIndex_text16') }, + { name: 'template4/Index', label: $r('app.string.stepperIndex_text17') }, + ] + }, { + name: 'observer', + label: $r('app.string.stepperIndex_text18'), + children: [ + { name: 'template1/Index', label: "uiObserver.on('navDestinationUpdate')" }, + { name: 'template2/Index', label: $r('app.string.stepperIndex_text19') }, + { name: 'template3/Index', label: "uiObserver.on('navDestinationSwitch')" }, + { name: 'template4/Index', label: $r('app.string.stepperIndex_text20') }, + ] + }, { + name: 'sideBarContainer', + label: 'SideBarContainer', + children: [ + { name: 'template1/Index', label: $r('app.string.stepperIndex_text21') }, + ] + }, { + name: "navPathStackExtend", + label: $r('app.string.stepperIndex_text22'), + children: [ + { name: 'template1/Index', label: "queryNavDestinationInfo18+" }, + ] + }, { + name: 'router', + label: 'Router', + children: [ + { name: 'template1/Index', label: $r('app.string.stepperIndex_text23') }, + ] + }, { + name: 'stepper', + label: 'Stepper', + children: [ + { name: 'template1/Index', label: $r('app.string.stepperIndex_text21') }, + ] + } + ]; + @State selection: string | null = null; + + @Builder + ListItemGroupHeader(route: RouteGroup) { + Row() { + Text(route.label) + .fontColor($r('sys.color.ohos_id_color_text_primary')) + .fontWeight(FontWeight.Medium) + + Blank() + + Text(`${route.children.length}`) + .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .opacity(this.selection === route.name ? 0 : 1) + + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + .rotate({ angle: this.selection === route.name ? 90 : 0 }) + .animation({ curve: curves.interpolatingSpring(0, 1, 228, 30) }) + } + .borderRadius(20) + .width('100%') + .padding(8) + .enabled(!!route.children.length) + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .onClick(() => { + animateTo( + { curve: curves.interpolatingSpring(0, 1, 228, 25) }, + () => { + if (this.selection === route.name) { + this.selection = null; + } else { + this.selection = route.name; + } + }); + }) + } + + aboutToAppear(): void{ + this.getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE); + } + build() { + Column() { + Text('Index') + List() { + ForEach(this.routes, (routeGroup: RouteGroup) => { + ListItemGroup({ + header: this.ListItemGroupHeader(routeGroup), + style: ListItemGroupStyle.CARD, + }) { + if (routeGroup.name === this.selection) { + ForEach(routeGroup.children, (route: Route) => { + ListItem() { + Row() { + Text(route.label).fontSize(16) + Blank() + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + } + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .borderRadius(20) + .padding(8) + .transition( + TransitionEffect.OPACITY.animation({ + curve: curves.interpolatingSpring(0, 1, 228, 30) + }) + ) + .width('100%') + .onClick(() => { + const name = `pages/${routeGroup.name}/${route.name}`; + router.pushUrl({url: name}) + }) + } + .width('100%') + }) + } + } + .padding(2) + .divider({ strokeWidth: 0.5 }) + }) + }.padding({bottom: 10}) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/common/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/common/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..02c5c6b987280c6731d3e40af7c56c416176a3af --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/common/Index.ets @@ -0,0 +1,23 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export interface Route { + name: string; + label: ResourceStr; +} + +export interface RouteGroup extends Route { + children: Route[]; +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..c010a77d33c4922be054e741464e6ee37fddc654 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template1/Index.ets @@ -0,0 +1,149 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { SymbolGlyphModifier } from '@kit.ArkUI'; + +@Component +struct MyPageOne { + private listScroller: Scroller = new Scroller(); + private scrollScroller: Scroller = new Scroller(); + private arr: number[] = []; + + aboutToAppear(): void { + for (let i = 0; i < 30; i++) { + this.arr.push(i); + } + } + + build() { + NavDestination() { + Scroll(this.scrollScroller) { + Column() { + List({ space: 0, initialIndex: 0, scroller: this.listScroller }) { + ForEach(this.arr, (item: number, index: number) => { + ListItem() { + Text('' + item) + .height(100) + .fontSize(16) + .textAlign(TextAlign.Center) + .width('90%') + .margin({ left: '5%' }) + .borderRadius(10) + .backgroundColor(Color.Gray) + } + }, (item: string) => item); + }.width('100%').height('80%').scrollBar(BarState.Off) + .nestedScroll({ scrollForward: NestedScrollMode.SELF_FIRST, scrollBackward: NestedScrollMode.SELF_FIRST }) + + ForEach(this.arr, (item: number, index: number) => { + ListItem() { + Text('' + item) + .height(100) + .fontSize(16) + .textAlign(TextAlign.Center) + .width('90%') + .margin({ top: '5%' }) + .borderRadius(10) + .backgroundColor(Color.Pink) + } + }, (item: string) => item); + } + } + .width('100%') + .scrollBar(BarState.Off) + .scrollable(ScrollDirection.Vertical) + .edgeEffect(EdgeEffect.Spring) + } + .title('PageOne', { backgroundColor: Color.Yellow, barStyle: BarStyle.STACK }) + .toolbarConfiguration([ + { + value: 'item1', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.phone_badge_star')) + } + ], { backgroundColor: Color.Orange, barStyle: BarStyle.STACK }) + // 绑定有父子关系的可滚动容器组件 + .bindToNestedScrollable([{ parent: this.scrollScroller, child: this.listScroller }]) + } +} + +@Component +struct MyPageTwo { + private listScroller: Scroller = new Scroller(); + private arr: number[] = []; + + aboutToAppear(): void { + for (let i = 0; i < 30; i++) { + this.arr.push(i); + } + } + + build() { + NavDestination() { + List({ scroller: this.listScroller }) { + ForEach(this.arr, (item: number, index: number) => { + ListItem() { + Text('' + item) + .height(100) + .fontSize(16) + .textAlign(TextAlign.Center) + .width('90%') + .margin({ left: '5%' }) + .borderRadius(10) + .backgroundColor(Color.Gray) + } + }, (item: string) => item); + }.width('100%') + } + .title('PageTwo', { backgroundColor: Color.Yellow, barStyle: BarStyle.STACK }) + .toolbarConfiguration([ + { + value: 'item1', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.phone_badge_star')) + } + ], { backgroundColor: Color.Orange, barStyle: BarStyle.STACK }) + // 绑定可滚动容器组件 + .bindToScrollable([this.listScroller]) + } +} + +@Entry +@Component +struct Index { + private stack: NavPathStack = new NavPathStack(); + + @Builder + MyPageMap(name: string) { + if (name === 'myPageOne') { + MyPageOne(); + } else { + MyPageTwo(); + } + } + + build() { + Navigation(this.stack) { + Column() { + Button('push PageOne').onClick(() => { + this.stack.pushPath({ name: 'myPageOne' }); + }) + Button('push PageTwo').onClick(() => { + this.stack.pushPath({ name: 'myPageTwo' }); + }) + }.height('40%').justifyContent(FlexAlign.SpaceAround) + }.width('100%') + .height('100%') + .title({ main: 'MainTitle', sub: 'subTitle' }) + .navDestination(this.MyPageMap) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template2/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d079e388f44f7db45f5dc6bdc650e7805cfd2946 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template2/Index.ets @@ -0,0 +1,139 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavDestinationCustomTransition { + stack: NavPathStack = new NavPathStack(); + + @Builder + pageMap(name: string) { + if (name) { + NavDest(); + } + } + + aboutToAppear(): void { + this.stack.pushPath({name: 'dest0'}); + } + + build() { + Navigation(this.stack) { + // empty + } + .navDestination(this.pageMap) + .hideNavBar(true) + .title('Main Page') + .titleMode(NavigationTitleMode.Mini) + } +} + +declare type voidFunc = () => void; + +@Component +struct NavDest { + @State name: string = 'NA'; + @State destWidth: string = '100%'; + stack: NavPathStack = new NavPathStack(); + @State y: string = '0'; + + build() { + NavDestination() { + Column() { + Button('push next page', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.stack.pushPath({ name: this.name == 'PageOne' ? 'PageTwo' : 'PageOne' }); + }) + } + .size({ width: '100%', height: '100%' }) + } + .title(this.name) + .translate({ y: this.y }) + .onReady((context) => { + this.name = context.pathInfo.name; + this.stack = context.pathStack; + }) + .backgroundColor(this.name == 'PageOne' ? '#F1F3F5' : '#ff11dee5') + .customTransition( + (op: NavigationOperation, isEnter: boolean) + : Array | undefined => { + console.log('[NavDestinationTransition]', 'reached delegate in frontend, op: ' + op + ', isEnter: ' + isEnter); + + let transitionOneEvent: voidFunc = () => { console.log('[NavDestinationTransition]', 'reached transitionOne, empty now!'); } + let transitionOneFinishEvent: voidFunc = () => { console.log('[NavDestinationTransition]', 'reached transitionOneFinish, empty now!'); } + let transitionOneDuration: number = 500; + if (op === NavigationOperation.PUSH) { + if (isEnter) { + // ENTER_PUSH + this.y = '100%'; + transitionOneEvent = () => { + console.log('[NavDestinationTransition]', 'transitionOne, push & isEnter'); + this.y = '0'; + } + } else { + // EXIT_PUSH + this.y = '0'; + transitionOneEvent = () => { + console.log('[NavDestinationTransition]', 'transitionOne, push & !isEnter'); + this.y = '0'; + } + transitionOneDuration = 450; + } + } else if (op === NavigationOperation.POP) { + if (isEnter) { + // ENTER_POP + this.y = '0'; + transitionOneEvent = () => { + console.log('[NavDestinationTransition]', 'transitionOne, pop & isEnter'); + this.y = '0'; + } + } else { + // EXIT_POP + this.y = '0'; + transitionOneEvent = () => { + console.log('[NavDestinationTransition]', 'transitionOne, pop & !isEnter'); + this.y = '100%'; + } + } + } else { + console.log('[NavDestinationTransition]', '----- NOT-IMPL BRANCH of NAV-DESTINATION CUSTOM TRANSITION -----'); + } + + let transitionOne: NavDestinationTransition = { + duration: transitionOneDuration, + delay: 0, + curve: Curve.Friction, + event: transitionOneEvent, + onTransitionEnd: transitionOneFinishEvent + }; + + let transitionTwoEvent: voidFunc = () => { console.log('[NavDestinationTransition]', 'reached transitionTwo, empty now!'); } + let transitionTwo: NavDestinationTransition = { + duration: 1000, + delay: 0, + curve: Curve.EaseInOut, + event: transitionTwoEvent, + onTransitionEnd: () => { console.log('[NavDestinationTransition]', 'reached Two\'s finish'); } + }; + + return [ + transitionOne, + transitionTwo, + ]; + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template3/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..68ac1ba301cd1929e7a204e0b6f00b5f9f542872 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template3/Index.ets @@ -0,0 +1,253 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavDestinationSystemTransition { + @Provide stack: NavPathStack = new NavPathStack() + @Provide homePageTransitionType: NavigationSystemTransitionType = NavigationSystemTransitionType.DEFAULT; + + @Builder + pageMap(name: string) { + if (name === 'Fade') { + Fade(); + } else if (name === 'Explode') { + Explode(); + } else if (name === 'SlideRight') { + SlideRight(); + } else if (name === 'SlideBottom') { + SlideBottom(); + } else { + Dest(); + } + } + + aboutToAppear(): void { + this.stack.pushPath({name: 'Dest'}); + } + + build() { + Navigation(this.stack) { + // empty + } + .navDestination(this.pageMap) + .hideNavBar(true) + } +} + +@Component +struct Dest { + @Consume stack: NavPathStack; + @Consume homePageTransitionType: NavigationSystemTransitionType; + @State name: string = 'NA'; + + build() { + NavDestination() { + HomeBody(); + } + .title('Navigation System Animation') + .onReady((context) => { + this.name = context.pathInfo.name; + }) + .systemTransition(this.homePageTransitionType) + } +} + +@Component +struct Fade { + @Consume stack: NavPathStack; + @State name: string = 'NA'; + + build() { + NavDestination() { + DestBody({ + name: this.name + }) + } + .title(this.name) + .onReady((context) => { + this.name = context.pathInfo.name; + }) + .systemTransition(NavigationSystemTransitionType.FADE) + } +} + +@Component +struct Explode { + @Consume stack: NavPathStack; + @State name: string = 'NA'; + + build() { + NavDestination() { + DestBody({ + name: this.name + }) + } + .title(this.name) + .onReady((context) => { + this.name = context.pathInfo.name; + }) + .systemTransition(NavigationSystemTransitionType.EXPLODE) + } +} + +@Component +struct SlideRight { + @Consume stack: NavPathStack; + @State name: string = 'NA'; + + build() { + NavDestination() { + DestBody({ + name: this.name + }) + } + .title(this.name) + .onReady((context) => { + this.name = context.pathInfo.name; + }) + .systemTransition(NavigationSystemTransitionType.SLIDE_RIGHT) + } +} + +@Component +struct SlideBottom { + @Consume stack: NavPathStack; + @State name: string = 'NA'; + + build() { + NavDestination() { + DestBody({ + name: this.name + }) + } + .title(this.name) + .onReady((context) => { + this.name = context.pathInfo.name; + }) + .systemTransition(NavigationSystemTransitionType.SLIDE_BOTTOM) + } +} + +@Component +struct DestBody { + name: string = 'NA'; + + columnTextSize: number = 22; + columnTextFontWeight: FontWeight = FontWeight.Bolder; + columnWidth: string = '65%'; + columnPadding: number = 22; + columnMargin: number = 10; + columnBorderRadius: number = 10; + + build() { + Column() { + Column() + .width('85') + .height(50) + .backgroundColor(Color.White) + Column() { + Text(this.name) + .fontSize(this.columnTextSize) + .fontWeight(this.columnTextFontWeight) + } + .width(this.columnWidth) + .padding(this.columnPadding) + .margin(this.columnMargin) + .borderRadius(this.columnBorderRadius) + .shadow(ShadowStyle.OUTER_DEFAULT_LG) + } + } +} + +@Component +struct HomeBody { + @Consume stack: NavPathStack; + @Consume homePageTransitionType: NavigationSystemTransitionType; + + columnTextSize: number = 22; + columnTextFontWeight: FontWeight = FontWeight.Bolder; + columnWidth: string = '85%'; + columnPadding: number = 22; + columnMargin: number = 10; + columnBorderRadius: number = 10; + columnShadow: ShadowStyle = ShadowStyle.OUTER_DEFAULT_MD; + + build() { + Column() { + Search({ value: 'Search' }) + .width(this.columnWidth) + + Column() { + Text('fade') + .fontSize(this.columnTextSize) + .fontWeight(this.columnTextFontWeight) + } + .width(this.columnWidth) + .padding(this.columnPadding) + .margin(this.columnMargin) + .borderRadius(this.columnBorderRadius) + .shadow(this.columnShadow) + .onClick(() => { + this.homePageTransitionType = NavigationSystemTransitionType.FADE; + this.stack.pushPath({name: 'Fade'}); + }) + + Column() { + Text('explode') + .fontSize(this.columnTextSize) + .fontWeight(this.columnTextFontWeight) + } + .width(this.columnWidth) + .padding(this.columnPadding) + .margin(this.columnMargin) + .borderRadius(this.columnBorderRadius) + .shadow(this.columnShadow) + .onClick(() => { + this.homePageTransitionType = NavigationSystemTransitionType.EXPLODE; + this.stack.pushPath({name: 'Explode'}); + }) + + Column() { + Text('slide right') + .fontSize(this.columnTextSize) + .fontWeight(this.columnTextFontWeight) + } + .width(this.columnWidth) + .padding(this.columnPadding) + .margin(this.columnMargin) + .borderRadius(this.columnBorderRadius) + .shadow(this.columnShadow) + .onClick(() => { + this.homePageTransitionType = NavigationSystemTransitionType.SLIDE_RIGHT; + this.stack.pushPath({name: 'SlideRight'}); + }) + + Column() { + Text('slide bottom') + .fontSize(this.columnTextSize) + .fontWeight(this.columnTextFontWeight) + } + .width(this.columnWidth) + .padding(this.columnPadding) + .margin(this.columnMargin) + .borderRadius(this.columnBorderRadius) + .shadow(this.columnShadow) + .onClick(() => { + this.homePageTransitionType = NavigationSystemTransitionType.SLIDE_BOTTOM; + this.stack.pushPath({name: 'SlideBottom'}); + }) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template4/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..78ec74b946b720b50e08dd4d6c971481356f1d57 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navDestination/template4/Index.ets @@ -0,0 +1,90 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { window } from '@kit.ArkUI'; + +@Component +struct PortraitPage { + private stack: NavPathStack | undefined = undefined; + build() { + NavDestination() { + Stack({alignContent: Alignment.Center}) { + Button('push LANDSCAPE page').onClick(() => { + this.stack?.pushPath({name: 'landscape'}); + }) + }.width('100%').height('100%') + } + .width('100%').height('100%') + .title('PortraitPage') + .preferredOrientation(window.Orientation.PORTRAIT) // 竖屏方向 + .enableStatusBar(true) // 显示状态栏 + .enableNavigationIndicator(true) // 显示导航条 + .backgroundColor('#ffbaece9') + .onReady((ctx: NavDestinationContext) => { + this.stack = ctx.pathStack; + }) + } +} + +@Component +struct LandscapePage { + private stack: NavPathStack | undefined = undefined; + build() { + NavDestination() { + Stack({alignContent: Alignment.Center}) { + Button('push PORTRAIT page').onClick(() => { + this.stack?.pushPath({name: 'portrait'}); + }) + }.width('100%').height('100%') + } + .width('100%').height('100%') + .title('LandscapePage') + .preferredOrientation(window.Orientation.LANDSCAPE) // 横屏方向 + .enableStatusBar(false) // 隐藏状态栏 + .enableNavigationIndicator(false) // 隐藏导航条 + .backgroundColor('#ffecb8b8') + .ignoreLayoutSafeArea([LayoutSafeAreaType.SYSTEM], [LayoutSafeAreaEdge.TOP, LayoutSafeAreaEdge.BOTTOM]) + .onReady((ctx: NavDestinationContext) => { + this.stack = ctx.pathStack; + }) + } +} + +@Entry +@Component +struct ExamplePage { + private stack: NavPathStack = new NavPathStack(); + + aboutToAppear(): void { + this.stack.pushPath({name: "portrait"}); + } + + @Builder + MyPageMap(name: string) { + if (name === 'portrait') { + PortraitPage(); + } else { + LandscapePage(); + } + } + + build() { + Navigation(this.stack) { + } + .width('100%') + .height('100%') + .hideNavBar(true) + .navDestination(this.MyPageMap) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..60bb0af102985a7559b2128b49768ec68964b5be --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/Index.ets @@ -0,0 +1,33 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavPathStackExtendExample { + pageInfo: NavPathStack = new NavPathStack(); + + build() { + Navigation(this.pageInfo) { + Column() { + Button('pageOne', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfo.pushPath({ name: 'navPath-pageOne' }); // 将name指定的NavDestination页面信息入栈。 + }) + } + }.title('NavIndex') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/PageOne.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/PageOne.ets new file mode 100644 index 0000000000000000000000000000000000000000..425a821bbe9a7347e42df99d50049b85d97cfa93 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navPathStackExtend/template1/PageOne.ets @@ -0,0 +1,73 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiObserver } from '@kit.ArkUI'; + +@Builder +export function PageOneBuilder() { + PageOneComponent() +} + +@Component +export struct PageOneComponent { + navDesInfo: uiObserver.NavDestinationInfo | undefined; + @State text: string = ''; + build() { + NavDestination() { + Column() { + Button($r('app.string.navStackTemp1PageOne_text1')) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + // 向内查询PageOne的NavDestination信息 + this.navDesInfo = this.queryNavDestinationInfo(true); + this.text = JSON.stringify(this.navDesInfo?.name); + }) + Text($r('app.string.navStackTemp1PageOne_text2') + this.text) + .width('80%') + .height(50) + .margin(50) + .fontSize(20) + MyComponent() + }.width('100%').height('100%') + } + .title('pageOne') + } +} + +@Component +struct MyComponent { + navDesInfo: uiObserver.NavDestinationInfo | undefined; + @State text: string = ''; + + build() { + Column() { + Button($r('app.string.navStackTemp1PageOne_text3')) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + // 向外查询PageOne的NavDestination信息 + this.navDesInfo = this.queryNavDestinationInfo(false); + this.text = JSON.stringify(this.navDesInfo?.name); + }) + Text($r('app.string.navStackTemp1PageOne_text4') + this.text) + .width('80%') + .height(50) + .margin(50) + .fontSize(20) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..527e65866b25b77ddc8f4ddaf8e63ae6d3178ab3 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template1/Index.ets @@ -0,0 +1,111 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +class A { + text: string = ''; + num: number = 0; +} + +@Entry +@Component +struct NavigationExample1 { + private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; + @State currentIndex: number = 0; + + @Builder + NavigationTitle() { + Column() { + Text('Title') + .fontColor('#182431') + .fontSize(30) + .lineHeight(41) + .fontWeight(700) + Text('subtitle') + .fontColor('#182431') + .fontSize(14) + .lineHeight(19) + .opacity(0.4) + .margin({ top: 2, bottom: 20 }) + }.alignItems(HorizontalAlign.Start) + } + + @Builder + NavigationMenus() { + Row() { + Image('resources/base/media/ic_public_add.svg') + .width(24) + .height(24) + Image('resources/base/media/ic_public_add.svg') + .width(24) + .height(24) + .margin({ left: 24 }) + Image('common/ic_public_more.svg') + .width(24) + .height(24) + .margin({ left: 24 }) + } + } + + build() { + Column() { + Navigation() { + TextInput({ placeholder: 'search...' }) + .width('90%') + .height(40) + .backgroundColor('#FFFFFF') + .margin({ top: 8 }) + + List({ space: 12, initialIndex: 0 }) { + ForEach(this.arr, (item: number) => { + ListItem() { + Text('' + item) + .width('90%') + .height(72) + .backgroundColor('#FFFFFF') + .borderRadius(24) + .fontSize(16) + .fontWeight(500) + .textAlign(TextAlign.Center) + } + }, (item: number) => item.toString()) + } + .height(324) + .width('100%') + .margin({ top: 12, left: '10%' }) + } + .title(this.NavigationTitle) + .menus(this.NavigationMenus) + .titleMode(NavigationTitleMode.Full) + .toolbarConfiguration([ + { + value: $r("app.string.navigation_toolbar_add"), + icon: $r("app.media.ic_public_highlightsed") + }, + { + value: $r("app.string.navigation_toolbar_app"), + icon: $r("app.media.ic_public_highlights") + }, + { + value: $r("app.string.navigation_toolbar_collect"), + icon: $r("app.media.ic_public_highlights") + } + ]) + .hideTitleBar(false) + .hideToolBar(false) + .onTitleModeChange((titleModel: NavigationTitleMode) => { + console.info('titleMode' + titleModel) + }) + }.width('100%').height('100%').backgroundColor('#F1F3F5') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template10/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template10/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..dff172ab459c5128d9e55e94fbed51678481d725 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template10/Index.ets @@ -0,0 +1,127 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +class DerivedNavPathStack extends NavPathStack { + // usr defined property 'id' + id: string = "__default__"; + + // new function in derived class + setId(id: string) { + this.id = id; + } + + // new function in derived class + getInfo(): string { + return 'this page used Derived NavPathStack, id: ' + this.id; + } + + // overwrite function of NavPathStack + pushPath(info: NavPathInfo, animated?: boolean): void + pushPath(info: NavPathInfo, options?: NavigationOptions): void + pushPath(info: NavPathInfo, secArg?: boolean | NavigationOptions): void { + console.log('[derive-test] reached DerivedNavPathStack\'s pushPath'); + if (typeof secArg === 'boolean') { + super.pushPath(info, secArg); + } else { + super.pushPath(info, secArg); + } + } + + // overwrite and overload function of NavPathStack + pop(animated?: boolean | undefined): NavPathInfo | undefined + pop(result: Object, animated?: boolean | undefined): NavPathInfo | undefined + pop(result?: Object, animated?: boolean | undefined): NavPathInfo | undefined { + console.log('[derive-test] reached DerivedNavPathStack\'s pop'); + return super.pop(result, animated); + } + + // other function of base class... +} + +class param { + info: string = "__default_param__"; + + constructor(info: string) { + this.info = info; + } +} + +@Entry +@Component +struct NavigationExample10 { + derivedStack: DerivedNavPathStack = new DerivedNavPathStack(); + + aboutToAppear(): void { + this.derivedStack.setId('origin stack'); + } + + @Builder + pageMap(name: string) { + PageOne(); + } + + build() { + Navigation(this.derivedStack) { + Button('to Page One').margin(20).onClick(() => { + this.derivedStack.pushPath({ + name: 'pageOne', + param: new param('push pageOne in homePage when stack size: ' + this.derivedStack.size()) + }); + }) + }.navDestination(this.pageMap) + .title('Home Page') + } +} + +@Component +struct PageOne { + derivedStack: DerivedNavPathStack = new DerivedNavPathStack(); + curStringifyParam: string = "NA"; + + build() { + NavDestination() { + Column() { + Text(this.derivedStack.getInfo()) + .margin(10) + .fontSize(25) + .fontWeight(FontWeight.Bold) + .textAlign(TextAlign.Start) + Text('current page param info:') + .margin(10) + .fontSize(25) + .fontWeight(FontWeight.Bold) + .textAlign(TextAlign.Start) + Text(this.curStringifyParam) + .margin(20) + .fontSize(20) + .textAlign(TextAlign.Start) + }.backgroundColor(Color.Pink) + + Button('to Page One').margin(20).onClick(() => { + this.derivedStack.pushPath({ + name: 'pageOne', + param: new param('push pageOne in pageOne when stack size: ' + this.derivedStack.size()) + }); + }) + }.title('Page One') + .onReady((context: NavDestinationContext) => { + console.log('[derive-test] reached PageOne\'s onReady'); + // get derived stack from navdestinationContext + this.derivedStack = context.pathStack as DerivedNavPathStack; + console.log('[derive-test] -- got derivedStack: ' + this.derivedStack.id); + this.curStringifyParam = JSON.stringify(context.pathInfo.param); + console.log('[derive-test] -- got param: ' + this.curStringifyParam); + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template11/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template11/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..7b94914fb690fbb9209a63b3e7b359ed2e007352 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template11/Index.ets @@ -0,0 +1,130 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { SymbolGlyphModifier } from '@kit.ArkUI'; + +@Entry +@Component +struct NavigationExample11 { + @Provide('navPathStack') navPathStack: NavPathStack = new NavPathStack(); + @State menuItems: Array = [ + { + value: 'menuItem1', + icon: 'resources/base/media/ic_public_ok.svg' // 图标资源路径 + }, + { + value: 'menuItem2', + icon: 'resources/base/media/ic_public_ok.svg', // 图标资源路径 + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, Color.Green]) + .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + }, + { + value: 'menuItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + }, + ]; + @State toolItems: Array = [ + { + value: 'toolItem1', + icon: 'resources/base/media/ic_public_ok.svg', // 图标资源路径 + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + status: ToolbarItemStatus.ACTIVE, + activeSymbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, + Color.Green]).renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + action: () => { + } + }, + { + value: 'toolItem2', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_star')), + status: ToolbarItemStatus.ACTIVE, + activeIcon: 'resources/base/media/ic_public_more.svg', // 图标资源路径 + action: () => { + } + }, + { + value: 'toolItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_star')), + status: ToolbarItemStatus.ACTIVE, + activeSymbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + action: () => { + } + } + ]; + + @Builder + myRouter(name: string, param?: Object) { + if (name === 'NavigationMenu') { + NavigationMenu(); + } + } + + build() { + Navigation(this.navPathStack) { + Column() { + Button('跳转').onClick(() => { + this.navPathStack.pushPathByName('NavigationMenu', null); + }) + } + } + .backButtonIcon(new SymbolGlyphModifier($r('sys.symbol.ohos_wifi'))) + .titleMode(NavigationTitleMode.Mini) + .menus(this.menuItems) + .toolbarConfiguration(this.toolItems) + .title('一级页面') + .navDestination(this.myRouter) + } +} + +@Component +export struct NavigationMenu { + @Consume('navPathStack') navPathStack: NavPathStack; + @State menuItems: Array = [ + { + value: 'menuItem1', + icon: 'resources/base/media/ic_public_ok.svg', // 图标资源路径 + action: () => { + } + }, + { + value: 'menuItem2', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, Color.Green]) + .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + action: () => { + } + }, + { + value: 'menuItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.repeat_1')), + action: () => { + } + }, + ]; + + build() { + NavDestination() { + Row() { + Column() { + } + .width('100%') + } + .height('100%') + } + .hideTitleBar(false) + .title('NavDestination title') + .backgroundColor($r('sys.color.ohos_id_color_titlebar_sub_bg')) + .backButtonIcon(new SymbolGlyphModifier($r('sys.symbol.ohos_star')).fontColor([Color.Blue])) + .menus(this.menuItems) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template12/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template12/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..b91c58e0cd8dc6eb0c69b7670e596b37fb1fbb00 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template12/Index.ets @@ -0,0 +1,228 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { LengthMetrics } from '@kit.ArkUI'; +import { TextModifier } from '@ohos.arkui.modifier'; + +class MainTitleTextModfier extends TextModifier { + useStyle1: boolean = true; + + applyNormalAttribute(instance: TextModifier): void { + if (this.useStyle1) { + console.log(`testTag mainTitle use style1`); + instance.fontColor('#FFFFC000'); + instance.fontSize(35); + instance.fontWeight(FontWeight.Bolder); + instance.fontStyle(FontStyle.Normal); + instance.textShadow({ radius: 5, offsetX: 9 }); + } else { + console.log(`testTag mainTitle use style2`); + instance.fontColor('#FF23A98D'); + instance.fontSize(20); + instance.heightAdaptivePolicy(TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST); + instance.fontWeight(FontWeight.Lighter); + instance.fontStyle(FontStyle.Italic); + instance.textShadow({ radius: 3, offsetX: 3 }); + } + } +} + +class SubTitleTextModfier extends TextModifier { + useStyle1: boolean = true; + + applyNormalAttribute(instance: TextModifier): void { + if (this.useStyle1) { + console.log(`testTag subTitle use style1`); + instance.fontColor('#FFFFC000'); + instance.fontSize(15); + instance.fontWeight(FontWeight.Bolder); + instance.fontStyle(FontStyle.Normal); + instance.textShadow({ radius: 5, offsetX: 9 }); + } else { + console.log(`testTag subTitle use style2`); + instance.fontColor('#FF23A98D'); + instance.fontSize(10); + instance.fontWeight(FontWeight.Lighter); + instance.fontStyle(FontStyle.Italic); + instance.textShadow({ radius: 3, offsetX: 3 }); + } + } +} + +@Entry +@Component +struct NavigationExample12 { + private navPathStack: NavPathStack = new NavPathStack(); + // 初始化标题栏起始端内间距 + @State paddingStart: LengthMetrics = LengthMetrics.vp(0); + // 初始化标题栏结束端内间距 + @State paddingEnd: LengthMetrics = LengthMetrics.vp(0); + // 主标题样式修改器 + @State mainTitleModifier: MainTitleTextModfier = new MainTitleTextModfier(); + // 副标题样式修改器 + @State subTitleModifier: SubTitleTextModfier = new SubTitleTextModfier(); + @State applyModifier: boolean = false; + @State useStyle1: boolean = true; + + @Builder + myRouter(name: string, param?: Object) { + if (name === 'NavDestinationExample') { + NavDestinationExample(); + } + } + + build() { + Navigation(this.navPathStack) { + Column() { + // 标题栏内间距切换 + Button('apply padding 32vp') + .onClick(() => { + this.paddingStart = LengthMetrics.vp(32); + this.paddingEnd = LengthMetrics.vp(32); + }) + .margin({ top: 70 }) + .width(180) + Button('apply padding 20vp') + .onClick(() => { + this.paddingStart = LengthMetrics.vp(20); + this.paddingEnd = LengthMetrics.vp(20); + }) + .margin({ top: 40 }) + .width(180) + Button('pushPage') + .onClick(() => { + this.navPathStack.pushPath({ name: 'NavDestinationExample' }); + }) + .margin({ top: 40 }) + .width(180) + Row() { + Text(`apply Modifier`) + Toggle({ isOn: this.applyModifier, type: ToggleType.Switch }).onChange((isOn: boolean) => { + this.applyModifier = isOn; + }) + } + .padding({ top: 95, left: 5, right: 5 }) + .width(180) + .justifyContent(FlexAlign.SpaceBetween) + + Row() { + Text(`use Style1`) + Toggle({ isOn: this.useStyle1, type: ToggleType.Switch }).onChange((isOn: boolean) => { + this.mainTitleModifier.useStyle1 = isOn; + this.subTitleModifier.useStyle1 = isOn; + this.useStyle1 = isOn; + }) + } + .padding({ top: 40, left: 5, right: 5 }) + .width(180) + .justifyContent(FlexAlign.SpaceBetween) + } + .width('100%') + .height('100%') + } + .titleMode(NavigationTitleMode.Full) + .title( + { main: "Title", sub: "subTitle" }, + this.applyModifier ? + { + paddingStart: this.paddingStart, + paddingEnd: this.paddingEnd, + mainTitleModifier: this.mainTitleModifier, + subTitleModifier: this.subTitleModifier, + } : { + paddingStart: this.paddingStart, + paddingEnd: this.paddingEnd + }) + .navDestination(this.myRouter) + } +} + +@Component +export struct NavDestinationExample { + @State menuItems: Array = [ + { + value: 'menuItem1', + icon: 'resources/base/media/ic_public_ok.svg', // 图标资源路径 + action: () => { + } + } + ]; + @State paddingStart: LengthMetrics = LengthMetrics.vp(0); + @State paddingEnd: LengthMetrics = LengthMetrics.vp(0); + // 主标题样式修改器 + @State mainTitleModifier: MainTitleTextModfier = new MainTitleTextModfier(); + // 副标题样式修改器 + @State subTitleModifier: SubTitleTextModfier = new SubTitleTextModfier(); + @State applyModifier: boolean = false; + @State useStyle1: boolean = true; + + build() { + NavDestination() { + Column() { + // 标题栏内间距切换 + Button('apply padding 32vp') + .onClick(() => { + this.paddingStart = LengthMetrics.vp(32); + this.paddingEnd = LengthMetrics.vp(32); + }) + .margin({ top: 150 }) + .width(180) + Button('apply padding 20vp') + .onClick(() => { + this.paddingStart = LengthMetrics.vp(20); + this.paddingEnd = LengthMetrics.vp(20); + }) + .margin({ top: 40 }) + .width(180) + Row() { + Text(`apply Modifier`) + Toggle({ isOn: this.applyModifier, type: ToggleType.Switch }).onChange((isOn: boolean) => { + this.applyModifier = isOn; + }) + } + .padding({ top: 95, left: 5, right: 5 }) + .width(180) + .justifyContent(FlexAlign.SpaceBetween) + + Row() { + Text(`use Style1`) + Toggle({ isOn: this.useStyle1, type: ToggleType.Switch }).onChange((isOn: boolean) => { + this.mainTitleModifier.useStyle1 = isOn; + this.subTitleModifier.useStyle1 = isOn; + this.useStyle1 = isOn; + }) + } + .padding({ top: 40, left: 5, right: 5 }) + .width(180) + .justifyContent(FlexAlign.SpaceBetween) + } + .width('100%') + .height('90%') + } + .hideTitleBar(false) + .title( + { main: "Title", sub: "subTitle" }, + this.applyModifier ? + { + paddingStart: this.paddingStart, + paddingEnd: this.paddingEnd, + mainTitleModifier: this.mainTitleModifier, + subTitleModifier: this.subTitleModifier, + } : { + paddingStart: this.paddingStart, + paddingEnd: this.paddingEnd + }) + .menus(this.menuItems) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/CustomTransitionUtils.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/CustomTransitionUtils.ets new file mode 100644 index 0000000000000000000000000000000000000000..3fbdf84261fefde046f9b30317010debaab1336a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/CustomTransitionUtils.ets @@ -0,0 +1,54 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export interface AnimateCallback { + start: ((isPush: boolean, isExit: boolean) => void | undefined) | undefined; + finish: ((isPush: boolean, isExit: boolean) => void | undefined) | undefined; +} + +const customTransitionMap: Map = new Map(); + +export class CustomTransition { + static delegate = new CustomTransition(); + + static getInstance() { + return CustomTransition.delegate; + } + + registerNavParam(name: string, startCallback: (isPush: boolean, isExit: boolean) => void, + endCallback: (isPush: boolean, isExit: boolean) => void): void { + if (customTransitionMap.has(name)) { + let param = customTransitionMap.get(name); + if (param != undefined) { + param.start = startCallback; + param.finish = endCallback; + return; + } + } + let params: AnimateCallback = { start: startCallback, finish: endCallback }; + customTransitionMap.set(name, params); + } + + unRegisterNavParam(name: string): void { + customTransitionMap.delete(name); + } + + getAnimateParam(name: string): AnimateCallback { + let result: AnimateCallback = { + start: customTransitionMap.get(name)?.start, + finish: customTransitionMap.get(name)?.finish + }; + return result; + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a0fea22b7ed5c0aae413ac6152734ad4638cba48 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template13/Index.ets @@ -0,0 +1,180 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AnimateCallback, CustomTransition } from './CustomTransitionUtils' + +@Entry +@Component +struct NavigationCustomTransitionExample { + pageInfos: NavPathStack = new NavPathStack(); + + aboutToAppear() { + this.pageInfos.pushPath({ name: 'temp13-PageOne' }, false); + } + + build() { + Navigation(this.pageInfos) { + } + .hideNavBar(true) + .customNavContentTransition((from: NavContentInfo, to: NavContentInfo, operation: NavigationOperation) => { + // 首页不进行自定义动画 + if (from.index === -1 || to.index === -1) { + return undefined; + } + + let customAnimation: NavigationAnimatedTransition = { + timeout: 2000, + // 转场开始时系统调用该方法，并传入转场上下文代理对象 + transition: (transitionProxy: NavigationTransitionProxy) => { + if (!from.navDestinationId || !to.navDestinationId) { + return; + } + // 从封装类CustomTransition中根据子页面的序列获取对应的转场动画回调 + let fromParam: AnimateCallback = CustomTransition.getInstance().getAnimateParam(from.navDestinationId); + let toParam: AnimateCallback = CustomTransition.getInstance().getAnimateParam(to.navDestinationId); + // Push动画 + if (operation == NavigationOperation.PUSH) { + if (fromParam.start && toParam.start) { + // 设置Push转场的两个页面的动画起点 + fromParam.start(true, true); + toParam.start(true, false); + } + this.getUIContext()?.animateTo({ + duration: 500, curve: Curve.Friction, onFinish: () => { + // 动画结束后需要手动调用finishTransition，否则在timeout时间后由系统调用 + transitionProxy.finishTransition(); + } + }, () => { + if (fromParam.finish && toParam.finish) { + // 设置Push转场的两个页面的动画终点 + fromParam.finish(true, true); + toParam.finish(true, false); + } + + }) + } else if (operation == NavigationOperation.POP) { + // Pop动画 + if (fromParam.start && toParam.start) { + // 设置Pop转场的两个页面的动画起点 + fromParam.start(false, true); + toParam.start(false, false); + } + this.getUIContext()?.animateTo({ + duration: 500, curve: Curve.Friction, onFinish: () => { + // 动画结束后需要手动调用finishTransition，否则在timeout时间后由系统调用 + transitionProxy.finishTransition(); + } + }, () => { + if (fromParam.finish && toParam.finish) { + // 设置Pop转场的两个页面的动画终点 + fromParam.finish(false, true); + toParam.finish(false, false); + } + }) + } else { + // Replace不做动画 + } + } + }; + return customAnimation; + }) + } +} + + +// PageOne +@Builder +export function PageOneBuilder() { + PageContainer({ title: 'PageOne' }); +} + +// PageTwo +@Builder +export function PageTwoBuilder() { + PageContainer({ title: 'PageTwo' }); +} + +@Component +export struct PageContainer { + pageInfos: NavPathStack = new NavPathStack(); + @State translateY: string = '0'; + pageId: string = ''; + title: string = '' + + registerCallback() { + CustomTransition.getInstance().registerNavParam(this.pageId, + // 设置转场动画起点，根据不同的转场类型分别设置 + (isPush: boolean, isExit: boolean) => { + if (isPush) { + if (isExit) { + this.translateY = '0'; + } else { + this.translateY = '100%'; + } + } else { + if (isExit) { + this.translateY = '0'; + } else { + this.translateY = '0'; + } + } + }, + // 设置转场动画终点，根据不同的转场类型分别设置 + (isPush: boolean, isExit: boolean) => { + if (isPush) { + if (isExit) { + this.translateY = '0'; + } else { + this.translateY = '0'; + } + } else { + if (isExit) { + this.translateY = '100%'; + } else { + this.translateY = '0'; + } + } + }); + } + + build() { + NavDestination() { + Column() { + Button('push next page', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.pushPath({ name: this.title == 'PageOne' ? "temp13-PageTwo" : "temp13-PageOne" }); + }) + } + .size({ width: '100%', height: '100%' }) + } + .title(this.title) + .onDisAppear(() => { + // 页面销毁时解注册自定义转场动画参数 + CustomTransition.getInstance().unRegisterNavParam(this.pageId); + }) + .onReady((context: NavDestinationContext) => { + this.pageInfos = context.pathStack; + if (context.navDestinationId) { + this.pageId = context.navDestinationId; + // 页面创建时注册自定义转场动画参数 + this.registerCallback(); + } + }) + .translate({ y: this.translateY }) + .backgroundColor(this.title == 'PageOne' ? '#F1F3F5' : '#ff11dee5') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..9f97f0f56dbca1f139fa02da7b4a51b71b90cc4a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/Index.ets @@ -0,0 +1,92 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavigationExample2 { + pageInfos: NavPathStack = new NavPathStack(); + isUseInterception: boolean = false; + + registerInterception() { + this.pageInfos.setInterception({ + // 页面跳转前拦截，允许操作栈，在当前跳转中生效。 + willShow: (from: NavDestinationContext | "navBar", to: NavDestinationContext | "navBar", + operation: NavigationOperation, animated: boolean) => { + if (!this.isUseInterception) { + return; + } + if (typeof to === "string") { + console.log('target page is navigation home'); + return; + } + // 重定向目标页面，更改为pageTwo页面到pageOne页面。 + let target: NavDestinationContext = to as NavDestinationContext; + if (target.pathInfo.name === 'pageTwo') { + target.pathStack.pop(); + target.pathStack.pushPathByName('pageOne', null); + } + }, + // 页面跳转后回调，在该回调中操作栈在下一次跳转中刷新。 + didShow: (from: NavDestinationContext | "navBar", to: NavDestinationContext | "navBar", + operation: NavigationOperation, isAnimated: boolean) => { + if (!this.isUseInterception) { + return; + } + if (typeof from === "string") { + console.log('current transition is from navigation home'); + } else { + console.log(`current transition is from ${(from as NavDestinationContext).pathInfo.name}`); + } + if (typeof to === "string") { + console.log('current transition to is navBar'); + } else { + console.log(`current transition is to ${(to as NavDestinationContext).pathInfo.name}`); + } + }, + // Navigation单双栏显示状态发生变更时触发该回调。 + modeChange: (mode: NavigationMode) => { + if (!this.isUseInterception) { + return; + } + console.log(`current navigation mode is ${mode}`); + } + }) + } + + build() { + Navigation(this.pageInfos) { + Column() { + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.pushPath({ name: 'pageOne' }); //将name指定的NavDestination页面信息入栈 + }) + Button('use interception', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.isUseInterception = !this.isUseInterception; + if (this.isUseInterception) { + this.registerInterception(); + } else { + this.pageInfos.setInterception(undefined); + } + }) + } + }.title('NavIndex') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageOne.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageOne.ets new file mode 100644 index 0000000000000000000000000000000000000000..be41e252e07868859e71adcf40b1d50ecb62caf8 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageOne.ets @@ -0,0 +1,113 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +class TmpClass { + count: number = 10; +} + +@Builder +export function PageOneBuilder(name: string, param: Object) { + PageOne() +} + +@Component +export struct PageOne { + pageInfos: NavPathStack = new NavPathStack(); + + build() { + NavDestination() { + Column() { + Button('pushPathByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + let tmp = new TmpClass(); + this.pageInfos.pushPathByName('pageTwo', tmp); //将name指定的NavDestination页面信息入栈，传递的数据为param + }) + Button('singletonLaunchMode', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.pushPath({ name: 'pageOne' }, + { launchMode: LaunchMode.MOVE_TO_TOP_SINGLETON }); //从栈底向栈顶查找，如果指定的名称已经存在，则将对应的NavDestination页面移到栈顶 + }) + Button('popToname', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.popToName('pageTwo'); //回退路由栈到第一个名为name的NavDestination页面 + console.log('popToName' + JSON.stringify(this.pageInfos), + 'Return value' + JSON.stringify(this.pageInfos.popToName('pageTwo'))); + }) + Button('popToIndex', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.popToIndex(1); // 回退路由栈到index指定的NavDestination页面 + console.log('popToIndex' + JSON.stringify(this.pageInfos)); + }) + Button('moveToTop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.moveToTop('pageTwo'); // 将第一个名为name的NavDestination页面移到栈顶 + console.log('moveToTop' + JSON.stringify(this.pageInfos), + 'Return value' + JSON.stringify(this.pageInfos.moveToTop('pageTwo'))); + }) + Button('moveIndexToTop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.moveIndexToTop(1); // 将index指定的NavDestination页面移到栈顶 + console.log('moveIndexToTop' + JSON.stringify(this.pageInfos)); + }) + Button('clear', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfos.clear(); //清除栈中所有页面 + }) + Button('get', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + console.log('-------------------'); + console.log('Get the names of all NavDestination pages in the stack.', JSON.stringify(this.pageInfos.getAllPathName())); + console.log('Get the parameter information of the NavDestination page specified by index.', + JSON.stringify(this.pageInfos.getParamByIndex(1))); + console.log('Get all parameter information of NavDestination pages named "name"', + JSON.stringify(this.pageInfos.getParamByName('pageTwo'))); + console.log('Get the position indices of all NavDestination pages named "name"', + JSON.stringify(this.pageInfos.getIndexByName('pageOne'))); + console.log('Get the stack size', JSON.stringify(this.pageInfos.size())); + }) + }.width('100%').height('100%') + }.title('pageOne') + .onBackPressed(() => { + const popDestinationInfo = this.pageInfos.pop(); // 弹出路由栈栈顶元素 + console.log('pop' + 'Return value' + JSON.stringify(popDestinationInfo)); + return true; + }).onReady((context: NavDestinationContext) => { + this.pageInfos = context.pathStack; + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageTwo.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageTwo.ets new file mode 100644 index 0000000000000000000000000000000000000000..936d5ea8d8280f19ecd67d70b05bd6ff4f966cce --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template2/PageTwo.ets @@ -0,0 +1,62 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Builder +export function PageTwoBuilder(name: string, param: Object) { + PageTwo() +} + +@Component +export struct PageTwo { + pathStack: NavPathStack = new NavPathStack(); + private menuItems: Array = [ + { + value: "1", + icon: 'resources/base/media/undo.svg', + }, + { + value: "2", + icon: 'resources/base/media/redo.svg', + isEnabled: false, + }, + { + value: "3", + icon: 'resources/base/media/ic_public_ok.svg', + isEnabled: true, + } + ]; + + build() { + NavDestination() { + Column() { + Button('pushPathByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.pushPathByName('pageOne', null); + }) + }.width('100%').height('100%') + }.title('pageTwo') + .menus(this.menuItems) + .onBackPressed(() => { + this.pathStack.pop(); + return true; + }) + .onReady((context: NavDestinationContext) => { + this.pathStack = context.pathStack; + console.log('current page config info is ' + JSON.stringify(context.getConfigInRouteMap())); + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/CustomNavigationUtils.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/CustomNavigationUtils.ets new file mode 100644 index 0000000000000000000000000000000000000000..c9f4a40f163197f40b78b1953883a2b01b66c72b --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/CustomNavigationUtils.ets @@ -0,0 +1,140 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export interface AnimateCallback { + finish: ((isPush: boolean, isExit: boolean) => void | undefined) | undefined; + start: ((isPush: boolean, isExit: boolean) => void | undefined) | undefined; + onFinish: ((isPush: boolean, isExit: boolean) => void | undefined) | undefined; + interactive: ((operation: NavigationOperation) => void | undefined) | undefined; + timeout: (number | undefined) | undefined; +} + +const customTransitionMap: Map = new Map(); + +export class CustomTransition { + static delegate = new CustomTransition(); + public interactive: boolean = false; + proxy: NavigationTransitionProxy | undefined = undefined; + private animationId: number = 0; + public operation: NavigationOperation = NavigationOperation.PUSH; + + static getInstance() { + return CustomTransition.delegate; + } + + registerNavParam(name: string, startCallback: (operation: boolean, isExit: boolean) => void, + endCallback: (operation: boolean, isExit: boolean) => void, + onFinish: (operation: boolean, isExit: boolean) => void, + interactiveCallback: (operation: NavigationOperation) => void, + timeout: number): void { + if (customTransitionMap.has(name)) { + let param = customTransitionMap.get(name); + if (param != undefined) { + param.start = startCallback; + param.finish = endCallback; + param.timeout = timeout; + param.onFinish = onFinish; + param.interactive = interactiveCallback; + return; + } + } + let params: AnimateCallback = { + timeout: timeout, + start: startCallback, + finish: endCallback, + onFinish: onFinish, + interactive: interactiveCallback + }; + customTransitionMap.set(name, params); + } + + getAnimationId() { + return Date.now(); + } + + unRegisterNavParam(name: string): void { + customTransitionMap.delete(name); + } + + fireInteractiveAnimation(id: string, operation: NavigationOperation) { + let animation = customTransitionMap.get(id)?.interactive; + if (!animation) { + return; + } + animation(operation); + } + + updateProgress(progress: number) { + if (!this.proxy?.updateTransition) { + return; + } + progress = this.operation == NavigationOperation.PUSH ? 1 - progress : progress; + this.proxy?.updateTransition(progress); + } + + cancelTransition() { + if (this.proxy?.cancelTransition) { + this.proxy.cancelTransition(); + } + } + + recoverState() { + if (!this.proxy?.from.navDestinationId || !this.proxy?.to.navDestinationId) { + return; + } + let fromParam = customTransitionMap.get(this.proxy.from.navDestinationId); + if (fromParam?.onFinish) { + fromParam.onFinish(false, false); + } + let toParam = customTransitionMap.get(this.proxy?.to.navDestinationId); + if (toParam?.onFinish) { + toParam.onFinish(true, true); + } + } + + finishTransition() { + this.proxy?.finishTransition(); + } + + finishInteractiveAnimation(rate: number) { + if (this.operation == NavigationOperation.PUSH) { + if (rate > 0.5) { + if (this.proxy?.cancelTransition) { + this.proxy.cancelTransition(); + } + } else { + this.proxy?.finishTransition(); + } + } else { + if (rate > 0.5) { + this.proxy?.finishTransition(); + } else { + if (this.proxy?.cancelTransition) { + this.proxy.cancelTransition(); + } + } + } + } + + getAnimateParam(name: string): AnimateCallback { + let result: AnimateCallback = { + start: customTransitionMap.get(name)?.start, + finish: customTransitionMap.get(name)?.finish, + timeout: customTransitionMap.get(name)?.timeout, + onFinish: customTransitionMap.get(name)?.onFinish, + interactive: customTransitionMap.get(name)?.interactive, + }; + return result; + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..55602c33da4ea1aafb953b3f6dc556efb1082df1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/Index.ets @@ -0,0 +1,109 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { CustomTransition, AnimateCallback } from './CustomNavigationUtils' + +@Entry +@Component +export struct NavigationExample3 { + pageInfos: NavPathStack = new NavPathStack(); + + aboutToAppear() { + if (this.pageInfos === undefined) { + this.pageInfos = new NavPathStack(); + } + this.pageInfos.pushPath({ name: 'temp3-pageTwo', param: CustomTransition.getInstance().getAnimationId() }); + } + + build() { + Navigation(this.pageInfos) { + } + .title('NavIndex') + .hideNavBar(true) + .customNavContentTransition((from: NavContentInfo, to: NavContentInfo, operation: NavigationOperation) => { + if (from.mode == NavDestinationMode.DIALOG || to.mode == NavDestinationMode.DIALOG) { + return undefined; + } + + // 首页不进行自定义动画 + if (from.index === -1 || to.index === -1) { + return undefined; + } + + CustomTransition.getInstance().operation = operation; + if (CustomTransition.getInstance().interactive) { + let customAnimation: NavigationAnimatedTransition = { + onTransitionEnd: (isSuccess: boolean) => { + console.log('===== current transition is ' + isSuccess); + CustomTransition.getInstance().recoverState(); + CustomTransition.getInstance().proxy = undefined; + }, + transition: (transitionProxy: NavigationTransitionProxy) => { + CustomTransition.getInstance().proxy = transitionProxy; + let targetIndex: string | undefined = operation == NavigationOperation.PUSH ? + (to.navDestinationId) : (from.navDestinationId); + if (targetIndex) { + CustomTransition.getInstance().fireInteractiveAnimation(targetIndex, operation); + } + }, + isInteractive: CustomTransition.getInstance().interactive + } + return customAnimation; + } + let customAnimation: NavigationAnimatedTransition = { + onTransitionEnd: (isSuccess: boolean) => { + console.log(`current transition result is ${isSuccess}`); + }, + timeout: 7000, + // 转场开始时系统调用该方法，并传入转场上下文代理对象 + transition: (transitionProxy: NavigationTransitionProxy) => { + if (!from.navDestinationId || !to.navDestinationId) { + return; + } + // 从封装类CustomTransition中根据子页面的序列获取对应的转场动画回调 + let fromParam: AnimateCallback = CustomTransition.getInstance().getAnimateParam(from.navDestinationId); + let toParam: AnimateCallback = CustomTransition.getInstance().getAnimateParam(to.navDestinationId); + if (operation == NavigationOperation.PUSH) { + if (toParam.start) { + toParam.start(true, false); + } + this.getUIContext()?.animateTo({ + duration: 500, onFinish: () => { + transitionProxy.finishTransition(); + } + }, () => { + if (toParam.finish) { + toParam.finish(true, false); + } + }) + } else { + if (fromParam.start) { + fromParam.start(true, true); + } + this.getUIContext()?.animateTo({ + duration: 500, onFinish: () => { + transitionProxy.finishTransition(); + } + }, () => { + if (fromParam.finish) { + fromParam.finish(true, true); + } + }) + } + } + }; + return customAnimation; + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageOne.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageOne.ets new file mode 100644 index 0000000000000000000000000000000000000000..476e83b7c87aecf8668be957fa181b81423b9c29 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageOne.ets @@ -0,0 +1,121 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { CustomTransition } from './CustomNavigationUtils'; + +@Builder +export function PageOneBuilder(name: string, param: Object) { + PageOne() +} + +@Component +export struct PageOne { + pageInfos: NavPathStack = new NavPathStack(); + @State translateX: string = '0'; + pageId: string = ''; + rectWidth: number = 0; + interactive: boolean = false; + + registerCallback() { + CustomTransition.getInstance().registerNavParam(this.pageId, (isPush: boolean, isExit: boolean) => { + if (isPush) { + this.translateX = '100%'; + } else { + this.translateX = '0'; + } + }, (isPush: boolean, isExit: boolean) => { + if (isPush) { + this.translateX = '0'; + } else { + this.translateX = '100%'; + } + }, (isPush: boolean, isExit: boolean) => { + this.translateX = '0'; + }, (operation: NavigationOperation) => { + if (operation == NavigationOperation.PUSH) { + this.translateX = '100%'; + this.getUIContext()?.animateTo({ + duration: 1000, + onFinish: () => { + this.translateX = '0'; + } + }, () => { + this.translateX = '0'; + }) + } else { + this.translateX = '0'; + this.getUIContext()?.animateTo({ + duration: 1000, + onFinish: () => { + this.translateX = '0'; + } + }, () => { + this.translateX = '100%'; + }) + } + }, 200); + } + + build() { + NavDestination() { + Column() { + Button(`setInteractive`) + .onClick(() => { + CustomTransition.getInstance().interactive = !CustomTransition.getInstance().interactive; + this.interactive = CustomTransition.getInstance().interactive; + }) + + Button('pushPathByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + //将name指定的NavDestination页面信息入栈，传递的数据为param + this.pageInfos.pushDestinationByName('temp3-pageTwo', CustomTransition.getInstance().getAnimationId()); + }) + } + .size({ width: '100%', height: '100%' }) + } + .title('pageOne') + .onDisAppear(() => { + CustomTransition.getInstance().unRegisterNavParam(this.pageId); + }) + .onReady((context: NavDestinationContext) => { + this.pageInfos = context.pathStack; + if (context.navDestinationId) { + this.pageId = context.navDestinationId; + this.registerCallback(); + } + }) + .translate({ x: this.translateX }) + .backgroundColor('#F1F3F5') + .gesture(PanGesture() + .onActionStart((event: GestureEvent) => { + this.rectWidth = event.target.area.width as number; + if (event.offsetX < 0) { + this.pageInfos.pushPath({ name: 'temp3-pageTwo', param: CustomTransition.getInstance().getAnimationId() }); + } else { + this.pageInfos.pop(); + } + }) + .onActionUpdate((event: GestureEvent) => { + let rate = event.fingerList[0].localX / this.rectWidth; + CustomTransition.getInstance().updateProgress(rate); + }) + .onActionEnd((event: GestureEvent) => { + let rate: number = event.fingerList[0].localX / this.rectWidth; + CustomTransition.getInstance().finishInteractiveAnimation(rate); + })) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageTwo.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageTwo.ets new file mode 100644 index 0000000000000000000000000000000000000000..f1fbd15fa9143dba6adf101e5855c5299aae70c0 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template3/PageTwo.ets @@ -0,0 +1,116 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { CustomTransition } from './CustomNavigationUtils' + +@Builder +export function PageTwoBuilder(name: string, param: Object) { + PageTwo({ param: param as number }) +} + +@Component +export struct PageTwo { + pageInfos: NavPathStack = new NavPathStack(); + @State translateX: string = '0'; + pageId: string = ''; + rectWidth: number = 0; + param: number = 0; + + registerCallback() { + CustomTransition.getInstance().registerNavParam(this.pageId, (isPush: boolean, isExit: boolean) => { + if (isPush) { + this.translateX = '100%' + } else { + this.translateX = '0'; + } + }, (isPush: boolean, isExit: boolean) => { + if (isPush) { + this.translateX = '0'; + } else { + this.translateX = '100%'; + } + }, (isPush: boolean, isExit: boolean) => { + this.translateX = '0'; + }, (operation: NavigationOperation) => { + if (operation == NavigationOperation.PUSH) { + this.translateX = '100%'; + this.getUIContext()?.animateTo({ + duration: 500, onFinish: () => { + this.translateX = '0'; + } + }, () => { + this.translateX = '0'; + }) + } else { + this.translateX = '0'; + this.getUIContext()?.animateTo({ + duration: 500, onFinish: () => { + this.translateX = '0'; + } + }, () => { + this.translateX = '100%'; + }) + } + }, 2000) + } + + build() { + NavDestination() { + Column() { + Button('pushPathByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + //将name指定的NavDestination页面信息入栈，传递的数据为param + this.pageInfos.pushPath({ name: 'temp3-pageOne', param: CustomTransition.getInstance().getAnimationId() }); + }) + } + .size({ width: '100%', height: '100%' }) + } + .title('pageTwo') + .gesture(PanGesture() + .onActionStart((event: GestureEvent) => { + this.rectWidth = event.target.area.width as number; + if (event.offsetX < 0) { + this.pageInfos.pushPath({ name: 'temp3-pageOne', param: CustomTransition.getInstance().getAnimationId() }); + } else { + this.pageInfos.pop(); + } + }) + .onActionUpdate((event: GestureEvent) => { + let rate = event.fingerList[0].localX / this.rectWidth; + CustomTransition.getInstance().updateProgress(rate); + }) + .onActionEnd((event: GestureEvent) => { + let rate = event.fingerList[0].localX / this.rectWidth; + CustomTransition.getInstance().finishInteractiveAnimation(rate); + })) + .onAppear(() => { + this.registerCallback(); + }) + .onDisAppear(() => { + CustomTransition.getInstance().unRegisterNavParam(this.pageId); + }) + .onReady((context: NavDestinationContext) => { + this.pageInfos = context.pathStack; + if (context.navDestinationId) { + this.pageId = context.navDestinationId; + this.registerCallback(); + } + }) + .translate({ x: this.translateX }) + .backgroundColor(Color.Yellow) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..db408cbe1619e5f8cd03de6566582e289856eb12 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/Index.ets @@ -0,0 +1,33 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavigationExample4 { + pageInfo: NavPathStack = new NavPathStack(); + + build() { + Navigation(this.pageInfo) { + Column() { + Button('StartTest', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pageInfo.pushPath({ name: 'temp4-pageOne' }); // 将name指定的NavDestination页面信息入栈。 + }) + } + }.title('NavIndex') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageOne.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageOne.ets new file mode 100644 index 0000000000000000000000000000000000000000..a823ef1e880b01a02e96754ae176ffc82b488ffe --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageOne.ets @@ -0,0 +1,168 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { BusinessError } from '@kit.BasicServicesKit'; + +class TmpClass { + count: number = 10; +} + +class ParamWithOp { + public operation: number = 1; + public count: number = 10; +} + +@Builder +export function PageOneBuilder(name: string, param: Object) { + PageOne() +} + +@Component +export struct PageOne { + pageInfo: NavPathStack = new NavPathStack(); + @State message: string = 'Hello World'; + + build() { + NavDestination() { + Column() { + Text(this.message) + .width('80%') + .height(50) + .margin(10) + + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + this.pageInfo.pushPath({ + name: 'temp4-pageTwo', param: new ParamWithOp(), onPop: (popInfo: PopInfo) => { + this.message = + '[pushPath]last page is: ' + popInfo.info.name + ', result: ' + JSON.stringify(popInfo.result); + } + }); // 将name指定的NavDestination页面信息入栈，传递的数据为param，添加接收处理结果的onPop回调。 + }) + + Button('pushPathByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + this.pageInfo.pushPathByName('temp4-pageTwo', tmp, (popInfo) => { + this.message = + '[pushPathByName]last page is: ' + popInfo.info.name + ', result: ' + JSON.stringify(popInfo.result); + }); // 将name指定的NavDestination页面信息入栈，传递的数据为param，添加接收处理结果的onPop回调。 + }) + + Button('pushDestination', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + // 将name指定的NavDestination页面信息入栈，传递的数据为param，添加接收处理结果的onPop回调。 + this.pageInfo.pushDestination({ + name: 'temp4-pageTwo', param: new ParamWithOp(), onPop: (popInfo: PopInfo) => { + this.message = + '[pushDestination]last page is: ' + popInfo.info.name + ', result: ' + JSON.stringify(popInfo.result); + } + }).catch((error: BusinessError) => { + console.error(`[pushDestination]failed, error code = ${error.code}, error.message = ${error.message}.`); + }).then(() => { + console.error('[pushDestination]success.'); + }); + }) + + Button('pushDestinationByName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + // 将name指定的NavDestination页面信息入栈，传递的数据为param，添加接收处理结果的onPop回调。 + this.pageInfo.pushDestinationByName('temp4-pageTwo', tmp, (popInfo) => { + this.message = '[pushDestinationByName]last page is: ' + popInfo.info.name + ', result: ' + + JSON.stringify(popInfo.result); + }).catch((error: BusinessError) => { + console.error(`[pushDestinationByName]failed, error code = ${error.code}, error.message = ${error.message}.`); + }).then(() => { + console.error('[pushDestinationByName]success.'); + }); + }) + + Button('pushPathWithoutOnPop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + this.pageInfo.pushPath({ name: 'temp4-pageTwo', param: new ParamWithOp() }); // 将name指定的NavDestination页面信息入栈。 + }) + + Button('pushPathByNameWithoutOnPop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + this.pageInfo.pushPathByName('temp4-pageTwo', tmp); // 将name指定的NavDestination页面信息入栈，传递的数据为param。 + }) + + Button('pushDestinationWithoutOnPop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + // 将name指定的NavDestination页面信息入栈，传递的数据为param，添加接收处理结果的onPop回调。 + this.pageInfo.pushDestination({ name: 'temp4-pageTwo', param: new ParamWithOp() }) + .catch((error: BusinessError) => { + console.error(`[pushDestinationWithoutOnPop]failed, error code = ${error.code}, error.message = ${error.message}.`); + }).then(() => { + console.error('[pushDestinationWithoutOnPop]success.'); + }); + }) + + Button('pushDestinationByNameWithoutOnPop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + let tmp = new TmpClass(); + // 将name指定的NavDestination页面信息入栈，传递的数据为param。 + this.pageInfo.pushDestinationByName('temp4-pageTwo', tmp) + .catch((error: BusinessError) => { + console.error(`[pushDestinationByNameWithoutOnPop]failed, error code = ${error.code}, error.message = ${error.message}.`); + }).then(() => { + console.error('[pushDestinationByNameWithoutOnPop]success.'); + }); + }) + + Button('clear', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(10) + .onClick(() => { + this.pageInfo.clear(); // 清除栈中所有页面。 + }) + }.width('100%').height('100%') + }.title('pageOne') + .onBackPressed(() => { + this.pageInfo.pop({ number: 1 }); // 弹出路由栈栈顶元素。 + return true; + }).onReady((context: NavDestinationContext) => { + this.pageInfo = context.pathStack; + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageTwo.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageTwo.ets new file mode 100644 index 0000000000000000000000000000000000000000..70a0015d58b24ef5d3ea3238cca95da4d6f9b3e1 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template4/PageTwo.ets @@ -0,0 +1,92 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +class ResultClass { + constructor(count: number) { + this.count = count; + } + + public count: number = 10; +} + +@Builder +export function PageTwoBuilder() { + PageTwo(); +} + +@Component +export struct PageTwo { + pathStack: NavPathStack = new NavPathStack(); + + build() { + NavDestination() { + Column() { + Button('pop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.pop(new ResultClass(1)); // 回退到上一个页面，将处理结果传入push的onPop回调中。 + }) + + Button('popToName', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.popToName('temp4-pageOne', + new ResultClass(11)); // 将第一个名为name的NavDestination页面移到栈顶，将处理结果传入push的onPop回调中。 + }) + + Button('popToIndex', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.popToIndex(0, new ResultClass(111)); // 将index指定的NavDestination页面移到栈顶，将处理结果传入push的onPop回调中。 + }) + + Button('popWithoutResult', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.pop(); + }) + + Button('popToNameWithoutResult', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.popToName('temp4-pageOne'); + }) + + Button('popToIndexWithoutResult', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.pathStack.popToIndex(0); + }) + }.width('100%').height('100%') + }.title('pageTwo') + .onBackPressed(() => { + this.pathStack.pop(new ResultClass(0)); // 回退到上一个页面，将处理结果传入push的onPop回调。 + return true; + }).onReady((context: NavDestinationContext) => { + this.pathStack = context.pathStack; + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template5/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..6b8f8a72f7e0c5700da2dc82b03d27a2671eedc2 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template5/Index.ets @@ -0,0 +1,261 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +const COLOR1: string = "#80004AAF"; +const COLOR2: string = "#802787D9"; +const BLUR_STYLE_1: BlurStyle = BlurStyle.BACKGROUND_THIN; +const BLUR_STYLE_2: BlurStyle = BlurStyle.BACKGROUND_THICK; +const BLUR_STYLE_OPTION_1: BackgroundBlurStyleOptions = { + colorMode: ThemeColorMode.DARK, + adaptiveColor: AdaptiveColor.DEFAULT, + blurOptions: { grayscale: [20, 20] }, + scale: 1 +}; +const BLUR_STYLE_OPTION_2: BackgroundBlurStyleOptions = { + colorMode: ThemeColorMode.LIGHT, + adaptiveColor: AdaptiveColor.AVERAGE, + blurOptions: { grayscale: [20, 20] }, + scale: 1 +}; +const EFFECT_OPTION_1: BackgroundEffectOptions = { + radius: 20, + saturation: 10, + brightness: 0, + color: '#66FFFFFF', + adaptiveColor: AdaptiveColor.DEFAULT, + blurOptions: { grayscale: [0, 0] }, +}; +const EFFECT_OPTION_2: BackgroundEffectOptions = { + radius: 60, + saturation: 40, + brightness: 1, + color: '#661A1A1A', + adaptiveColor: AdaptiveColor.AVERAGE, + blurOptions: { grayscale: [20, 20] }, +}; + +@Component +struct BackComponent { + build() { + Row() { + Column() { + } + .height('100%') + .backgroundColor("#3D9DB4") + .layoutWeight(9) + + Column() { + } + .height('100%') + .backgroundColor("#17A98D") + .layoutWeight(9) + + Column() { + } + .height('100%') + .backgroundColor("#FFC000") + .layoutWeight(9) + } + .height('100%') + .width('100%') + } +} + +@Component +struct ColorAndBlur { + @State useColor1: boolean = true; + @State useBlur1: boolean = true; + @State useEffect1: boolean = true; + + build() { + NavDestination() { + Stack({ alignContent: Alignment.Center }) { + BackComponent() + .width('100%') + .height('100%') + Column() { + Stack({ alignContent: Alignment.Center }) { + Button("switch color") + .onClick(() => { + this.useColor1 = !this.useColor1; + }) + } + .width('100%') + .layoutWeight(1) + + Stack({ alignContent: Alignment.Center }) { + Button("switch blur") + .onClick(() => { + this.useBlur1 = !this.useBlur1; + }) + } + .width('100%') + .layoutWeight(1) + + Stack({ alignContent: Alignment.Center }) { + Button("switch effect") + .onClick(() => { + this.useEffect1 = !this.useEffect1; + }) + } + .width('100%') + .layoutWeight(1) + } + .width('100%') + .height('100%') + }.width('100%') + .height('100%') + } + .width('100%') + .height('100%') + // 开发者可以设置标题栏的背景颜色和背景模糊效果 + .title("Destination Title", { + backgroundColor: this.useColor1 ? COLOR1 : COLOR2, + backgroundBlurStyle: this.useBlur1 ? BLUR_STYLE_1 : BLUR_STYLE_2, + barStyle: BarStyle.STACK, + backgroundEffect: this.useEffect1 ? EFFECT_OPTION_1 : EFFECT_OPTION_2, + }) + // 开发者可以设置菜单的背景颜色和背景模糊效果 + .menus([ + { value: "A" }, + { value: "B" }, + { value: "C" }, + { value: "D" }, + ], { + moreButtonOptions: { + backgroundEffect: this.useEffect1 ? EFFECT_OPTION_1 : EFFECT_OPTION_2, + } + }) + // 开发者可以设置工具栏的背景颜色和背景模糊效果 + .toolbarConfiguration([ + { value: "A" }, + { value: "B" }, + { value: "C" }, + { value: "D" }, + { value: "E" }, + { value: "F" } + ], { + backgroundEffect: this.useEffect1 ? EFFECT_OPTION_1 : EFFECT_OPTION_2, + // 开发者可以设置工具栏的菜单的背景颜色和背景模糊效果 + moreButtonOptions: { + backgroundEffect: this.useEffect1 ? EFFECT_OPTION_1 : EFFECT_OPTION_2, + } + }) + } +} + +@Entry +@Component +struct Index { + @Provide('navPathStack') navPathStack: NavPathStack = new NavPathStack(); + @State useColor1: boolean = true; + @State useBlur1: boolean = true; + @State useBlurOption1: boolean = true; + + @Builder + PageBuilder(name: string, param?: Object) { + if (name === 'NavigationMenu') { + ColorAndBlur(); + } + } + + build() { + Navigation(this.navPathStack) { + Stack({ alignContent: Alignment.Center }) { + BackComponent() + .width('100%') + .height('100%') + Column() { + Stack({ alignContent: Alignment.Center }) { + Button("switch color") + .onClick(() => { + this.useColor1 = !this.useColor1; + }) + } + .width('100%') + .layoutWeight(1) + + Stack({ alignContent: Alignment.Center }) { + Button("switch blur") + .onClick(() => { + this.useBlur1 = !this.useBlur1; + }) + } + .width('100%') + .layoutWeight(1) + + Stack({ alignContent: Alignment.Center }) { + Button("switch blurOption") + .onClick(() => { + this.useBlurOption1 = !this.useBlurOption1; + }) + } + .width('100%') + .layoutWeight(1) + + Stack({ alignContent: Alignment.Center }) { + Button("push page") + .onClick(() => { + this.navPathStack.pushPathByName('NavigationMenu', null); + }) + } + .width('100%') + .layoutWeight(1) + } + .width('100%') + .height('80%') + }.width('100%') + .height('100%') + } + .width('100%') + .height('100%') + .navDestination(this.PageBuilder) + // 开发者可以设置标题栏的背景颜色和背景模糊效果 + .title("NavTitle", { + backgroundColor: this.useColor1 ? COLOR1 : COLOR2, + backgroundBlurStyle: this.useBlur1 ? BLUR_STYLE_1 : BLUR_STYLE_2, + barStyle: BarStyle.STACK, + backgroundBlurStyleOptions: this.useBlurOption1 ? BLUR_STYLE_OPTION_1 : BLUR_STYLE_OPTION_2, + }) + // 开发者可以设置菜单的背景颜色和背景模糊效果 + .menus([ + { value: "A" }, + { value: "B" }, + { value: "C" }, + { value: "D" }, + ], { + moreButtonOptions: { + backgroundBlurStyle: this.useBlur1 ? BLUR_STYLE_1 : BLUR_STYLE_2, + backgroundBlurStyleOptions: this.useBlurOption1 ? BLUR_STYLE_OPTION_1 : BLUR_STYLE_OPTION_2, + } + }) + // 开发者可以设置工具栏的背景颜色和背景模糊效果 + .toolbarConfiguration([ + { value: "A" }, + { value: "B" }, + { value: "C" }, + { value: "D" }, + { value: "E" }, + { value: "F" } + ], { + backgroundColor: this.useColor1 ? COLOR1 : COLOR2, + backgroundBlurStyle: this.useBlur1 ? BLUR_STYLE_1 : BLUR_STYLE_2, + // 开发者可以设置工具栏的菜单的背景颜色和背景模糊效果 + moreButtonOptions: { + backgroundBlurStyle: this.useBlur1 ? BLUR_STYLE_1 : BLUR_STYLE_2, + backgroundBlurStyleOptions: this.useBlurOption1 ? BLUR_STYLE_OPTION_1 : BLUR_STYLE_OPTION_2, + } + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a44e396338b8492352758a172ce687cdf79373d3 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/Index.ets @@ -0,0 +1,48 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavigationExample6 { + @State childNavStack: NavPathStack = new NavPathStack(); + + build() { + Navigation() { + Stack({ alignContent: Alignment.Center }) { + Navigation(this.childNavStack) { + Button('push Path to parent Navigation', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + // 可以获取父NavPathStack + let parentStack = this.childNavStack.getParent(); + parentStack?.pushPath({ name: "temp6-pageOne" }); + }) + } + .clip(true) + .backgroundColor(Color.Orange) + .width('80%') + .height('80%') + .title('ChildNavigation') + } + .width('100%') + .height('100%') + } + .backgroundColor(Color.Green) + .width('100%') + .height('100%') + .title('ParentNavigation') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/PageOne.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/PageOne.ets new file mode 100644 index 0000000000000000000000000000000000000000..2f991155f128e5e907ebe6b973005f6e739bdb03 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template6/PageOne.ets @@ -0,0 +1,21 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Builder +export function PageOneBuilder(name: string) { + NavDestination() { + Text('this is ' + name) + } + .title(name) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template7/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template7/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d79517dc0b0356ba43a89ffd168a6a71cea90e53 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template7/Index.ets @@ -0,0 +1,97 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +class PageParam { + constructor(num_: number) { + this.num = num_; + } + + num: number = 0; +} + +@Builder +export function PageOneBuilder(name: string, param: Object) { + PageOne(); +} + +@Component +struct PageOne { + private stack: NavPathStack | null = null; + private name: string = ""; + private paramNum: number = 0; + + build() { + NavDestination() { + Column() { + Text("NavPathInfo: name: " + this.name + ", paramNum: " + this.paramNum) + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + if (this.stack) { + let p = new PageParam(this.paramNum + 1); + this.stack.pushPath({ name: "temp7-pageOne", param: p }); + } + }) + Button('pop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.stack?.pop(); + }) + } + .width('100%') + .height('100%') + } + .title('pageOne') + .onReady((ctx: NavDestinationContext) => { + // 在NavDestination中能够拿到传来的NavPathInfo和当前所处的NavPathStack + try { + this.name = ctx?.pathInfo?.name; + this.paramNum = (ctx?.pathInfo?.param as PageParam)?.num; + this.stack = ctx.pathStack; + } catch (e) { + console.log(`testTag onReady catch exception: ${JSON.stringify(e)}`); + } + }) + } +} + +@Entry +@Component +struct NavigationExample7 { + private stack: NavPathStack = new NavPathStack(); + + build() { + Navigation(this.stack) { + Stack({ alignContent: Alignment.Center }) { + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + let p = new PageParam(1); + this.stack.pushPath({ name: "temp7-pageOne", param: p }); + }) + } + .width('100%') + .height('100%') + } + .width('100%') + .height('100%') + .title('Navigation') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template8/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template8/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a257ba6f88125db1b33b66fc77d3797ce0d7201f --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template8/Index.ets @@ -0,0 +1,109 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Builder +export function PageOneBuilder(name: string, param: Object) { + PageOneComponent(); +} + +@Component +struct PageOneComponent { + private stack: NavPathStack | null = null; + @State eventStr: string = ""; + + build() { + NavDestination() { + Column() { + Text("event: " + this.eventStr) + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + if (this.stack) { + this.stack.pushPath({ name: "temp8-pageOne" }); + } + }) + Button('pop', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.stack?.pop(); + }) + } + .width('100%') + .height('100%') + } + .title('pageOne') + .onAppear(() => { + this.eventStr += ""; + }) + .onDisAppear(() => { + this.eventStr += ""; + }) + .onShown(() => { + this.eventStr += ""; + }) + .onHidden(() => { + this.eventStr += ""; + }) + .onWillAppear(() => { + this.eventStr += ""; + }) + .onWillDisappear(() => { + this.eventStr += ""; + }) + .onWillShow(() => { + this.eventStr += ""; + }) + .onWillHide(() => { + this.eventStr += ""; + }) + // onReady会在onAppear之前调用 + .onReady((ctx: NavDestinationContext) => { + try { + this.eventStr += ""; + this.stack = ctx.pathStack; + } catch (e) { + console.log(`testTag onReady catch exception: ${JSON.stringify(e)}`); + } + }) + } +} + +@Entry +@Component +struct NavigationExample8 { + private stack: NavPathStack = new NavPathStack(); + + build() { + Navigation(this.stack) { + Stack({ alignContent: Alignment.Center }) { + Button('pushPath', { stateEffect: true, type: ButtonType.Capsule }) + .width('80%') + .height(40) + .margin(20) + .onClick(() => { + this.stack.pushPath({ name: "temp8-pageOne" }); + }) + } + .width('100%') + .height('100%') + } + .width('100%') + .height('100%') + .title('Navigation') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template9/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template9/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0719c1f732f68785386cb96c4f372b0d39b2d876 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/navigation/template9/Index.ets @@ -0,0 +1,76 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct NavigationExample9 { + private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]; + private scrollerForScroll: Scroller = new Scroller(); + @State barStyle: BarStyle = BarStyle.STANDARD; + + build() { + Column() { + Navigation() { + Column() { + Scroll(this.scrollerForScroll) { + Column() { + Image($r('app.media.image_1'))// 设置与标题栏高度一致，以便观察STACK效果 + .height(138) + .width('100%') + Button('BarStyle.STANDARD') + .height('50vp') + .onClick(() => { + this.barStyle = BarStyle.STANDARD; + }) + Button('BarStyle.STACK') + .height('50vp') + .margin({ top: 12 }) + .onClick(() => { + this.barStyle = BarStyle.STACK; + }) + + ForEach(this.arr, (item: number) => { + ListItem() { + Text('' + item) + .width('100%') + .height(100) + .fontSize(16) + .textAlign(TextAlign.Center) + .borderRadius(10) + .backgroundColor(Color.Orange) + .margin({ top: 12 }) + } + }, (item: string) => item) + } + } + } + .width('100%') + .height('100%') + .backgroundColor(0xDCDCDC) + } + .title( + { + main: 'NavTitle', + sub: 'subtitle' + }, + { + backgroundBlurStyle: BlurStyle.COMPONENT_THICK, + barStyle: this.barStyle, + } + ) + .titleMode(NavigationTitleMode.Free) + .hideTitleBar(false) + }.width('100%').height('100%').backgroundColor('#F1F3F5') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8ec314b78be077705a4ec291b86bc72ee6a5300e --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template1/Index.ets @@ -0,0 +1,59 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiObserver } from '@kit.ArkUI'; + +@Component +struct PageOne { + build() { + NavDestination() { + Text("pageOne") + }.title("pageOne") + } +} + +@Entry +@Component +struct ObserverIndex1 { + private stack: NavPathStack = new NavPathStack(); + + @Builder + PageBuilder(name: string) { + PageOne() + } + + aboutToAppear() { + uiObserver.on('navDestinationUpdate', (info) => { + console.info('NavDestination state update', JSON.stringify(info)); + }); + } + + aboutToDisappear() { + uiObserver.off('navDestinationUpdate'); + } + + build() { + Column() { + Navigation(this.stack) { + Button("push").onClick(() => { + this.stack.pushPath({ name: "pageOne" }); + }) + } + .title("Navigation") + .navDestination(this.PageBuilder) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template2/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8e1d5b6930a3a95c2e79976a8f6d8e45da83845a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template2/Index.ets @@ -0,0 +1,60 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiObserver } from '@kit.ArkUI'; + +@Component +struct PageOne { + build() { + NavDestination() { + Text("pageOne") + }.title("pageOne") + } +} + +@Entry +@Component +struct ObserverIndex2 { + private stack: NavPathStack = new NavPathStack(); + + @Builder + PageBuilder(name: string) { + PageOne() + } + + aboutToAppear() { + uiObserver.on('navDestinationUpdate', { navigationId: "testId" }, (info) => { + console.info('NavDestination state update', JSON.stringify(info)); + }); + } + + aboutToDisappear() { + uiObserver.off('navDestinationUpdate', { navigationId: "testId" }); + } + + build() { + Column() { + Navigation(this.stack) { + Button("push").onClick(() => { + this.stack.pushPath({ name: "pageOne" }); + }) + } + .id("testId") + .title("Navigation") + .navDestination(this.PageBuilder) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template3/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..cf2a26891dafeaba92df2ad316cc69369e1d99c0 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template3/Index.ets @@ -0,0 +1,61 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiObserver } from '@kit.ArkUI'; + +@Component +struct PageOne { + build() { + NavDestination() { + Text("pageOne") + }.title("pageOne") + } +} + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +@Entry +@Component +struct Index { + private stack: NavPathStack = new NavPathStack(); + + @Builder + PageBuilder(name: string) { + PageOne() + } + + aboutToAppear() { + uiObserver.on('navDestinationSwitch', this.getUIContext(), callBackFunc) + } + + aboutToDisappear() { + uiObserver.off('navDestinationSwitch', this.getUIContext(), callBackFunc) + } + + build() { + Column() { + Navigation(this.stack) { + Button("push").onClick(() => { + this.stack.pushPath({ name: "pageOne" }); + }) + } + .title("Navigation") + .navDestination(this.PageBuilder) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template4/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..8131a1fefb0d403742347bddbc52dccdbf8dd106 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/observer/template4/Index.ets @@ -0,0 +1,62 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiObserver } from '@kit.ArkUI'; + +@Component +struct PageOne { + build() { + NavDestination() { + Text("pageOne") + }.title("pageOne") + } +} + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +@Entry +@Component +struct Index { + private stack: NavPathStack = new NavPathStack(); + + @Builder + PageBuilder(name: string) { + PageOne() + } + + aboutToAppear() { + uiObserver.on('navDestinationSwitch', this.getUIContext(), { navigationId: 'myNavId' }, callBackFunc) + } + + aboutToDisappear() { + uiObserver.off('navDestinationSwitch', this.getUIContext(), { navigationId: 'myNavId' }, callBackFunc) + } + + build() { + Column() { + Navigation(this.stack) { + Button("push").onClick(() => { + this.stack.pushPath({ name: "pageOne" }); + }) + } + .id('myNavId') + .title("Navigation") + .navDestination(this.PageBuilder) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..cf88b980c5f179d25d7293f8d8640cf37b36b035 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/Index.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { router } from '@kit.ArkUI'; +import { BusinessError } from '@kit.BasicServicesKit'; + +// 定义传递参数的类 +class innerParams { + array: number[]; + + constructor(tuple: number[]) { + this.array = tuple; + } +} + +class RouterParams { + public text: string; + public data: innerParams; + + constructor(str: string, tuple: number[]) { + this.text = str; + this.data = new innerParams(tuple); + } +} + +@Entry +@Component +struct Index { + async routePage() { + let options: router.RouterOptions = { + url: 'pages/router/template1/second', + params: new RouterParams('This is the value of the first page', [12, 45, 78]) + } + // 建议使用this.getUIContext().getRouter().pushUrl() + router.pushUrl(options) + .then(() => { + console.error(`pushUrl finish`); + }) + .catch((err: ESObject) => { + console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); + }) + } + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Text($r('app.string.RouterTemp1PageOne_text2')) + .fontSize(50) + .fontWeight(FontWeight.Bold) + Button() { + Text('next page') + .fontSize(25) + .fontWeight(FontWeight.Bold) + }.type(ButtonType.Capsule) + .margin({ top: 20 }) + .backgroundColor('#ccc') + .onClick(() => { + this.routePage() + }) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/second.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/second.ets new file mode 100644 index 0000000000000000000000000000000000000000..2972ec4eb871ef3d89c961a8ea5c2e0df35a3f44 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/router/template1/second.ets @@ -0,0 +1,63 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { router } from '@kit.ArkUI'; + +class innerParams { + array: number[]; + + constructor(tuple: number[]) { + this.array = tuple; + } +} + +class RouterParams { + text: string; + data: innerParams; + + constructor(str: string, tuple: number[]) { + this.text = str; + this.data = new innerParams(tuple); + } +} + +@Entry +@Component +struct Second { + private content: string = 'This is the second page'; + // 建议使用this.getUIContext().getRouter().getParams() + @State text: string = (this.getUIContext().getRouter().getParams() as RouterParams).text; + @State data: object = (this.getUIContext().getRouter().getParams() as RouterParams).data; + @State secondData: string = ''; + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Text(`${this.content}`) + .fontSize(50) + .fontWeight(FontWeight.Bold) + Text(this.text) + .fontSize(30) + .onClick(() => { + this.secondData = (this.data['array'][1]).toString(); + }) + .margin({ top: 20 }) + Text(`The value transmitted from the first page:${this.secondData}`) + .fontSize(20) + .margin({ top: 20 }) + .backgroundColor('red') + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/sideBarContainer/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/sideBarContainer/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..5b210474fd56719675c9180a0d02eba5b48faa2d --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/sideBarContainer/template1/Index.ets @@ -0,0 +1,64 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SideBarContainerExample { + normalIcon: Resource = $r('app.media.icon'); + selectedIcon: Resource = $r('app.media.icon'); + @State arr: number[] = [1, 2, 3]; + @State current: number = 1; + + build() { + SideBarContainer(SideBarContainerType.Embed) { + Column() { + ForEach(this.arr, (item: number) => { + Column({ space: 5 }) { + Image(this.current === item ? this.selectedIcon : this.normalIcon).width(64).height(64) + Text('Index0' + item) + .fontSize(25) + .fontColor(this.current === item ? '#0A59F7' : '#999') + .fontFamily('source-sans-pro,cursive,sans-serif') + } + .onClick(() => { + this.current = item; + }) + }, (item: string) => item) + }.width('100%') + .justifyContent(FlexAlign.SpaceEvenly) + .backgroundColor('#19000000') + + Column() { + Text('SideBarContainer content text1').fontSize(25) + Text('SideBarContainer content text2').fontSize(25) + } + .margin({ top: 50, left: 20, right: 30 }) + } + .controlButton({ + icons: { + hidden: $r('app.media.drawer'), + shown: $r('app.media.drawer'), + switching: $r('app.media.drawer') + } + }) + .sideBarWidth(150) + .minSideBarWidth(50) + .maxSideBarWidth(300) + .minContentWidth(0) + .onChange((value: boolean) => { + console.info('status:' + value); + }) + .divider({ strokeWidth: '1vp', color: Color.Gray, startMargin: '4vp', endMargin: '4vp' }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/stepper/template1/Index.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/stepper/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..c982dec45c7f29dfc3f62808be8efab8cd7bb663 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/ets/pages/stepper/template1/Index.ets @@ -0,0 +1,108 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Styles function itemStyle () { + .width(336) + .height(621) + .margin({ top: 48, left: 12 }) + .borderRadius(24) + .backgroundColor('#FFFFFF') +} + +@Extend(Text) function itemTextStyle () { + .fontColor('#182431') + .fontSize(36) + .fontWeight(500) + .opacity(0.4) + .margin({ top: 82, bottom: 40 }) +} + +@Entry +@Component +struct StepperExample { + @State currentIndex: number = 0; + @State firstState: ItemState = ItemState.Normal; + @State secondState: ItemState = ItemState.Normal; + @State thirdState: ItemState = ItemState.Normal; + + build() { + Stepper({ + index: this.currentIndex + }) { + // 第一个步骤页 + StepperItem() { + Column() { + Text('Page One') + .itemTextStyle() + Button('change status:' + this.firstState) + .backgroundColor('#007dFF') + .onClick(() => { + this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip; + }) + }.itemStyle() + } + .nextLabel('Next') + .status(this.firstState) + // 第二个步骤页 + StepperItem() { + Column() { + Text('Page Two') + .itemTextStyle() + Button('change status:' + this.secondState) + .backgroundColor('#007dFF') + .onClick(() => { + this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled; + }) + }.itemStyle() + } + .nextLabel('Next') + .prevLabel('Previous') + .status(this.secondState) + // 第三个步骤页 + StepperItem() { + Column() { + Text('Page Three') + .itemTextStyle() + Button('change status:' + this.thirdState) + .backgroundColor('#007dFF') + .onClick(() => { + this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting; + }) + }.itemStyle() + } + .status(this.thirdState) + // 第四个步骤页 + StepperItem() { + Column() { + Text('Page Four') + .itemTextStyle() + }.itemStyle() + } + } + .backgroundColor('#F1F3F5') + .onFinish(() => { + // 此处可处理点击最后一页的Finish时的逻辑，例如路由跳转等 + console.info('onFinish'); + }) + .onSkip(() => { + // 此处可处理点击跳过时的逻辑，例如动态修改Stepper的index值使其跳转到某一步骤页等 + console.info('onSkip'); + }) + .onChange((prevIndex?: number, index?: number) => { + if(index){ + this.currentIndex = index; + } + }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/module.json5 b/code/DocsSample/ArkUISample/Navigation/entry/src/main/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..da837d9dff274a7a471ee1fbf79e711cd1286493 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/module.json5 @@ -0,0 +1,66 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry", + "type": "entry", + "description": "$string:module_desc", + "mainElement": "EntryAbility", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false, + "pages": "$profile:main_pages", + "routerMap": "$profile:route_map", + "abilities": [ + { + "name": "EntryAbility", + "srcEntry": "./ets/entryability/EntryAbility.ets", + "description": "$string:EntryAbility_desc", + "icon": "$media:layered_image", + "label": "$string:EntryAbility_label", + "startWindowIcon": "$media:startIcon", + "orientation": "auto_rotation", + "startWindowBackground": "$color:start_window_background", + "exported": true, + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "ohos.want.action.home" + ] + } + ] + } + ], + "extensionAbilities": [ + { + "name": "EntryBackupAbility", + "srcEntry": "./ets/entrybackupability/EntryBackupAbility.ets", + "type": "backup", + "exported": false, + "metadata": [ + { + "name": "ohos.extension.backup", + "resource": "$profile:backup_config" + } + ], + } + ] + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/color.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..3c712962da3c2751c2b9ddb53559afcbd2b54a02 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#FFFFFF" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/float.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/float.json new file mode 100644 index 0000000000000000000000000000000000000000..153478e3f449f86a897686bc35316bd4fc96fb99 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/float.json @@ -0,0 +1,17 @@ +{ + "float": [ + { + "name": "page_text_font_size", + "value": "50fp" + }, { + "name": "size_16", + "value": "16" + }, { + "name": "size_100", + "value": "100" + }, { + "name": "size_64", + "value": "64" + } + ] +} diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/string.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..e6d55d0077b463017744340ce5b525aa4868214a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/element/string.json @@ -0,0 +1,130 @@ +{ + "string": [ + { + "name": "module_desc", + "value": "module description" + }, + { + "name": "EntryAbility_desc", + "value": "description" + }, + { + "name": "EntryAbility_label", + "value": "Navigation" + }, + { + "name": "navigation_toolbar_add", + "value": "add" + }, + { + "name": "navigation_toolbar_app", + "value": "app" + }, + { + "name": "navigation_toolbar_collect", + "value": "collect" + }, { + "name": "please_click_button", + "value": "请点击按钮" + }, { + "name": "PageOneBuilder_text1", + "value": "返回值" + }, { + "name": "navStackTemp1PageOne_text1", + "value": "点击向内查找" + }, { + "name": "navStackTemp1PageOne_text2", + "value": "向内查找的NavDestination是" + }, { + "name": "navStackTemp1PageOne_text3", + "value": "点击向外查找" + }, { + "name": "navStackTemp1PageOne_text4", + "value": "向外查找的NavDestination是" + }, { + "name": "RouterTemp1PageOne_text1", + "value": "这是第一页的值" + }, { + "name": "RouterTemp1PageOne_text2", + "value": "这是第一页" + }, { + "name": "RouterTemp1PageOne_text3", + "value": "这是第二页" + }, { + "name": "RouterTemp1PageOne_text4", + "value": "向外查找的NavDestination是" + }, { + "name": "stepperIndex_text1", + "value": "示例1（Navigation页面布局）" + }, { + "name": "stepperIndex_text2", + "value": "示例2（使用路由栈方法）" + }, { + "name": "stepperIndex_text3", + "value": "示例3（设置可交互转场动画）" + }, { + "name": "stepperIndex_text4", + "value": "示例4（Navigation带参返回）" + }, { + "name": "stepperIndex_text5", + "value": "示例5（设置背景颜色和模糊效果）" + }, { + "name": "stepperIndex_text6", + "value": "示例6（嵌套场景下获取外层栈）" + }, { + "name": "stepperIndex_text7", + "value": "示例7（通过onReady获取栈）" + }, { + "name": "stepperIndex_text8", + "value": "示例8（NavDestination生命周期时序）" + }, { + "name": "stepperIndex_text9", + "value": "示例9（标题栏布局效果）" + }, { + "name": "stepperIndex_text10", + "value": "示例10（定义路由栈派生类）" + }, { + "name": "stepperIndex_text11", + "value": "示例11（使用Symbol组件）" + }, { + "name": "stepperIndex_text12", + "value": "示例12（设置自定义标题栏边距）" + }, { + "name": "stepperIndex_text13", + "value": "示例13（自定义转场动画）" + }, { + "name": "stepperIndex_text14", + "value": "示例1（标题栏工具栏与可滚动类组件联动）" + }, { + "name": "stepperIndex_text15", + "value": "示例2（设置NavDestination自定义转场）" + }, { + "name": "stepperIndex_text16", + "value": "示例3（设置指定的NavDestination系统转场）" + }, { + "name": "stepperIndex_text17", + "value": "示例4（NavDestination配置页面方向和对应状态栏、导航条显隐）" + }, { + "name": "stepperIndex_text18", + "value": "无感监听" + }, { + "name": "stepperIndex_text19", + "value": "uiObserver.on('navDestinationUpdate')指定监听" + }, { + "name": "stepperIndex_text20", + "value": "uiObserver.on('navDestinationSwitch')指定监听" + }, { + "name": "stepperIndex_text21", + "value": "示例1" + }, { + "name": "stepperIndex_text22", + "value": "NavPathStack派生类" + }, { + "name": "stepperIndex_text23", + "value": "基于TS扩展的声明式开发范式" + }, { + "name": "stepperIndex_text24", + "value": "返回" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/background.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/bg.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/bg.JPG new file mode 100644 index 0000000000000000000000000000000000000000..77d1db9c5ae70097ed69f7c9d2fcae8a751e8fff Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/bg.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/book.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/book.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/book.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/drawer.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/drawer.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/drawer.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/forest.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/forest.png new file mode 100644 index 0000000000000000000000000000000000000000..25165d3dac9606d9078b49a9853c66c9cb77320a Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/forest.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/heart.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/heart.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_health_heart.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_health_heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c0843441f0fa499317d594a0f81a0f169ac4cad9 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_health_heart.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlights.svg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlights.svg new file mode 100644 index 0000000000000000000000000000000000000000..7f0c77423290d138e1c06b9de163af52d0ba0195 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlights.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collect + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlightsed.svg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlightsed.svg new file mode 100644 index 0000000000000000000000000000000000000000..bda82973349ceba0d7de8e9f85d704844cb31318 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/ic_public_highlightsed.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collected + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon_2.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon_2.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/icon_2.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image.JPG new file mode 100644 index 0000000000000000000000000000000000000000..29bd746fee2f280b5a97640c3c91125bb0934ca1 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image_1.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image_1.png new file mode 100644 index 0000000000000000000000000000000000000000..8b474587838c8cc696fc7747dfe9b1c70f80dc2d Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/image_1.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/img_1.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/img_1.JPG new file mode 100644 index 0000000000000000000000000000000000000000..461eda6a6847cb09d9d6569a4258009d414610e8 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/img_1.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/mountain.jpg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/mountain.jpg new file mode 100644 index 0000000000000000000000000000000000000000..3c244ab4218031e18dd0069e240e558622924668 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/mountain.jpg differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/r.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/r.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cd3fef02a58cabe165cb12fde35cb4c249afa5a4 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/r.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sky.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sky.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sky.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/startIcon.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/startIcon.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sun.jpg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sun.jpg new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/sun.jpg differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/test.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/test.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/test.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImage.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImage.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImage.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImg.jpg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImg.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testImg.jpg differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG new file mode 100644 index 0000000000000000000000000000000000000000..e2e542fcde54adf541a680c384bf8477b41548eb Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image1.jpg b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image1.jpg differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image2.png b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image2.png new file mode 100644 index 0000000000000000000000000000000000000000..af8d4c98a86f23a41841d07b74636926a17d1c89 Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/transition_image2.png differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/tree.JPG b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/tree.JPG new file mode 100644 index 0000000000000000000000000000000000000000..bdad6db5558c4190bccb951489e8bc67fc0ababe Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/media/tree.JPG differ diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/backup_config.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/backup_config.json new file mode 100644 index 0000000000000000000000000000000000000000..78f40ae7c494d71e2482278f359ec790ca73471a --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/backup_config.json @@ -0,0 +1,3 @@ +{ + "allowToBackupRestore": true +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/main_pages.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/main_pages.json new file mode 100644 index 0000000000000000000000000000000000000000..e923d9d6d4dd7e4c5bedbc01e1231cb8fb528876 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/main_pages.json @@ -0,0 +1,31 @@ +{ + "src": [ + "pages/Index", + "pages/navigation/template1/Index", + "pages/navigation/template2/Index", + "pages/navigation/template3/Index", + "pages/navigation/template4/Index", + "pages/navigation/template5/Index", + "pages/navigation/template6/Index", + "pages/navigation/template7/Index", + "pages/navigation/template8/Index", + "pages/navigation/template9/Index", + "pages/navigation/template10/Index", + "pages/navigation/template11/Index", + "pages/navigation/template12/Index", + "pages/navigation/template13/Index", + "pages/navDestination/template1/Index", + "pages/navDestination/template2/Index", + "pages/navDestination/template3/Index", + "pages/navDestination/template4/Index", + "pages/stepper/template1/Index", + "pages/sideBarContainer/template1/Index", + "pages/router/template1/Index", + "pages/router/template1/second", + "pages/observer/template1/Index", + "pages/observer/template2/Index", + "pages/observer/template3/Index", + "pages/observer/template4/Index", + "pages/navPathStackExtend/template1/Index" + ] +} diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/route_map.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/route_map.json new file mode 100644 index 0000000000000000000000000000000000000000..1f199474477f30766abe1cfe84b4d018eb56e5c2 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/base/profile/route_map.json @@ -0,0 +1,76 @@ +{ + "routerMap": [ + { + "name": "pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template2/PageOne.ets", + "buildFunction": "PageOneBuilder", + "data": { + "description": "this is pageOne" + } + }, + { + "name": "pageTwo", + "pageSourceFile": "src/main/ets/pages/navigation/template2/PageTwo.ets", + "buildFunction": "PageTwoBuilder" + }, + { + "name": "temp3-pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template3/PageOne.ets", + "buildFunction": "PageOneBuilder", + "data": { + "description": "this is pageOne" + } + }, + { + "name": "temp3-pageTwo", + "pageSourceFile": "src/main/ets/pages/navigation/template3/PageTwo.ets", + "buildFunction": "PageTwoBuilder" + }, + { + "name": "temp4-pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template4/PageOne.ets", + "buildFunction": "PageOneBuilder", + "data": { + "description": "this is pageOne" + } + }, + { + "name": "temp4-pageTwo", + "pageSourceFile": "src/main/ets/pages/navigation/template4/PageTwo.ets", + "buildFunction": "PageTwoBuilder" + }, + { + "name": "temp6-pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template6/PageOne.ets", + "buildFunction": "PageOneBuilder" + }, + { + "name": "temp7-pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template7/Index.ets", + "buildFunction": "PageOneBuilder" + }, + { + "name": "temp8-pageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template8/Index.ets", + "buildFunction": "PageOneBuilder" + }, + { + "name": "temp13-PageOne", + "pageSourceFile": "src/main/ets/pages/navigation/template13/Index.ets", + "buildFunction": "PageOneBuilder", + "data": { + "description": "this is pageOne" + } + }, + { + "name": "temp13-PageTwo", + "pageSourceFile": "src/main/ets/pages/navigation/template13/Index.ets", + "buildFunction": "PageTwoBuilder" + }, + { + "name": "navPath-pageOne", + "pageSourceFile": "src/main/ets/pages/navPathStackExtend/template1/PageOne.ets", + "buildFunction": "PageOneBuilder" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/dark/element/color.json b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/dark/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..79b11c2747aec33e710fd3a7b2b3c94dd9965499 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/main/resources/dark/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#000000" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/mock/mock-config.json5 b/code/DocsSample/ArkUISample/Navigation/entry/src/mock/mock-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..323d1d611fecf4ecb751976e3a71500b3712a445 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/mock/mock-config.json5 @@ -0,0 +1,16 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Ability.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Ability.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..dd2cc64571570195f8f1c8245af16d4b4f5ffe41 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Ability.test.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function abilityTest() { + describe('ActsAbilityTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }) + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }) + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }) + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }) + /* + * @tc.number: Navigation_assertContain + * @tc.name: Test ability + * @tc.desc: Test ability + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + hilog.info(0x0000, 'testTag', '%{public}s', 'it begin'); + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + hilog.info(0x0000, 'testTag', '%{public}s', 'it end'); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/List.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..1f89fa7b508ac03ac4faefad49c3b73ce436c8d0 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/List.test.ets @@ -0,0 +1,31 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { RouterTest } from './Router.test'; +import { NavigationTest } from './Navigation.test'; +import { NavDestinationTest } from './NavDestination.test'; +import { SideBarContainerTest } from './SideBarContainer.test'; +import { StepperTest } from './Stepper.test'; +import { UiObserverTest } from './UiObserver.test'; +import { QueryNavDestinationInfoTest } from './QueryNavDestinationInfo.test'; + +export default function testsuite() { + RouterTest(); + NavigationTest(); + NavDestinationTest(); + SideBarContainerTest(); + StepperTest(); + UiObserverTest(); + QueryNavDestinationInfoTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/NavDestination.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/NavDestination.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..f3da19c25029b4f019911a3abd740f59043792fa --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/NavDestination.test.ets @@ -0,0 +1,218 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +let aimComponent : Component + +export function NavDestinationTest() { + describe('Navigation_NavDestinationTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('NavDestination')); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_NavDestinationTest_001 + * @tc.name: example_one_NavDestination + * @tc.desc: example_one_NavDestination + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavDestinationTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text14')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push PageTwo')) + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let startX = Math.floor(size.x * 0.5) + let startY = Math.floor(size.y * 0.6356) + let endX = Math.floor(size.x * 0.5) + let endY = Math.floor(size.y * 0.459) + let startY2 = Math.floor(size.y * 0.883) + let endY2 = Math.floor(size.y * 0.353) + + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(endX, endY, startX, startY); + await driver.delayMs(1000); + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(endX, endY, startX, startY); + await driver.delayMs(1000); + + await driver.pressBack(); + + aimComponent = await driver.findComponent(ON.text('push PageOne')) + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(endX, endY, startX, startY); + await driver.delayMs(1000); + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(startX, startY2, endX, endY2); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_001_end'); + }) + + /* + * @tc.number: Navigation_NavDestinationTest_002 + * @tc.name: example_two_NavDestination + * @tc.desc: example_two_NavDestination + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavDestinationTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text15')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push next page')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.text('push next page')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_002_end'); + }) + + /* + * @tc.number: Navigation_NavDestinationTest_003 + * @tc.name: example_three_NavDestination + * @tc.desc: example_three_NavDestination + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavDestinationTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text16')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('fade')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('explode')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('slide right')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('slide bottom')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_003_end'); + }) + + /* + * @tc.number: Navigation_NavDestinationTest_004 + * @tc.name: example_four_NavDestination + * @tc.desc: example_four_NavDestination + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavDestinationTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text17')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push LANDSCAPE page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push PORTRAIT page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push LANDSCAPE page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push PORTRAIT page')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavDestinationTest_004_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Navigation.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Navigation.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..38818f411f9ebf72db1af19bcc3b0575914bd386 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Navigation.test.ets @@ -0,0 +1,548 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function NavigationTest() { + describe('Navigation_NavigationTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('Navigation')); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_NavigationTest_001 + * @tc.name: example_one_Navigation + * @tc.desc: example_one_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text1')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('TitleBar')) + expect(aimComponent) + + aimComponent = await driver.findComponent(ON.type('ToolBar')) + expect(aimComponent) + + aimComponent = await driver.findComponent(ON.type('NavBarContent')) + expect(aimComponent) + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_001_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_002 + * @tc.name: example_two_Navigation + * @tc.desc: example_two_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text2')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPathByName')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('NavIndex')) + expect(aimComponent) + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_002_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_003 + * @tc.name: example_three_Navigation + * @tc.desc: example_three_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text3')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPathByName')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPathByName')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPathByName')) + await aimComponent.click(); + await driver.delayMs(2000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(2000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_003_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_004 + * @tc.name: example_four_Navigation + * @tc.desc: example_four_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text4')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('StartTest')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pop')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.pressBack(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_004_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_005 + * @tc.name: example_five_Navigation + * @tc.desc: example_five_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text5')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch color')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch blur')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch blurOption')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch color')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch blur')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('switch effect')) + await aimComponent.click(); + await driver.delayMs(1000); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_005_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_006 + * @tc.name: example_six_Navigation + * @tc.desc: example_six_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text6')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Button')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_006_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_007 + * @tc.name: example_seven_Navigation + * @tc.desc: example_seven_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_007', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_007_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text7')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_007_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_008 + * @tc.name: example_eight_Navigation + * @tc.desc: example_eight_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_008', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_008_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text8')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPath')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_008_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_009 + * @tc.name: example_nine_Navigation + * @tc.desc: example_nine_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_009', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_009_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text9')))); + await aimComponent.click(); + await driver.delayMs(1000); + + let size = await driver.getDisplaySize() + let startX = Math.floor(size.x * 0.5) + let startY = Math.floor(size.y * 0.565) + let endX = Math.floor(size.x * 0.5) + let endY = Math.floor(size.y * 0.21186) + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(endX, endY, startX, startY); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('BarStyle.STACK')); + await aimComponent.click(); + await driver.delayMs(1000); + + await driver.swipe(startX, startY, endX, endY); + await driver.delayMs(1000); + await driver.swipe(endX, endY, startX, startY); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_009_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_010 + * @tc.name: example_ten_Navigation + * @tc.desc: example_ten_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_010', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_010_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text10')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('to Page One')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('to Page One')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('to Page One')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_010_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_011 + * @tc.name: example_eleven_Navigation + * @tc.desc: example_eleven_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_011', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_011_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text11')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('跳转')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_011_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_012 + * @tc.name: example_twelve_Navigation + * @tc.desc: example_twelve_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_012', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_012_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text12')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('apply padding 20vp')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('apply padding 32vp')); + await aimComponent.click(); + await driver.delayMs(1000); + + let Toggles = await driver.findComponents(ON.type('Toggle')); + await Toggles[0].click(); + await driver.delayMs(1000); + await Toggles[1].click(); + await driver.delayMs(1000); + await Toggles[1].click(); + await driver.delayMs(1000); + await Toggles[0].click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pushPage')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('apply padding 20vp')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('apply padding 32vp')); + await aimComponent.click(); + await driver.delayMs(1000); + + Toggles = await driver.findComponents(ON.type('Toggle')); + await Toggles[0].click(); + await driver.delayMs(1000); + await Toggles[1].click(); + await driver.delayMs(1000); + await Toggles[1].click(); + await driver.delayMs(1000); + await Toggles[0].click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_012_end'); + }) + + /* + * @tc.number: Navigation_NavigationTest_013 + * @tc.name: example_thirteen_Navigation + * @tc.desc: example_thirteen_Navigation + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'NavigationTest_013', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_013_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text13')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push next page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push next page')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('BackButton')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_NavigationTest_013_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/QueryNavDestinationInfo.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/QueryNavDestinationInfo.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..9adecfa45bed9f8d6559aa93e84e7eb5cb7c7f10 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/QueryNavDestinationInfo.test.ets @@ -0,0 +1,81 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +let aimComponent : Component + +export function QueryNavDestinationInfoTest() { + describe('Navigation_QueryNavDestinationInfoTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text22')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_QueryNavDestinationInfoTest_001 + * @tc.name: example_one_QueryNavDestinationInfo + * @tc.desc: example_one_QueryNavDestinationInfo + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'QueryNavDestinationInfoTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_QueryNavDestinationInfoTest_001_begin'); + aimComponent = await driver.findComponent(ON.text('queryNavDestinationInfo18+')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('pageOne')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.navStackTemp1PageOne_text1')))) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.navStackTemp1PageOne_text3')))) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_QueryNavDestinationInfoTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Router.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Router.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..c7ed999d6b32dce33ba4474b1d50b9a523652864 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Router.test.ets @@ -0,0 +1,73 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function RouterTest() { + describe('Navigation_RouterTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('Router')); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_RouterTest_001 + * @tc.name: example_one_Router + * @tc.desc: example_one_Router + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'RouterTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_RouterTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text23')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('next page')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_RouterTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/SideBarContainer.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/SideBarContainer.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..3eab563452fc65818ecb547e924a138ea3e987e2 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/SideBarContainer.test.ets @@ -0,0 +1,94 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function SideBarContainerTest() { + describe('Navigation_SideBarContainerTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('SideBarContainer')); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_SideBarContainerTest_001 + * @tc.name: example_one_SideBarContainer + * @tc.desc: example_one_SideBarContainer + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'SideBarContainerTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_SideBarContainerTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text21')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Button')); + await aimComponent.click(); + await driver.delayMs(1000); + aimComponent = await driver.findComponent(ON.text('Index01')) + expect(aimComponent).assertNull(); + + aimComponent = await driver.findComponent(ON.type('Button')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Index01')) + expect(aimComponent) + + aimComponent = await driver.findComponent(ON.text('Index02')) + await aimComponent.click() + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Index03')) + await aimComponent.click() + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Index01')) + await aimComponent.click() + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_SideBarContainerTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Stepper.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Stepper.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..72e028fb342905aae1469b9cfd46e4cd74f82562 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/Stepper.test.ets @@ -0,0 +1,101 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function StepperTest() { + describe('Navigation_StepperTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('Stepper')); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_StepperTest_001 + * @tc.name: example_one_Stepper + * @tc.desc: example_one_Stepper + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'StepperTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_StepperTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text21')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Next')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change status:0')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change status:1')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('Next')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change status:0')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change status:2')); + await aimComponent.click(); + await driver.delayMs(1500); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text24')))); + await aimComponent.click(); + await driver.delayMs(1500); + + aimComponent = await driver.findComponent(ON.text('Previous')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_StepperTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/UiObserver.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/UiObserver.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..4d439e1cfe8813df328f155174a0f94fc279ba1f --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/ets/test/UiObserver.test.ets @@ -0,0 +1,133 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'Navigation_' +const TAG = '[Sample_Navigation_]'; +const DOMAIN = 0xF811 +let resourceManager = delegator.getAppContext().resourceManager; +const driver = Driver.create(); + +let aimComponent : Component + +export function UiObserverTest() { + describe('Navigation_UiObserverTest', () => { + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.navigation', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text18')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('Index')); + do { + await driver.pressBack(); + await driver.delayMs(1000); + aimComponent = await driver.findComponent(ON.text('Index')); + } while (aimComponent == null) + }) + + /* + * @tc.number: Navigation_UiObserverTest_001 + * @tc.name: example_one_UiObserver + * @tc.desc: example_one_UiObserver + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'UiObserverTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_001_begin'); + aimComponent = await driver.findComponent(ON.text("uiObserver.on('navDestinationUpdate')")); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_001_end'); + }) + + /* + * @tc.number: Navigation_UiObserverTest_002 + * @tc.name: example_two_UiObserver + * @tc.desc: example_two_UiObserver + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'UiObserverTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text19')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push')); + await aimComponent.click(); + await driver.delayMs(1000); + await driver.pressBack(); + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_002_end'); + }) + + /* + * @tc.number: Navigation_UiObserverTest_003 + * @tc.name: example_three_UiObserver + * @tc.desc: example_three_UiObserver + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'UiObserverTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_003_begin'); + aimComponent = await driver.findComponent(ON.text("uiObserver.on('navDestinationSwitch')")); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_003_end'); + }) + + /* + * @tc.number: Navigation_UiObserverTest_004 + * @tc.name: example_four_UiObserver + * @tc.desc: example_four_UiObserver + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'UiObserverTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.stepperIndex_text20')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('push')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'Navigation_UiObserverTest_004_end'); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/module.json5 b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..1cafc28b86d7d9f2b34f24d26a75c0dbd7299715 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/ohosTest/module.json5 @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry_test", + "type": "feature", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false + } +} diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/test/List.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..a60c87c5cbb0badf7c3fd8975034590e6fafa992 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/test/List.test.ets @@ -0,0 +1,19 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import localUnitTest from './LocalUnit.test'; + +export default function testsuite() { + localUnitTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/entry/src/test/LocalUnit.test.ets b/code/DocsSample/ArkUISample/Navigation/entry/src/test/LocalUnit.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..841bfd77e56060e50ec0924302a5ae624e76e3aa --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/entry/src/test/LocalUnit.test.ets @@ -0,0 +1,47 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function localUnitTest() { + describe('localUnitTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }); + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }); + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }); + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }); + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + }); + }); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/hvigor/hvigor-config.json5 b/code/DocsSample/ArkUISample/Navigation/hvigor/hvigor-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..2d5b53c87bb8c7e5a38072d17a6e9b9533003301 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/hvigor/hvigor-config.json5 @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "5.1.0", + "dependencies": { + }, + "execution": { + // "analyze": "normal", /* Define the build analyze mode. Value: [ "normal" | "advanced" | false ]. Default: "normal" */ + // "daemon": true, /* Enable daemon compilation. Value: [ true | false ]. Default: true */ + // "incremental": true, /* Enable incremental compilation. Value: [ true | false ]. Default: true */ + // "parallel": true, /* Enable parallel compilation. Value: [ true | false ]. Default: true */ + // "typeCheck": false, /* Enable typeCheck. Value: [ true | false ]. Default: false */ + }, + "logging": { + // "level": "info" /* Define the log level. Value: [ "debug" | "info" | "warn" | "error" ]. Default: "info" */ + }, + "debugging": { + // "stacktrace": false /* Disable stacktrace compilation. Value: [ true | false ]. Default: false */ + }, + "nodeOptions": { + // "maxOldSpaceSize": 8192 /* Enable nodeOptions maxOldSpaceSize compilation. Unit M. Used for the daemon process. Default: 8192*/ + // "exposeGC": true /* Enable to trigger garbage collection explicitly. Default: true*/ + } +} diff --git a/code/DocsSample/ArkUISample/Navigation/hvigorfile.ts b/code/DocsSample/ArkUISample/Navigation/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..6b365cacd0191d3b1178eb6b9807b1ae0add6271 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { appTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: appTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/Navigation/oh-package.json5 b/code/DocsSample/ArkUISample/Navigation/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..b56a095f3819541cf150766a67ff7e23a23973a9 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "5.1.0", + "description": "Please describe the basic information.", + "dependencies": { + }, + "devDependencies": { + "@ohos/hypium": "1.0.21", + "@ohos/hamock": "1.0.0" + } +} diff --git a/code/DocsSample/ArkUISample/Navigation/ohosTest.md b/code/DocsSample/ArkUISample/Navigation/ohosTest.md new file mode 100644 index 0000000000000000000000000000000000000000..c42ba5654c47e8f6570d730019bda8c0b1f4f3f5 --- /dev/null +++ b/code/DocsSample/ArkUISample/Navigation/ohosTest.md @@ -0,0 +1,12 @@ +# Navigation 测试用例归档 + +## 用例表 + +| 测试功能 | 预置条件 | 输入 | 预期输出 | 是否自动 | 测试结果 | +| ------------------- | -------------- | ----------------------- | ------------------------------------------------------------ | :------- | -------- | +| Navigation示例代码验证 | 设备正常运行 | 进入各个示例页面，push页面然后返回 | 页面跳转、动画、布局均正常 | 是 | Pass | +| NavDestination示例代码验证 | 设备正常运行 | 进入各个示例页面，push页面然后返回 | 页面跳转、动画、布局均正常 | 是 | Pass | +| NavPathStack派生类示例代码验证 | 设备正常运行 | 进入各个示例页面，push页面然后查询页面栈 | 页面栈内容和实际效果一致 | 是 | Pass | +| 无感监听示例代码验证 | 设备正常运行 | 点击页面跳转按钮 | 页面跳转正常 | 是 | Pass | +| SideBarContainer示例代码验证 | 设备正常运行 | 进入各个示例页面，点击不同的索引 | 页面切换正常 | 是 | Pass | +| Stepper派生类示例代码验证 | 设备正常运行 | 点击status，然后再点击下一页 | 页面切换正常 | 是 | Pass | \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/Navigation/screenshots/device/image1.png b/code/DocsSample/ArkUISample/Navigation/screenshots/device/image1.png new file mode 100644 index 0000000000000000000000000000000000000000..0b1381f86b58ea6484f2f70e6a03e8f979354e1b Binary files /dev/null and b/code/DocsSample/ArkUISample/Navigation/screenshots/device/image1.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/.gitignore b/code/DocsSample/ArkUISample/VisionEffect/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..d2ff20141ceed86d87c0ea5d99481973005bab2b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/.gitignore @@ -0,0 +1,12 @@ +/node_modules +/oh_modules +/local.properties +/.idea +**/build +/.hvigor +.cxx +/.clangd +/.clang-format +/.clang-tidy +**/.test +/.appanalyzer \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/AppScope/app.json5 b/code/DocsSample/ArkUISample/VisionEffect/AppScope/app.json5 new file mode 100644 index 0000000000000000000000000000000000000000..9924f317ee3a649bf56499f4ce8e35719ecab181 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/AppScope/app.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "bundleName": "com.samples.visionEffect", + "vendor": "example", + "versionCode": 1000000, + "versionName": "1.0.0", + "icon": "$media:layered_image", + "label": "$string:app_name" + } +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/element/string.json b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..42c7546de5d951e8d23adbe2f47bd87ff07d7adf --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/element/string.json @@ -0,0 +1,8 @@ +{ + "string": [ + { + "name": "app_name", + "value": "VisionEffect" + } + ] +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/background.png b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/AppScope/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/README_zh.md b/code/DocsSample/ArkUISample/VisionEffect/README_zh.md new file mode 100644 index 0000000000000000000000000000000000000000..6430883789b0ff341dbaba95e6dc417acac7592c --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/README_zh.md @@ -0,0 +1,185 @@ +# ArkUI使用视效组件指南文档示例 + +### 介绍 + +本示例通过使用[ArkUI指南文档](https://gitee.com/openharmony/docs/tree/master/zh-cn/application-dev/ui)中各场景的开发示例，展示在工程中，帮助开发者更好地理解ArkUI提供的组件及组件属性并合理使用。该工程中展示的代码详细描述可查如下链接： + +1. [图形变换](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-transformation.md)。 +2. [透明度设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-opacity.md)。 +3. [形状裁剪](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-sharp-clipping.md)。 +4. [图像效果](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-image-effect.md) +5. [背景设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-background.md) +6. [组件内容模糊](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-foreground-blur-style.md) +7. [前景色设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-foreground-color.md) +8. [点击回弹效果](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-click-effect.md) +9. [特效绘制合并](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-use-effect.md) +10. [组件内容填充方式](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-renderfit.md) +11. [外描边设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-outline.md) +12. [运动模糊](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-motionBlur.md) +13. [颜色渐变](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-gradient-color.md) +14. [前景属性设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-foreground-effect.md) +15. [视效设置](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-filter-effect.md) + + +### 效果预览 + +| 首页 | +|------------------------------------| +| ![](screenshots/device/image1.png) | + +### 使用说明 + +1. 在主界面，可以点击对应卡片，选择需要参考的组件示例。 + +2. 在组件目录选择详细的示例参考。 + +3. 进入示例界面，查看参考示例。 + +4. 通过自动测试框架可进行测试及维护。 + +### 工程目录 +``` +entry/src/main/ets/ +|---entryability +|---pages +| |---background // 背景设置 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| | |---template5 +| | | |---Index.ets +| | |---template6 +| | | |---Index.ets +| | |---template7 +| | | |---Index.ets +| |---clickEffect // 点击回弹效果 +| | |---template1 +| | | |---Index.ets +| |---clip // 形状裁剪 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| |---foregroundBlurStyle // 组件内容模糊 +| | |---template1 +| | | |---Index.ets +| |---foregroundColor // 前景色设置 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| |---foregroundEffect // 前景属性设置 +| | |---template1 +| | | |---Index.ets +| |---imageEffect // 图像效果 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| | |---template4 +| | | |---Index.ets +| | |---template5 +| | | |---Index.ets +| | |---template6 +| | | |---Index.ets +| | |---template7 +| | | |---Index.ets +| | |---template8 +| | | |---Index.ets +| | |---template9 +| | | |---Index.ets +| | |---template10 +| | | |---Index.ets +| |---linearGradient // 颜色渐变 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| |---motionBlur // 运动模糊 +| | |---template1 +| | | |---Index.ets +| |---opacity // 透明度设置 +| | |---template1 +| | | |---Index.ets +| |---outline // 外描边设置 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| |---renderFit // 组件内容填充方式 +| | |---template1 +| | | |---Index.ets +| |---transform // 图形变换 +| | |---template1 +| | | |---Index.ets +| | |---template2 +| | | |---Index.ets +| | |---template3 +| | | |---Index.ets +| |---useEffect // 特效绘制合并 +| | |---template1 +| | | |---Index.ets +| |---visualEffect // 视效设置 +| | |---template1 +| | | |---Index.ets +|---pages +| |---Index.ets // 应用主页面 +entry/src/ohosTest/ +|---ets +| |---test +| | |---Background.test.ets // 背景设置示例代码测试代码 +| | |---ClickEffect.test.ets // 点击回弹效果示例代码测试代码 +| | |---Clip.test.ets // 形状裁剪示例代码测试代码 +| | |---ForegroundBlurStyle.test.ets // 组件内容模糊示例代码测试代码 +| | |---ForegroundColor.test.ets // 前景色设置示例代码测试代码 +| | |---ForegroundEffect.test.ets // 前景属性设置示例代码测试代码 +| | |---ImageEffect.test.ets // 图像效果示例代码测试代码 +| | |---LinearGradient.test.ets // 颜色渐变示例代码测试代码 +| | |---MotionBlur.test.ets // 运动模糊示例代码测试代码 +| | |---Opacity.test.ets // 透明度设置示例代码测试代码 +| | |---OutLine.test.ets // 外描边设置示例代码测试代码 +| | |---RenderFit.test.ets // 组件内容填充方式示例代码测试代码 +| | |---Transform.test.ets // 图形变换示例代码测试代码 +| | |---UseEffect.test.ets // 特效绘制合并示例代码测试代码 +| | |---VisualEffect.test.ets // 视效设置示例代码测试代码 +``` + +### 相关权限 + +不涉及。 + +### 依赖 + +不涉及。 + +### 约束与限制 + +1.本示例仅支持标准系统上运行, 支持设备：RK3568。 + +2.本示例为Stage模型，支持API18版本SDK，版本号：5.1.0.56，镜像版本号：OpenHarmony_5.1.0.56。 + +3.本示例需要使用DevEco Studio 6.0.0 Canary1 (Build Version: 6.0.0.270， built on May 9, 2025)及以上版本才可编译运行。 + + +### 下载 + +如需单独下载本工程，执行如下命令： + +```` +git init +git config core.sparsecheckout true +echo code/DocsSample/ArkUIDocSample/VisionEffect > .git/info/sparse-checkout +git remote add origin https://gitee.com/openharmony/applications_app_samples.git +git pull origin master +```` \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/build-profile.json5 b/code/DocsSample/ArkUISample/VisionEffect/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..e1244ceecbe969910aa0eb4f5ec4543c58ee4225 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/build-profile.json5 @@ -0,0 +1,56 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "app": { + "signingConfigs": [], + "products": [ + { + "name": "default", + "signingConfig": "default", + "targetSdkVersion": "20", + "compatibleSdkVersion": "20", + "runtimeOS": "OpenHarmony", + "buildOption": { + "strictMode": { + "caseSensitiveCheck": true, + "useNormalizedOHMUrl": true + } + } + } + ], + "buildModeSet": [ + { + "name": "debug", + }, + { + "name": "release" + } + ] + }, + "modules": [ + { + "name": "entry", + "srcPath": "./entry", + "targets": [ + { + "name": "default", + "applyToProducts": [ + "default" + ] + } + ] + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/code-linter.json5 b/code/DocsSample/ArkUISample/VisionEffect/code-linter.json5 new file mode 100644 index 0000000000000000000000000000000000000000..5c4682f8164874ec7e9cb8f99ff8b3228ffbc126 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/code-linter.json5 @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "files": [ + "**/*.ets" + ], + "ignore": [ + "**/src/ohosTest/**/*", + "**/src/test/**/*", + "**/src/mock/**/*", + "**/node_modules/**/*", + "**/oh_modules/**/*", + "**/build/**/*", + "**/.preview/**/*" + ], + "ruleSet": [ + "plugin:@performance/recommended", + "plugin:@typescript-eslint/recommended" + ], + "rules": { + "@security/no-unsafe-aes": "error", + "@security/no-unsafe-hash": "error", + "@security/no-unsafe-mac": "warn", + "@security/no-unsafe-dh": "error", + "@security/no-unsafe-dsa": "error", + "@security/no-unsafe-ecdsa": "error", + "@security/no-unsafe-rsa-encrypt": "error", + "@security/no-unsafe-rsa-sign": "error", + "@security/no-unsafe-rsa-key": "error", + "@security/no-unsafe-dsa-key": "error", + "@security/no-unsafe-dh-key": "error", + "@security/no-unsafe-3des": "error" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/.gitignore b/code/DocsSample/ArkUISample/VisionEffect/entry/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..e2713a2779c5a3e0eb879efe6115455592caeea5 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/.gitignore @@ -0,0 +1,6 @@ +/node_modules +/oh_modules +/.preview +/build +/.cxx +/.test \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/build-profile.json5 b/code/DocsSample/ArkUISample/VisionEffect/entry/build-profile.json5 new file mode 100644 index 0000000000000000000000000000000000000000..982dbb524bd63408e05cfbed7204dd87a31dd681 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/build-profile.json5 @@ -0,0 +1,42 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "apiType": "stageMode", + "buildOption": { + }, + "buildOptionSet": [ + { + "name": "release", + "arkOptions": { + "obfuscation": { + "ruleOptions": { + "enable": false, + "files": [ + "./obfuscation-rules.txt" + ] + } + } + } + }, + ], + "targets": [ + { + "name": "default" + }, + { + "name": "ohosTest", + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/hvigorfile.ts b/code/DocsSample/ArkUISample/VisionEffect/entry/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..8774588471ede4c1563f09d9a1d22f764bb1fd9e --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hapTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/obfuscation-rules.txt b/code/DocsSample/ArkUISample/VisionEffect/entry/obfuscation-rules.txt new file mode 100644 index 0000000000000000000000000000000000000000..272efb6ca3f240859091bbbfc7c5802d52793b0b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/obfuscation-rules.txt @@ -0,0 +1,23 @@ +# Define project specific obfuscation rules here. +# You can include the obfuscation configuration files in the current module's build-profile.json5. +# +# For more details, see +# https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/source-obfuscation-V5 + +# Obfuscation options: +# -disable-obfuscation: disable all obfuscations +# -enable-property-obfuscation: obfuscate the property names +# -enable-toplevel-obfuscation: obfuscate the names in the global scope +# -compact: remove unnecessary blank spaces and all line feeds +# -remove-log: remove all console.* statements +# -print-namecache: print the name cache that contains the mapping from the old names to new names +# -apply-namecache: reuse the given cache file + +# Keep options: +# -keep-property-name: specifies property names that you want to keep +# -keep-global-name: specifies names that you want to keep in the global scope + +-enable-property-obfuscation +-enable-toplevel-obfuscation +-enable-filename-obfuscation +-enable-export-obfuscation \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/oh-package.json5 b/code/DocsSample/ArkUISample/VisionEffect/entry/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..10cda399b0aec3099b257299a57d284393e4e55a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "name": "entry", + "version": "1.0.0", + "description": "Please describe the basic information.", + "main": "", + "author": "", + "license": "", + "dependencies": {} +} + diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entryability/EntryAbility.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entryability/EntryAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..081b700cacec6def24d204fbc37ab93985f7b4ec --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entryability/EntryAbility.ets @@ -0,0 +1,95 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { AbilityConstant, ConfigurationConstant, UIAbility, Want } from '@kit.AbilityKit'; +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { display, uiObserver, window } from '@kit.ArkUI'; + +const DOMAIN = 0x0000; + +function callBackFunc(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +function callBackFunc2(info: uiObserver.NavDestinationSwitchInfo) { + console.info(`testTag2 navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`) +} + +export default class EntryAbility extends UIAbility { + onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { + this.context.getApplicationContext().setColorMode(ConfigurationConstant.ColorMode.COLOR_MODE_NOT_SET); + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onCreate'); + uiObserver.on('navDestinationSwitch', this.context, callBackFunc); + uiObserver.on('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc2); + } + + onDestroy(): void { + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onDestroy'); + uiObserver.off('navDestinationSwitch', this.context, callBackFunc); + uiObserver.off('navDestinationSwitch', this.context, { + navigationId: 'myNavId' + }, callBackFunc); + } + + onWindowStageCreate(windowStage: window.WindowStage): void { + // Main window is created, set main page for this ability + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); + let mainWindow: window.Window; + try { + mainWindow = windowStage.getMainWindowSync(); + let displayClass: display.Display = display.getDefaultDisplaySync(); + AppStorage.setOrCreate('orientation', displayClass.orientation); + // 监听窗口的windowsSizeChange事件，旋转屏时会触发该事件 + mainWindow.on('windowSizeChange', (data) => { + console.info('Succeeded in enabling the listener for window size changes. Data: ' + JSON.stringify(data)); + let displayClass: display.Display | null = null; + try { + displayClass = display.getDefaultDisplaySync(); + console.info('display orientation is ' + JSON.stringify(displayClass.orientation)); + // 获取屏幕的显示方向 + AppStorage.set('orientation', displayClass.orientation); + } catch { + return; + } + }) + } catch { + hilog.info(0x0000, 'testTag', '%{public}s', 'error'); + return; + } + windowStage.loadContent('pages/Index', (err) => { + if (err.code) { + hilog.error(DOMAIN, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err)); + return; + } + hilog.info(DOMAIN, 'testTag', 'Succeeded in loading the content.'); + }); + } + + onWindowStageDestroy(): void { + // Main window is destroyed, release UI related resources + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onWindowStageDestroy'); + } + + onForeground(): void { + // Ability has brought to foreground + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onForeground'); + } + + onBackground(): void { + // Ability has back to background + hilog.info(DOMAIN, 'testTag', '%{public}s', 'Ability onBackground'); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets new file mode 100644 index 0000000000000000000000000000000000000000..4ce6449f0e91914e73d4502c9f2e8e9a395ea4b1 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/entrybackupability/EntryBackupAbility.ets @@ -0,0 +1,30 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { BackupExtensionAbility, BundleVersion } from '@kit.CoreFileKit'; + +const DOMAIN = 0x0000; + +export default class EntryBackupAbility extends BackupExtensionAbility { + async onBackup() { + hilog.info(DOMAIN, 'testTag', 'onBackup ok'); + await Promise.resolve(); + } + + async onRestore(bundleVersion: BundleVersion) { + hilog.info(DOMAIN, 'testTag', 'onRestore ok %{public}s', JSON.stringify(bundleVersion)); + await Promise.resolve(); + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0009564a340d13c6dbd9c8e4a895302929769b70 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/Index.ets @@ -0,0 +1,258 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import curves from '@ohos.curves'; +import { Route, RouteGroup } from './common/Index'; +import { KeyboardAvoidMode } from '@kit.ArkUI'; +import router from '@ohos.router'; + +@Styles +function cardPressedStyle() { + .backgroundColor('rgba(0,0,0,0.1)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardNormalStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(1) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + +@Styles +function cardDisabledStyle() { + .backgroundColor('rgba(0,0,0,0)') + .opacity(0.5) + .animation({ curve: curves.cubicBezierCurve(0.33, 0, 0.67, 1), duration: 100 }) +} + + +@Entry +@Component +struct VisionEffectIndex { + @Provide('router') router: NavPathStack = new NavPathStack(); + @State routes: RouteGroup[] = [ + { + name: "transform", + label: $r('app.string.transform'), + children: [ + { name: 'template1/Index', label: $r('app.string.example_one_transform') }, + { name: 'template2/Index', label: $r('app.string.example_two_transform') }, + { name: 'template3/Index', label: $r('app.string.example_three_transform') }, + ] + },{ + name: "opacity", + label: $r('app.string.opacity'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_opacity') }, + ] + }, { + name: "clip", + label: $r('app.string.clip'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_clip') }, + { name: 'template2/Index', label: $r('app.string.example_two_clip') }, + ] + }, { + name: "imageEffect", + label: $r('app.string.imageEffect'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_imageEffect') }, + { name: 'template2/Index', label: $r('app.string.example_two_imageEffect') }, + { name: 'template3/Index', label: $r('app.string.example_three_imageEffect') }, + { name: 'template4/Index', label: $r('app.string.example_four_imageEffect') }, + { name: 'template5/Index', label: $r('app.string.example_five_imageEffect') }, + { name: 'template6/Index', label: $r('app.string.example_six_imageEffect') }, + { name: 'template7/Index', label: $r('app.string.example_seven_imageEffect') }, + { name: 'template8/Index', label: $r('app.string.example_eight_imageEffect') }, + { name: 'template9/Index', label: $r('app.string.example_nine_imageEffect') }, + { name: 'template10/Index', label: $r('app.string.example_ten_imageEffect') }, + ] + }, { + name: "background", + label: $r('app.string.background'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_background') }, + { name: 'template2/Index', label: $r('app.string.example_two_background') }, + { name: 'template3/Index', label: $r('app.string.example_three_background') }, + { name: 'template4/Index', label: $r('app.string.example_four_background') }, + { name: 'template5/Index', label: $r('app.string.example_five_background') }, + { name: 'template6/Index', label: $r('app.string.example_six_background') }, + { name: 'template7/Index', label: $r('app.string.example_seven_background') }, + ] + }, { + name: "foregroundBlurStyle", + label: $r('app.string.foregroundBlurStyle'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_foregroundBlurStyle') }, + ] + }, { + name: "foregroundColor", + label: $r('app.string.foregroundColor'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_foregroundColor') }, + { name: 'template2/Index', label: $r('app.string.example_two_foregroundColor') }, + { name: 'template3/Index', label: $r('app.string.example_three_foregroundColor') }, + ] + }, { + name: "clickEffect", + label: $r('app.string.clickEffect'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_clickEffect') }, + ] + }, { + name: "useEffect", + label: $r('app.string.useEffect'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_useEffect') }, + ] + }, { + name: "renderFit", + label: $r('app.string.renderFit'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_renderFit') }, + ] + }, { + name: "outline", + label: $r('app.string.outline'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_outline') }, + { name: 'template2/Index', label: $r('app.string.example_two_outline') }, + ] + }, { + name: "motionBlur", + label: $r('app.string.motionBlur'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_motionBlur') }, + ] + }, { + name: "linearGradient", + label: $r('app.string.linearGradient'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_linearGradient') }, + { name: 'template2/Index', label: $r('app.string.example_two_linearGradient') }, + { name: 'template3/Index', label: $r('app.string.example_three_linearGradient') }, + ] + }, { + name: "foregroundEffect", + label: $r('app.string.foregroundEffect'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_foregroundEffect') }, + ] + }, { + name: "visualEffect", + label: $r('app.string.visualEffect'), + children:[ + { name: 'template1/Index', label: $r('app.string.example_one_visualEffect') }, + ] + } + ]; + @State selection: string | null = null; + + @Builder + ListItemGroupHeader(route: RouteGroup) { + Row() { + Text(route.label) + .fontColor($r('sys.color.ohos_id_color_text_primary')) + .fontWeight(FontWeight.Medium) + + Blank() + + Text(`${route.children.length}`) + .fontColor($r('sys.color.ohos_id_color_text_secondary')) + .opacity(this.selection === route.name ? 0 : 1) + + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + .rotate({ angle: this.selection === route.name ? 90 : 0 }) + .animation({ curve: curves.interpolatingSpring(0, 1, 228, 30) }) + } + .borderRadius(20) + .width('100%') + .padding(8) + .enabled(!!route.children.length) + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .onClick(() => { + animateTo( + { curve: curves.interpolatingSpring(0, 1, 228, 25) }, + () => { + if (this.selection === route.name) { + this.selection = null; + } else { + this.selection = route.name; + } + }); + }) + } + + aboutToAppear(): void{ + this.getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE); + } + build() { + Column() { + Text("VisionEffectIndex") + List() { + ForEach(this.routes, (routeGroup: RouteGroup) => { + ListItemGroup({ + header: this.ListItemGroupHeader(routeGroup), + style: ListItemGroupStyle.CARD, + }) { + if (routeGroup.name === this.selection) { + ForEach(routeGroup.children, (route: Route) => { + ListItem() { + Row() { + Text(route.label).fontSize(16) + Blank() + Image($r('sys.media.ohos_ic_public_arrow_right')) + .fillColor($r('sys.color.ohos_id_color_fourth')) + .height(24) + .width(24) + } + .stateStyles({ + pressed: cardPressedStyle, + normal: cardNormalStyle, + disabled: cardDisabledStyle, + }) + .borderRadius(20) + .padding(8) + .transition( + TransitionEffect.OPACITY.animation({ + curve: curves.interpolatingSpring(0, 1, 228, 30) + }) + ) + .width('100%') + .onClick(() => { + const name = `pages/${routeGroup.name}/${route.name}`; + router.pushUrl({url: name}) + }) + } + .width('100%') + }) + } + } + .padding(2) + .divider({ strokeWidth: 0.5 }) + }) + }.padding({bottom: 10}) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..4734a1586138c3f51a292c5edb306c6d06b9e362 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template1/Index.ets @@ -0,0 +1,76 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackgroundExample { + + build() { + Column({ space: 5 }) { + Text('background color').fontSize(9).width('90%').fontColor(0xCCCCCC) + Row().width('90%').height(50).backgroundColor(0xE5E5E5).border({ width: 1 }) + + Text('background image repeat along X').fontSize(9).width('90%').fontColor(0xCCCCCC) + Row() + .backgroundImage($r('app.media.bg'), ImageRepeat.X) + .backgroundImageSize({ width: '250px', height: '140px' }) + .width('90%') + .height(70) + .border({ width: 1 }) + + Text('background image repeat along Y').fontSize(9).width('90%').fontColor(0xCCCCCC) + Row() + .backgroundImage($r('app.media.bg'), ImageRepeat.Y) + .backgroundImageSize({ width: '500px', height: '120px' }) + .width('90%') + .height(100) + .border({ width: 1 }) + + Text('background image size').fontSize(9).width('90%').fontColor(0xCCCCCC) + Row() + .width('90%').height(150) + .backgroundImage($r('app.media.bg'), ImageRepeat.NoRepeat) + .backgroundImageSize({ width: 1000, height: 500 }) + .border({ width: 1 }) + + Text('background fill the box(Cover)').fontSize(9).width('90%').fontColor(0xCCCCCC) + // 不保证图片完整的情况下占满盒子 + Row() + .width(200) + .height(50) + .backgroundImage($r('app.media.bg'), ImageRepeat.NoRepeat) + .backgroundImageSize(ImageSize.Cover) + .border({ width: 1 }) + + Text('background fill the box(Contain)').fontSize(9).width('90%').fontColor(0xCCCCCC) + // 保证图片完整的情况下放到最大 + Row() + .width(200) + .height(50) + .backgroundImage($r('app.media.bg'), ImageRepeat.NoRepeat) + .backgroundImageSize(ImageSize.Contain) + .border({ width: 1 }) + + Text('background image position').fontSize(9).width('90%').fontColor(0xCCCCCC) + Row() + .width(100) + .height(50) + .backgroundImage($r('app.media.bg'), ImageRepeat.NoRepeat) + .backgroundImageSize({ width: 1000, height: 560 }) + .backgroundImagePosition({ x: -500, y: -300 }) + .border({ width: 1 }) + } + .width('100%').height('100%').padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..c408a685db10436863c46c24bc36122b42f7d87c --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template2/Index.ets @@ -0,0 +1,33 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackgroundBlurStyleDemo { + build() { + Column() { + Row() { + Text("Thin Material") + } + .width('50%') + .height('50%') + .backgroundBlurStyle(BlurStyle.Thin, { colorMode: ThemeColorMode.LIGHT, adaptiveColor: AdaptiveColor.DEFAULT, scale: 1.0 }) + .position({ x: '15%', y: '30%' }) + } + .height('100%') + .width('100%') + .backgroundImage($r('app.media.bg')) + .backgroundImageSize(ImageSize.Cover) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template3/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..b9528455392b22b511873da717b38a94e342c03b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template3/Index.ets @@ -0,0 +1,38 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackgroundExample3 { + @Builder renderBackground() { + Column() { + Progress({value : 50}) + } + } + + build() { + Column() { + Text("content") + .width(100) + .height(40) + .fontColor("#FFF") + .position({x:50, y:80}) + .textAlign(TextAlign.Center) + .backgroundColor(Color.Green) + } + .width(200).height(200) + .background(this.renderBackground) + .backgroundColor(Color.Gray) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template4/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0468499b4d3ef24b8124146406dc017b94e4597c --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template4/Index.ets @@ -0,0 +1,34 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackgroundBrightnessDemo { + build() { + Column() { + Row() { + Text("BackgroundBrightness") + } + .width(200) + .height(100) + .position({ x: 100, y: 100 }) + .backgroundBlurStyle(BlurStyle.Thin, { colorMode: ThemeColorMode.LIGHT, adaptiveColor: AdaptiveColor.DEFAULT}) + .backgroundBrightness({rate:0.5,lightUpDegree:0.5}) // 背景提亮效果 + } + .width('100%') + .height('100%') + .backgroundImage($r('app.media.image')) + .backgroundImageSize(ImageSize.Cover) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template5/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ac5c34baee8d84777b82e93e1569c7a005dd283d --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template5/Index.ets @@ -0,0 +1,45 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BlurEffectsExample { + build() { + Column({ space: 10 }) { + // 对字体进行模糊 + Text('font blur').fontSize(15).fontColor(0xCCCCCC).width('90%') + Flex({ alignItems: ItemAlign.Center }) { + Text('original text').margin(10) + Text('blur text') + .blur(5).margin(10) + Text('blur text') + .blur(10, undefined).margin(10) // 内容模糊半径为5，禁用系统自适应优化策略。 + Text('blur text') + .blur(15).margin(10) + }.width('90%').height(40) + .backgroundColor(0xF9CF93) + + + // 对背景进行模糊 + Text('backdropBlur').fontSize(15).fontColor(0xCCCCCC).width('90%') + Text() + .width('90%') + .height(40) + .fontSize(16) + .backdropBlur(3) + .backgroundImage($r('app.media.image')) + .backgroundImageSize({ width: 1200, height: 160 }) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template6/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ed5b3300890fa1ca9458d3539489c2f0ea7d461a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template6/Index.ets @@ -0,0 +1,98 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackGround6 { + @State shColor: Color = Color.White; + @State sizeDate: number = 20; + @State rVal: number = 255; + @State gVal: number = 255; + @State bVal: number = 255; + @State aVal: number = 0.1; + @State rad: number = 40; + @State satVal: number = 0.8; + @State briVal: number = 1.5; + build() { + Stack() { + Image($r('app.media.image')) + Column() { + Column({ space: 0 }) { + Column() { + Text('11') + .fontSize(144) + .fontWeight(FontWeight.Bold) + .fontColor('rgba(255,255,255,1)') + .fontFamily('HarmonyOS-Sans-Digit') + .maxLines(1) + .lineHeight(120 * 1.25) + .height(120 * 1.25) + .letterSpacing(4 * 1.25) + Text('42') + .fontSize(144) + .fontWeight(FontWeight.Bold) + .fontColor('rgba(255,255,255,1)') + .fontFamily('HarmonyOS-Sans-Digit') + .maxLines(1) + .lineHeight(120 * 1.25) + .height(120 * 1.25) + .letterSpacing(4 * 1.25) + .shadow({ + color: 'rgba(0,0,0,0)', + radius: 20, + offsetX: 0, + offsetY: 0 + }) + Row() { + Text($r('app.string.October_16th')) + .fontSize(this.sizeDate) + .height(22) + .fontWeight('medium') + .fontColor('rgba(255,255,255,1)') + Text($r('app.string.Monday')) + .fontSize(this.sizeDate) + .height(22) + .fontWeight('medium') + .fontColor('rgba(255,255,255,1)') + } + } + .blendMode(BlendMode.DST_IN, BlendApplyType.OFFSCREEN) + .pixelRound({ + start: PixelRoundCalcPolicy.FORCE_FLOOR , + top: PixelRoundCalcPolicy.FORCE_FLOOR , + end: PixelRoundCalcPolicy.FORCE_CEIL, + bottom: PixelRoundCalcPolicy.FORCE_CEIL + }) + } + .blendMode(BlendMode.SRC_OVER, BlendApplyType.OFFSCREEN) + .backgroundEffect({ + radius: this.rad, + saturation: this.satVal, + brightness: this.briVal, + color: this.getVolumeDialogWindowColor() + }) + .justifyContent(FlexAlign.Center) + .pixelRound({ + start: PixelRoundCalcPolicy.FORCE_FLOOR , + top: PixelRoundCalcPolicy.FORCE_FLOOR , + end: PixelRoundCalcPolicy.FORCE_CEIL, + bottom: PixelRoundCalcPolicy.FORCE_CEIL + }) + } + } + } + getVolumeDialogWindowColor(): ResourceColor | string { + return `rgba(${this.rVal.toFixed(0)}, ${this.gVal.toFixed(0)}, ${this.bVal.toFixed(0)}, ${this.aVal.toFixed(0)})`; + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template7/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template7/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..e62f9cfaaf8b9f52cd128c350cd93ab9e9571b10 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/background/template7/Index.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct BackGroundBlur { + private imageSize: number = 150; + + build() { + Column({ space: 5 }) { + // backgroundBlurStyle通过枚举值的方式设置模糊参数 + Stack() { + Image($r('app.media.test')) + .width(this.imageSize) + .height(this.imageSize) + Column() + .width(this.imageSize) + .height(this.imageSize) + .backgroundBlurStyle(BlurStyle.Thin) + } + + // backgroundEffect 可以自定义设置 模糊半径，亮度，饱和度等参数 + Stack() { + Image($r('app.media.test')) + .width(this.imageSize) + .height(this.imageSize) + Column() + .width(this.imageSize) + .height(this.imageSize) + .backgroundEffect({ radius: 20, brightness: 0.6, saturation: 15 }) + } + + // backdropBlur 只能设置模糊半径和灰阶参数 + Stack() { + Image($r('app.media.test')) + .width(this.imageSize) + .height(this.imageSize) + Column() + .width(this.imageSize) + .height(this.imageSize) + .backdropBlur(20, { grayscale: [30, 50] }) + } + } + .width('100%') + .padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clickEffect/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clickEffect/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..e65dd2d3b498ed34bbef705bfd406204694085bf --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clickEffect/template1/Index.ets @@ -0,0 +1,80 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ToggleExample { + build() { + Column({ space: 10 }) { + Text('type: Switch').fontSize(12).fontColor(0xcccccc).width('90%') + Flex({ justifyContent: FlexAlign.SpaceEvenly, alignItems: ItemAlign.Center }) { + Toggle({ type: ToggleType.Switch, isOn: false }) + .clickEffect({level:ClickEffectLevel.LIGHT}) + .selectedColor('#007DFF') + .switchPointColor('#FFFFFF') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + + Toggle({ type: ToggleType.Switch, isOn: true }) + .clickEffect({level:ClickEffectLevel.LIGHT, scale: 0.5}) + .selectedColor('#007DFF') + .switchPointColor('#FFFFFF') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + } + + Text('type: Checkbox').fontSize(12).fontColor(0xcccccc).width('90%') + Flex({ justifyContent: FlexAlign.SpaceEvenly, alignItems: ItemAlign.Center }) { + Toggle({ type: ToggleType.Checkbox, isOn: false }) + .clickEffect({level:ClickEffectLevel.MIDDLE}) + .size({ width: 20, height: 20 }) + .selectedColor('#007DFF') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + + Toggle({ type: ToggleType.Checkbox, isOn: true }) + .clickEffect({level:ClickEffectLevel.MIDDLE, scale: 0.5}) + .size({ width: 20, height: 20 }) + .selectedColor('#007DFF') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + } + + Text('type: Button').fontSize(12).fontColor(0xcccccc).width('90%') + Flex({ justifyContent: FlexAlign.SpaceEvenly, alignItems: ItemAlign.Center }) { + Toggle({ type: ToggleType.Button, isOn: false }) { + Text('status button').fontColor('#182431').fontSize(12) + }.width(106) + .clickEffect({level:ClickEffectLevel.HEAVY}) + .selectedColor('rgba(0,125,255,0.20)') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + + Toggle({ type: ToggleType.Button, isOn: true }) { + Text('status button').fontColor('#182431').fontSize(12) + }.width(106) + .clickEffect({level:ClickEffectLevel.HEAVY, scale: 0.5}) + .selectedColor('rgba(0,125,255,0.20)') + .onChange((isOn: boolean) => { + console.info('Component status:' + isOn); + }) + } + }.width('100%').padding(24) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0a1d54c4ca931ec1f2833f10ea18d6b49e96e2ba --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template1/Index.ets @@ -0,0 +1,48 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { CircleShape, RectShape } from '@kit.ArkUI'; + +@Entry +@Component +struct ClipAndMaskExample { + build() { + Column({ space: 15 }) { + Text('clip').fontSize(12).width('75%').fontColor('#DCDCDC') + Row() { + Image($r('app.media.testImg')).width('500px').height('280px') + } + .clip(true) // 如这里不设置clip为true，则Row组件的圆角不会限制其中的Image组件，Image组件的四个角会超出Row + .borderRadius(20) + + // 用一个280px直径的圆对图片进行裁剪 + Image($r('app.media.testImg')) + .clipShape(new CircleShape({ width: '280px', height: '280px' })) + .width('500px').height('280px') + + Text('mask').fontSize(12).width('75%').fontColor('#DCDCDC') + // 给图片添加了一个500px*280px的方形遮罩 + Image($r('app.media.testImg')) + .maskShape(new RectShape({ width: '500px', height: '280px' }).fill(Color.Gray)) + .width('500px').height('280px') + + // 给图片添加了一个280px*280px的圆形遮罩 + Image($r('app.media.testImg')) + .maskShape(new CircleShape({ width: '280px', height: '280px' }).fill(Color.Gray)) + .width('500px').height('280px') + } + .width('100%') + .margin({ top: 15 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..cfc4e66efb34bd8355664c3af839cfe3bf6d4f7e --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/clip/template2/Index.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ProgressMaskExample { + @State progressFlag1: boolean = true; + @State color: Color = 0x01006CDE; + @State value: number = 10.0; + @State enableBreathingAnimation: boolean = false; + @State progress: ProgressMask = new ProgressMask(10.0, 100.0, Color.Gray); + + build() { + Column({ space: 15 }) { + Text('progress mask').fontSize(12).width('75%').fontColor('#DCDCDC') + // 给图片添加了一个280px*280px的进度遮罩 + Image($r('app.media.testImg')) + .width('500px').height('280px') + .mask(this.progress) + .animation({ + duration: 2000, // 动画时长 + curve: Curve.Linear, // 动画曲线 + delay: 0, // 动画延迟 + iterations: 1, // 播放次数 + playMode: PlayMode.Normal // 动画模式 + }) // 对Button组件的宽高属性进行动画配置 + + // 更新进度遮罩的进度值 + Button('updateProgress') + .onClick((event?: ClickEvent) => { + this.value += 10; + this.progress.updateProgress(this.value); + }).width(200).height(50).margin(20) + + // 更新进度遮罩的颜色 + Button('updateColor') + .onClick((event?: ClickEvent) => { + if (this.progressFlag1) { + this.progress.updateColor(0x9fff0000); + } else { + this.progress.updateColor(0x9f0000ff); + } + this.progressFlag1 = !this.progressFlag1 + }).width(200).height(50).margin(20) + + // 开关呼吸光晕动画 + Button('enableBreathingAnimation:' + this.enableBreathingAnimation) + .onClick((event?: ClickEvent) => { + this.enableBreathingAnimation = !this.enableBreathingAnimation; + this.progress.enableBreathingAnimation(this.enableBreathingAnimation); + }).width(200).height(50).margin(20) + + // 恢复进度遮罩 + Button('click reset!') + .onClick((event?: ClickEvent) => { + this.value = 0; + this.progress.updateProgress(this.value); + }).width(200).height(50).margin(20) + } + .width('100%') + .margin({ top: 15 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/common/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/common/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..02c5c6b987280c6731d3e40af7c56c416176a3af --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/common/Index.ets @@ -0,0 +1,23 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export interface Route { + name: string; + label: ResourceStr; +} + +export interface RouteGroup extends Route { + children: Route[]; +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundBlurStyle/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundBlurStyle/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..df17604a668859bed453c09ceca3488b2cf01a33 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundBlurStyle/template1/Index.ets @@ -0,0 +1,30 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ForegroundBlurStyleDemo { + build() { + Column() { + Text('Thin Material').fontSize(30).fontColor(0xCCCCCC) + Image($r('app.media.bg')) + .width(300) + .height(350) + .foregroundBlurStyle(BlurStyle.Thin, + { colorMode: ThemeColorMode.LIGHT, adaptiveColor: AdaptiveColor.DEFAULT, scale: 1.0 }) + } + .height('100%') + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..df1a63222cb31fcbefe89ae607ade7f80180086b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template1/Index.ets @@ -0,0 +1,26 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ForegroundColorExample { + build() { + Column({ space: 100 }) { + // 绘制一个直径为150的圆,默认填充色为黑色 + Circle({ width: 150, height: 200 }) + // 绘制一个直径为150的圆， + Circle({ width: 150, height: 200 }).foregroundColor(Color.Red) + }.width('100%').backgroundColor(Color.Blue) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..14ff92a2cf34b54c180f74dc29ad57c2c8cefc19 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template2/Index.ets @@ -0,0 +1,28 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ColoringStrategyExample { + build() { + Column({ space: 100 }) { + // 绘制一个直径为150的圆,默认填充色为黑色 + Circle({ width: 150, height: 200 }) + // 绘制一个直径为150的圆，设置前景色为组件背景色的反色 + Circle({ width: 150, height: 200 }) + .backgroundColor(Color.Black) + .foregroundColor(ColoringStrategy.INVERT) + }.width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template3/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..9bc2885229020008cd68e3b3086b07e3e1808a54 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundColor/template3/Index.ets @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct foregroundColorInherit { + build() { + Column() { + Button('设置前景色为橘色').fontSize(20).foregroundColor(Color.Orange).backgroundColor(Color.Gray) + Divider() + Button('未设置前景色继承自父组件').fontSize(20).backgroundColor(Color.Gray) + }.foregroundColor(Color.Red) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundEffect/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundEffect/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d2fae7b9c27a85791a763a5ba922d0b39b21c0d2 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/foregroundEffect/template1/Index.ets @@ -0,0 +1,29 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ForegroundEffectExample { + build() { + Row() { + Image($r('app.media.icon')) + .width(100) + .height(100) + .foregroundEffect({ radius: 20 }) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..543c1b789a6a6b8bb756464cc68051ad30b3b6b9 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template1/Index.ets @@ -0,0 +1,83 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ImageEffectsExample { + build() { + Column({ space: 5 }) { + // 添加阴影效果，图片效果不变 + Text('shadow').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')) + .width('90%') + .height(30) + .shadow({ + radius: 10, + color: Color.Green, + offsetX: 20, + offsetY: 20 + }) + + // 添加内部阴影效果 + Text('shadow').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')) + .width('90%') + .height(30) + .shadow({ + radius: 5, + color: Color.Green, + offsetX: 20, + offsetY: 20, + fill: true + }).opacity(0.5) + + // 灰度效果0~1，越接近1，灰度越明显 + Text('grayscale').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).grayscale(0.3) + Image($r('app.media.image')).width('90%').height(30).grayscale(0.8) + + // 高光效果，1为正常图片，<1变暗，>1亮度增大 + Text('brightness').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).brightness(1.2) + + // 饱和度，原图为1 + Text('saturate').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).saturate(2.0) + Image($r('app.media.image')).width('90%').height(30).saturate(0.7) + + // 对比度，1为原图，>1值越大越清晰，<1值越小越模糊 + Text('contrast').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).contrast(2.0) + Image($r('app.media.image')).width('90%').height(30).contrast(0.8) + + // 图像反转比例 + Text('invert').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).invert(0.2) + Image($r('app.media.image')).width('90%').height(30).invert(0.8) + + // 叠色添加 + Text('colorBlend').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).colorBlend(Color.Green) + Image($r('app.media.image')).width('90%').height(30).colorBlend(Color.Blue) + + // 深褐色 + Text('sepia').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).sepia(0.8) + + // 色相旋转 + Text('hueRotate').fontSize(15).fontColor(0xCCCCCC).width('90%') + Image($r('app.media.image')).width('90%').height(30).hueRotate(90) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template10/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template10/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..52c5efdbc93eadbd7c16b14ba15c41ba626497c2 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template10/Index.ets @@ -0,0 +1,31 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ImageEffectsExample10 { + build() { + Column() { + Stack() { + Image($r('app.media.testImage')).width('100%').height('100%') + Column() + .width(150) + .height(10) + .systemBarEffect() + .border({ radius: 5 }) + .margin({ bottom: 80 }) + }.alignContent(Alignment.Center) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a12fde422d88cf2c06a6beecd9d8e56e9953725d --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template2/Index.ets @@ -0,0 +1,32 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ImageExample1 { + private_resource1: Resource = $r('app.media.testlinearGradientBlurOrigin'); + @State image_src: Resource = this.private_resource1; + + build() { + Column() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Start }) { + Row({ space: 5 }) { + Image(this.image_src) + .linearGradientBlur(60, + { fractionStops: [[0, 0], [0, 0.33], [1, 0.66], [1, 1]], direction: GradientDirection.Bottom }) + } + } + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template3/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..1f0a70c403a3f6955bc3df7b0e98b9383b31133b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template3/Index.ets @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Component +struct Component1 { + @Prop renderGroupValue: boolean; + + build() { + Row() { + Row() { + Row() + .backgroundColor(Color.Black) + .width(100) + .height(100) + .opacity(1) + } + .backgroundColor(Color.White) + .width(150) + .height(150) + .justifyContent(FlexAlign.Center) + .opacity(0.6) + .renderGroup(this.renderGroupValue) + } + .backgroundColor(Color.Black) + .width(200) + .height(200) + .justifyContent(FlexAlign.Center) + .opacity(1) + } +} + +@Entry +@Component +struct RenderGroupExample { + build() { + Column() { + Component1({ renderGroupValue: true }) + .margin(20) + Component1({ renderGroupValue: false }) + .margin(20) + } + .width('100%') + .height('100%') + .alignItems(HorizontalAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template4/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template4/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..3177a411a76b47d386478aef32659084b637593f --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template4/Index.ets @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ImageEffectsExample4 { + build() { + Column() { + Text("blendMode") + .fontSize(20) + .fontWeight(FontWeight.Bold) + .fontColor('#ffff0101') + Row() { + Circle() + .width(200) + .height(200) + .fill(Color.Green) + .position({ x: 50, y: 50 }) + Circle() + .width(200) + .height(200) + .fill(Color.Blue) + .position({ x: 150, y: 50 }) + } + .blendMode(BlendMode.OVERLAY, BlendApplyType.OFFSCREEN) + .alignItems(VerticalAlign.Center) + .height(300) + .width('100%') + } + .height('100%') + .width('100%') + .backgroundImage($r('app.media.image')) + .backgroundImageSize(ImageSize.Cover) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template5/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template5/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..7a67847230b97529c878eca559526208d5d4ebcf --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template5/Index.ets @@ -0,0 +1,42 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ImageEffect5 { + build() { + Stack() { + Column() + Stack() { + Image($r('app.media.r')).width('100%') + Column() { + Column().width('100%').height(30).invert({ + low: 0, + high: 1, + threshold: 0.5, + thresholdRange: 0.2 + }) + Column().width('100%').height(30).invert({ + low: 0.2, + high: 0.5, + threshold: 0.3, + thresholdRange: 0.2 + }) + } + } + .width('100%') + .height('100%') + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template6/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template6/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..a1e2936d707d1b91b769a678f47a4be60f211cfc --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template6/Index.ets @@ -0,0 +1,100 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct UseShadowBatchingExample { + build() { + Column() { + Column({ space: 10 }) { + Stack() { + + } + .width('90%') + .height(50) + .margin({ top: 5 }) + .backgroundColor(0xFFE4C4) + .shadow({ + radius: 120, + color: Color.Green, + offsetX: 0, + offsetY: 0 + }) + .align(Alignment.TopStart) + .shadow({ + radius: 120, + color: Color.Green, + offsetX: 0, + offsetY: 0 + }) + + Stack() { + + } + .width('90%') + .height(50) + .margin({ top: 5 }) + .backgroundColor(0xFFE4C4) + .align(Alignment.TopStart) + .shadow({ + radius: 120, + color: Color.Red, + offsetX: 0, + offsetY: 0 + }) + .width('90%') + .backgroundColor(Color.White) + + Column() { + Text() + .fontWeight(FontWeight.Bold) + .fontSize(20) + .fontColor(Color.White) + } + .justifyContent(FlexAlign.Center) + .width(150) + .height(150) + .borderRadius(10) + .backgroundColor(0xf56c6c) + .shadow({ + radius: 300, + color: Color.Yellow, + offsetX: 0, + offsetY: 0 + }) + + Column() { + Text() + .fontWeight(FontWeight.Bold) + .fontSize(20) + .fontColor(Color.White) + } + .justifyContent(FlexAlign.Center) + .width(150) + .height(150) + .backgroundColor(0x67C23A) + .borderRadius(10) + .translate({ y: -50 }) + .shadow({ + radius: 220, + color: Color.Blue, + offsetX: 0, + offsetY: 0 + }) + } + .useShadowBatching(true) + } + .width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template7/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template7/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..0ee5f04bd6852ea779c631edfa02e9f0fadfc762 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template7/Index.ets @@ -0,0 +1,35 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SphericalEffectExample { + build() { + Stack() { + TextInput({ placeholder: $r('app.string.placeholder') }) + .width('50%') + .height(35) + .type(InputType.Number) + .enterKeyType(EnterKeyType.Done) + .caretColor(Color.Red) + .placeholderColor(Color.Blue) + .placeholderFont({ + size: 20, + style: FontStyle.Italic, + weight: FontWeight.Bold + }) + .sphericalEffect(0.5) + }.alignContent(Alignment.Center).width('100%').height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template8/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template8/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..e39d9f697d4bf6bc33b649f91f1a58cc7c7e8b54 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template8/Index.ets @@ -0,0 +1,29 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct LightUpExample { + build() { + Stack() { + Text('This is the text content with letterSpacing 0.') + .letterSpacing(0) + .fontSize(12) + .border({ width: 1 }) + .padding(10) + .width('50%') + .lightUpEffect(0.6) + }.alignContent(Alignment.Center).width('100%').height('100%') + } +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template9/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template9/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..be953e632a2d32a8cea28cd16a2ab1153cbec3e4 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/imageEffect/template9/Index.ets @@ -0,0 +1,35 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct PixelStretchExample { + build() { + Stack() { + Text('This is the text content with letterSpacing 0.') + .letterSpacing(0) + .fontSize(12) + .border({ width: 1 }) + .padding(10) + .clip(false) + .width('50%') + .pixelStretchEffect({ + top: 10, + left: 10, + right: 10, + bottom: 10 + }) + }.alignContent(Alignment.Center).width('100%').height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..5fe2f7e82b1489d0a8cd6c6fec0d50b0a91d2d20 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template1/Index.ets @@ -0,0 +1,41 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ColorGradientExample { + build() { + Column({ space: 5 }) { + Text('linearGradient').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width('90%') + .height(50) + .linearGradient({ + angle: 90, + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 1.0]] + }) + Text('linearGradient Repeat').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width('90%') + .height(50) + .linearGradient({ + direction: GradientDirection.Left, // 渐变方向 + repeating: true, // 渐变颜色是否重复 + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 0.5]] // 数组末尾元素占比小于1时满足重复着色效果 + }) + } + .width('100%') + .padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..7c16b0e03fdf6c863eab0d4bc45099dc4d36d006 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template2/Index.ets @@ -0,0 +1,47 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ColorGradientExample2 { + build() { + Column({ space: 5 }) { + Text('sweepGradient').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width(100) + .height(100) + .sweepGradient({ + center: [50, 50], + start: 0, + end: 359, + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 1.0]] + }) + + Text('sweepGradient Repeat').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width(100) + .height(100) + .sweepGradient({ + center: [50, 50], + start: 0, + end: 359, + rotation: 45, // 旋转角度 + repeating: true, // 渐变颜色是否重复 + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 0.5]] // 数组末尾元素占比小于1时满足重复着色效果 + }) + } + .width('100%') + .padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template3/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..dbe57acfdd30a6f79e915e4ad141c9d9e5d8ca68 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/linearGradient/template3/Index.ets @@ -0,0 +1,43 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct ColorGradientExample3 { + build() { + Column({ space: 5 }) { + Text('radialGradient').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width(100) + .height(100) + .radialGradient({ + center: [50, 50], + radius: 60, + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 1.0]] + }) + Text('radialGradient Repeat').fontSize(12).width('90%').fontColor(0xCCCCCC) + Row() + .width(100) + .height(100) + .radialGradient({ + center: [50, 50], + radius: 60, + repeating: true, + colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 0.5]] // 数组末尾元素占比小于1时满足重复着色效果 + }) + } + .width('100%') + .padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/motionBlur/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/motionBlur/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ddf7faebcf5fe0a948d2918d6bef476c4cc35866 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/motionBlur/template1/Index.ets @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { curves } from '@kit.ArkUI'; + +@Entry +@Component +struct motionBlurTest { + @State widthSize: number = 400; + @State heightSize: number = 320; + @State flag: boolean = true; + @State radius: number = 0; + @State x: number = 0; + @State y: number = 0; + + build() { + Column() { + Column() { + Image($r('app.media.testImg')) + .width(this.widthSize) + .height(this.heightSize) + .onClick(() => { + this.radius = 5; + this.x = 0.5; + this.y = 0.5; + if (this.flag) { + this.widthSize = 100; + this.heightSize = 80; + } else { + this.widthSize = 400; + this.heightSize = 320; + } + this.flag = !this.flag; + }) + .animation({ + duration: 2000, + curve: curves.springCurve(10, 1, 228, 30), + onFinish: () => { + this.radius = 0; + } + }) + .motionBlur({ radius: this.radius, anchor: { x: this.x, y: this.y } }) + } + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/opacity/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/opacity/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..08ae8f6efa8f497135b7c08377f76c8bee309631 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/opacity/template1/Index.ets @@ -0,0 +1,34 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct OpacityExample { + build() { + Column({ space: 5 }) { + Text('opacity(1)').fontSize(9).width('90%').fontColor(0xCCCCCC) + Text().width('90%').height(50).opacity(1).backgroundColor(0xAFEEEE) + Text('opacity(0.7)').fontSize(9).width('90%').fontColor(0xCCCCCC) + Text().width('90%').height(50).opacity(0.7).backgroundColor(0xAFEEEE) + Text('opacity(0.4)').fontSize(9).width('90%').fontColor(0xCCCCCC) + Text().width('90%').height(50).opacity(0.4).backgroundColor(0xAFEEEE) + Text('opacity(0.1)').fontSize(9).width('90%').fontColor(0xCCCCCC) + Text().width('90%').height(50).opacity(0.1).backgroundColor(0xAFEEEE) + Text('opacity(0)').fontSize(9).width('90%').fontColor(0xCCCCCC) + Text().width('90%').height(50).opacity(0).backgroundColor(0xAFEEEE) + } + .width('100%') + .padding({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..baf0d3fa2fa36fbd3cb504a9767de7fb528c9d5b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template1/Index.ets @@ -0,0 +1,51 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct OutlineExample { + build() { + Column() { + Flex({ justifyContent: FlexAlign.SpaceAround, alignItems: ItemAlign.Center }) { + // 线段 + Text('DASHED') + .backgroundColor(Color.Pink) + .outlineStyle(OutlineStyle.DASHED).outlineWidth(5).outlineColor(0xAFEEEE).outlineRadius(10) + .width(120).height(120).textAlign(TextAlign.Center).fontSize(16) + // 点线 + Text('DOTTED') + .backgroundColor(Color.Pink) + .outline({ width: 5, color: 0x317AF7, radius: 10, style: OutlineStyle.DOTTED }) + .width(120).height(120).textAlign(TextAlign.Center).fontSize(16) + }.width('100%').height(150) + + Text('.outline') + .backgroundColor(Color.Pink) + .fontSize(50) + .width(300) + .height(300) + .outline({ + width: { left: 3, right: 6, top: 10, bottom: 15 }, + color: { left: '#e3bbbb', right: Color.Blue, top: Color.Red, bottom: Color.Green }, + radius: { topLeft: 10, topRight: 20, bottomLeft: 40, bottomRight: 80 }, + style: { + left: OutlineStyle.DOTTED, + right: OutlineStyle.DOTTED, + top: OutlineStyle.SOLID, + bottom: OutlineStyle.DASHED + } + }).textAlign(TextAlign.Center) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..d66ffe5be2e8926b17495a36b8450faf6845bebd --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/outline/template2/Index.ets @@ -0,0 +1,52 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +@Entry +@Component +struct OutlineExample2 { + build() { + Column() { + Flex({ justifyContent: FlexAlign.SpaceAround, alignItems: ItemAlign.Center }) { + // 线段 + Text('DASHED') + .backgroundColor(Color.Pink) + .outlineStyle(OutlineStyle.DASHED).outlineWidth(5).outlineColor(0xAFEEEE).outlineRadius(10) + .width(120).height(120).textAlign(TextAlign.Center).fontSize(16) + // 点线 + Text('DOTTED') + .backgroundColor(Color.Pink) + .outline({ width: 5, color: 0x317AF7, radius: 10, style: OutlineStyle.DOTTED }) + .width(120).height(120).textAlign(TextAlign.Center).fontSize(16) + }.width('100%').height(150) + + Text('.outline') + .backgroundColor(Color.Pink) + .fontSize(50) + .width(300) + .height(300) + .outline({ + width: { left: 3, right: 6, top: 10, bottom: 15 }, + color: { start: '#e3bbbb', end: Color.Blue, top: Color.Red, bottom: Color.Green }, + radius: { topLeft: 10, topRight: 20, bottomLeft: 40, bottomRight: 80 }, + style: { + left: OutlineStyle.DOTTED, + right: OutlineStyle.DOTTED, + top: OutlineStyle.SOLID, + bottom: OutlineStyle.DASHED + } + }).textAlign(TextAlign.Center) + } + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/renderFit/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/renderFit/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..462ea9c2154a546a6de1aa40dc194223c426ea2e --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/renderFit/template1/Index.ets @@ -0,0 +1,55 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct RenderFitExample { + @State width1: number = 100; + @State height1: number = 30; + flag: boolean = true; + + build() { + Column() { + Text("Hello") + .width(this.width1) + .height(this.height1) + .borderWidth(1) + .textAlign(TextAlign.Start) + .renderFit(RenderFit.LEFT)// 设置LEFT的renderFit，动画过程中，动画的终态内容与组件保持左对齐 + .margin(20) + + Text("Hello") + .width(this.width1) + .height(this.height1) + .textAlign(TextAlign.Center) + .borderWidth(1) + .renderFit(RenderFit.CENTER)// 设置CENTER的renderFit，动画过程中，动画的终态内容与组件保持中心对齐 + .margin(20) + + Button("animate") + .onClick(() => { + this.getUIContext()?.animateTo({ curve: Curve.Ease }, () => { + if (this.flag) { + this.width1 = 150; + this.height1 = 50; + } else { + this.width1 = 100; + this.height1 = 30; + } + this.flag = !this.flag; + }) + }) + }.width('100%').height('100%').alignItems(HorizontalAlign.Center) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..ce0425413b306dcb3f223d4a21af27bdb5a25a34 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template1/Index.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { matrix4 } from '@kit.ArkUI'; + +@Entry +@Component +struct TransformExample { + build() { + Column() { + Text('rotate').width('90%').fontColor(0xCCCCCC).padding(15).fontSize(14) + Row() + .rotate({ + x: 0, + y: 0, + z: 1, + centerX: '50%', + centerY: '50%', + angle: 300 + })// 组件以矢量(0,0,1)为旋转轴，绕中心点顺时针旋转300度 + .width(100).height(100).backgroundColor(0xAFEEEE) + + Text('translate').width('90%').fontColor(0xCCCCCC).padding(10).fontSize(14) + Row() + .translate({ x: 100, y: 10 })// x轴方向平移100，y轴方向平移10 + .width(100) + .height(100) + .backgroundColor(0xAFEEEE) + .margin({ bottom: 10 }) + + Text('scale').width('90%').fontColor(0xCCCCCC).padding(15).fontSize(14) + Row() + .scale({ x: 2, y: 0.5 })// 高度缩小一倍，宽度放大一倍，z轴在2D下无效果 + .width(100).height(100).backgroundColor(0xAFEEEE) + + Text('Matrix4').width('90%').fontColor(0xCCCCCC).padding(15).fontSize(14) + Row() + .width(100).height(100).backgroundColor(0xAFEEEE) + .transform(matrix4.identity().translate({ x: 50, y: 50 }).scale({ x: 1.5, y: 1 }).rotate({ + x: 0, + y: 0, + z: 1, + angle: 60 + })) + }.width('100%').margin({ top: 5 }) + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template2/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template2/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..4c95c3279180516809bae9f60848140b128770cd --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template2/Index.ets @@ -0,0 +1,48 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct TransFormExample2 { + @State prep: number = 10; + + build() { + Row() { + Column() { + Stack() + .width(100) + .height(100) + .backgroundColor(Color.Red) + .rotate({ y: 1, angle: 45, perspective: this.prep }) + Button('change prep') + .margin({ top: 100 }) + .onClick(() => { + this.getUIContext()?.animateTo({ + duration: 2000, + curve: Curve.EaseIn, + iterations: 1, + playMode: PlayMode.Normal, + onFinish: () => { + console.info('play end'); + } + }, () => { + this.prep = 500 // 组件视距从10变换到500 + }) + }) + } + .width('100%') + } + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template3/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template3/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..fd3ebbfa6ff98dbd8442001282171e42b60b3c59 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/transform/template3/Index.ets @@ -0,0 +1,75 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { matrix4 } from '@kit.ArkUI'; + +@Entry +@Component +struct MatrixExample { + build() { + Column({ space: 100 }) { + Text('Hello1') + .textAlign(TextAlign.Center) + .width(100) + .height(60) + .borderWidth(1) + + Text('Hello2') + .textAlign(TextAlign.Center) + .width(100) + .height(60) + .borderWidth(1) + .rotate({ + // 绕(100vp,60vp)的锚点旋转90度，rotate或scale的centerX、centerY为组件锚点 + z: 1, + angle: 90, + centerX: 100, + centerY: 60 + }) + + Text('Hello3') + .textAlign(TextAlign.Center) + .width(100) + .height(60) + .borderWidth(1) + .transform(matrix4.identity() + .rotate({ + // 组件锚点(centerX,centerY)默认为(50%,50%)，即锚点在(50vp,30vp) + // transform的rotate指定(centerX,centerY)为(50vp,30vp)，相对于在组件本身锚点基础上再额外偏移(50vp,30vp) + // 此次变换相当于绕(100vp,60vp)旋转，和"Hello2"实现同样的旋转效果 + z: 1, + angle: 90, + centerX: this.getUIContext().vp2px(50), + centerY: this.getUIContext().vp2px(30) + })) + + Text('Hello4') + .textAlign(TextAlign.Center) + .width(100) + .height(60) + .borderWidth(1) + .scale({ + // 当设置x或y时，centerX和centerY才能生效 + // 设置组件锚点为(100vp,60vp) + x: 1, + y: 1, + centerX: 100, + centerY: 60 + })// transform的rotate不指定centerX、centerY，此次旋转的中心相对于组件本身锚点没有额外偏移 + // 该组件通过scale设置的锚点，绕(100vp,60vp)进行旋转，和"Hello2"实现同样的旋转效果 + .transform(matrix4.identity().rotate({ z: 1, angle: 90 })) + }.width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/useEffect/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/useEffect/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..89b75f28bc2c860e257783b50ddd253c7efd021a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/useEffect/template1/Index.ets @@ -0,0 +1,71 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct UseEffectExample { + @State isUse: boolean = true; + + build() { + Stack() { + Image($r("app.media.mountain")) + .autoResize(true) + EffectComponent() { + Column({ space: 20 }) { + Column() { + } + .position({ x: 0, y: 0 }) + .width(150) + .height(800) + .useEffect(this.isUse, EffectType.WINDOW_EFFECT) + + Column() { + } + .position({ x: 200, y: 20 }) + .width(150) + .height(300) + .useEffect(this.isUse, EffectType.DEFAULT) + + Column() { + } + .position({ x: 400, y: 20 }) + .width(150) + .height(300) + .useEffect(this.isUse) + } + .width('100%') + .height('100%') + } + .backgroundBlurStyle(BlurStyle.Thin) + + Column() { + } + .position({ x: 600, y: 0 }) + .width(150) + .height(800) + .useEffect(this.isUse, EffectType.WINDOW_EFFECT) + + Row() { + Button('useEffect') + .margin(30) + .onClick(() => { + this.isUse = !this.isUse; + }) + } + .position({ x: 300, y: 450 }) + } + .backgroundColor(Color.Black) + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/visualEffect/template1/Index.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/visualEffect/template1/Index.ets new file mode 100644 index 0000000000000000000000000000000000000000..50e5ab0251c8a331da9f25e46c5fedd42a0edce6 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/ets/pages/visualEffect/template1/Index.ets @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { uiEffect } from '@kit.ArkGraphics2D'; + +@Entry +@Component +struct FilterEffectExample { + @State filterTest1: uiEffect.Filter = uiEffect.createFilter().blur(10); + @State filterTest2: uiEffect.Filter = uiEffect.createFilter().blur(10); + @State filterTest3: uiEffect.Filter = uiEffect.createFilter().blur(10); + + build() { + Column({ space: 15 }) { + + Text('foregroundFilter').fontSize(20).width('75%').fontColor('#DCDCDC') + Text('前景滤镜') + .width(100) + .height(100) + .backgroundColor('#ADD8E6') + .backgroundImage($r("app.media.app_icon")) + .backgroundImageSize({ width: 80, height: 80 }) + .foregroundFilter(this.filterTest1) // 通过 foregroundFilter 设置模糊效果 + + Text('backgroundFilter').fontSize(20).width('75%').fontColor('#DCDCDC') + Text('背景滤镜') + .width(100) + .height(100) + .backgroundColor('#ADD8E6') + .backgroundImage($r("app.media.app_icon")) + .backgroundImageSize({ width: 80, height: 80 }) + .backgroundFilter(this.filterTest2) // 通过 backgroundFilter 设置模糊效果 + + Text('compositingFilter').fontSize(20).width('75%').fontColor('#DCDCDC') + Text('合成滤镜') + .width(100) + .height(100) + .backgroundColor('#ADD8E6') + .backgroundImage($r("app.media.app_icon")) + .backgroundImageSize({ width: 80, height: 80 }) + .compositingFilter(this.filterTest3) // 通过 compositingFilter 设置模糊效果 + } + .height('100%') + .width('100%') + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/module.json5 b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..196e6b3978857f196aa334edffc3c5b431c6bc83 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/module.json5 @@ -0,0 +1,65 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry", + "type": "entry", + "description": "$string:module_desc", + "mainElement": "EntryAbility", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false, + "pages": "$profile:main_pages", + "abilities": [ + { + "name": "EntryAbility", + "srcEntry": "./ets/entryability/EntryAbility.ets", + "description": "$string:EntryAbility_desc", + "icon": "$media:layered_image", + "label": "$string:EntryAbility_label", + "startWindowIcon": "$media:startIcon", + "orientation": "auto_rotation", + "startWindowBackground": "$color:start_window_background", + "exported": true, + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "ohos.want.action.home" + ] + } + ] + } + ], + "extensionAbilities": [ + { + "name": "EntryBackupAbility", + "srcEntry": "./ets/entrybackupability/EntryBackupAbility.ets", + "type": "backup", + "exported": false, + "metadata": [ + { + "name": "ohos.extension.backup", + "resource": "$profile:backup_config" + } + ], + } + ] + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/color.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..3c712962da3c2751c2b9ddb53559afcbd2b54a02 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#FFFFFF" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/float.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/float.json new file mode 100644 index 0000000000000000000000000000000000000000..153478e3f449f86a897686bc35316bd4fc96fb99 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/float.json @@ -0,0 +1,17 @@ +{ + "float": [ + { + "name": "page_text_font_size", + "value": "50fp" + }, { + "name": "size_16", + "value": "16" + }, { + "name": "size_100", + "value": "100" + }, { + "name": "size_64", + "value": "64" + } + ] +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/string.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..47f4e9fdb22b0b93b85595f69e294438c6d8952b --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/element/string.json @@ -0,0 +1,256 @@ +{ + "string": [ + { + "name": "module_desc", + "value": "module description" + }, + { + "name": "EntryAbility_desc", + "value": "description" + }, + { + "name": "EntryAbility_label", + "value": "VisionEffect" + }, + { + "name": "navigation_toolbar_add", + "value": "add" + }, + { + "name": "navigation_toolbar_app", + "value": "app" + }, + { + "name": "navigation_toolbar_collect", + "value": "collect" + }, + { + "name": "please_click_button", + "value": "请点击按钮" + }, + { + "name": "transform", + "value": "图形变换" + }, + { + "name": "example_one_transform", + "value": "示例1（为组件添加图形变换效果）" + }, + { + "name": "example_two_transform", + "value": "示例2（设置旋转视距）" + }, + { + "name": "example_three_transform", + "value": "示例3（按中心点旋转）" + }, + { + "name": "opacity", + "value": "透明度设置" + }, + { + "name": "example_one_opacity", + "value": "示例1" + }, + { + "name": "example_one_clip", + "value": "示例1（使用不同裁剪属性）" + }, + { + "name": "example_two_clip", + "value": "示例2（裁剪属性动画）" + }, + { + "name": "clip", + "value": "形状裁剪" + }, + { + "name": "imageEffect", + "value": "图像效果" + }, + { + "name": "background", + "value": "背景设置" + }, + { + "name": "foregroundBlurStyle", + "value": "组件内容模糊" + }, + { + "name": "foregroundColor", + "value": "前景色设置" + }, + { + "name": "clickEffect", + "value": "点击回弹效果" + }, + { + "name": "useEffect", + "value": "特效绘制合并" + }, + { + "name": "renderFit", + "value": "组件内容填充方式" + }, + { + "name": "outline", + "value": "外描边设置" + }, + { + "name": "motionBlur", + "value": "运动模糊" + }, + { + "name": "linearGradient", + "value": "颜色渐变" + }, + { + "name": "foregroundEffect", + "value": "前景属性设置" + }, + { + "name": "visualEffect", + "value": "视效设置" + }, + { + "name": "example_one_imageEffect", + "value": "示例1（设置图片不同属性效果）'" + }, + { + "name": "example_two_imageEffect", + "value": "示例2（设置组件线性渐变模糊效果）" + }, + { + "name": "example_three_imageEffect", + "value": "示例3（设置离屏渲染效果）" + }, + { + "name": "example_four_imageEffect", + "value": "示例4（当前组件内容与下方画布内容混合）" + }, + { + "name": "example_five_imageEffect", + "value": "示例5（前景智能取反色）" + }, + { + "name": "example_six_imageEffect", + "value": "示例6（设置同层阴影不重叠效果）" + }, + { + "name": "example_seven_imageEffect", + "value": "示例7（设置组件图像球面效果）" + }, + { + "name": "example_eight_imageEffect", + "value": "示例8（设置组件图像渐亮效果）" + }, + { + "name": "example_nine_imageEffect", + "value": "示例9（设置组件图像边缘像素扩展效果）" + }, + { + "name": "example_ten_imageEffect", + "value": "示例10（系统导航条智能反色）" + }, + { + "name": "example_one_background", + "value": "示例1（设置背景基础样式）'" + }, + { + "name": "example_two_background", + "value": "示例2（设置背景模糊样式）" + }, + { + "name": "example_three_background", + "value": "示例3（设置组件背景）" + }, + { + "name": "example_four_background", + "value": "示例4（设置组件背景提亮效果）" + }, + { + "name": "example_five_background", + "value": "示例5（设置模糊属性）" + }, + { + "name": "example_six_background", + "value": "示例6（设置文字异形模糊效果）" + }, + { + "name": "example_seven_background", + "value": "示例7（模糊效果对比）" + }, + { + "name": "example_one_foregroundBlurStyle", + "value": "示例1" + }, + { + "name": "example_one_foregroundColor", + "value": "示例1（使用前景色设置）'" + }, + { + "name": "example_two_foregroundColor", + "value": "示例2（设置前景色为组件背景色反色）" + }, + { + "name": "example_three_foregroundColor", + "value": "示例3（前置景色未继承父组件）" + }, + { + "name": "example_one_clickEffect", + "value": "示例1'" + }, + { + "name": "example_one_useEffect", + "value": "示例1'" + }, + { + "name": "example_one_renderFit", + "value": "示例1'" + }, + { + "name": "example_one_outline", + "value": "示例1（使用外描边属性）'" + }, + { + "name": "example_two_outline", + "value": "示例2（使用LocalizedEdgeColors类型）" + }, + { + "name": "example_one_motionBlur", + "value": "示例1'" + }, + { + "name": "example_one_linearGradient", + "value": "示例1（颜色从右向左线性渐变）" + }, + { + "name": "example_two_linearGradient", + "value": "示例2（颜色按旋转角度渐变）'" + }, + { + "name": "example_three_linearGradient", + "value": "示例3（颜色按径向渐变）" + }, + { + "name": "example_one_foregroundEffect", + "value": "示例1'" + }, + { + "name": "example_one_visualEffect", + "value": "示例1'" + }, + { + "name": "October_16th", + "value": "10月16日'" + }, + { + "name": "Monday", + "value": "星期一'" + }, + { + "name": "placeholder", + "value": "请输入变化范围百分比（[0%,100%]）'" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/app_icon.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/app_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/app_icon.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/background.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/background.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/background.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/bg.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/bg.JPG new file mode 100644 index 0000000000000000000000000000000000000000..77d1db9c5ae70097ed69f7c9d2fcae8a751e8fff Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/bg.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/book.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/book.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/book.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/drawer.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/drawer.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/drawer.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/foreground.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/foreground.png new file mode 100644 index 0000000000000000000000000000000000000000..97014d3e10e5ff511409c378cd4255713aecd85f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/foreground.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/forest.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/forest.png new file mode 100644 index 0000000000000000000000000000000000000000..25165d3dac9606d9078b49a9853c66c9cb77320a Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/forest.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/heart.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/heart.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_health_heart.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_health_heart.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c0843441f0fa499317d594a0f81a0f169ac4cad9 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_health_heart.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlights.svg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlights.svg new file mode 100644 index 0000000000000000000000000000000000000000..7f0c77423290d138e1c06b9de163af52d0ba0195 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlights.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collect + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlightsed.svg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlightsed.svg new file mode 100644 index 0000000000000000000000000000000000000000..bda82973349ceba0d7de8e9f85d704844cb31318 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/ic_public_highlightsed.svg @@ -0,0 +1,13 @@ + + + Public/ic_public_collected + + + + + + + + + + \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon_2.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon_2.png new file mode 100644 index 0000000000000000000000000000000000000000..923f2b3f27e915d6871871deea0420eb45ce102f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/icon_2.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image.JPG new file mode 100644 index 0000000000000000000000000000000000000000..29bd746fee2f280b5a97640c3c91125bb0934ca1 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image_1.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image_1.png new file mode 100644 index 0000000000000000000000000000000000000000..8b474587838c8cc696fc7747dfe9b1c70f80dc2d Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/image_1.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/img_1.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/img_1.JPG new file mode 100644 index 0000000000000000000000000000000000000000..461eda6a6847cb09d9d6569a4258009d414610e8 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/img_1.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/layered_image.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/layered_image.json new file mode 100644 index 0000000000000000000000000000000000000000..fb49920440fb4d246c82f9ada275e26123a2136a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/layered_image.json @@ -0,0 +1,7 @@ +{ + "layered-image": + { + "background" : "$media:background", + "foreground" : "$media:foreground" + } +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/mountain.jpg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/mountain.jpg new file mode 100644 index 0000000000000000000000000000000000000000..3c244ab4218031e18dd0069e240e558622924668 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/mountain.jpg differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/r.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/r.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cd3fef02a58cabe165cb12fde35cb4c249afa5a4 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/r.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sky.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sky.JPG new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sky.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/startIcon.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..205ad8b5a8a42e8762fbe4899b8e5e31ce822b8b Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/startIcon.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sun.jpg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sun.jpg new file mode 100644 index 0000000000000000000000000000000000000000..c2ad0955113af2e2ad0228837c86427b3022bd86 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/sun.jpg differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/test.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/test.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/test.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImage.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImage.JPG new file mode 100644 index 0000000000000000000000000000000000000000..cc6a0782c6ff9609f0f790c6562b7ab9c549830e Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImage.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImg.jpg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImg.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testImg.jpg differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG new file mode 100644 index 0000000000000000000000000000000000000000..e2e542fcde54adf541a680c384bf8477b41548eb Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/testlinearGradientBlurOrigin.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image1.jpg b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9fb37bd1079db72818f5e375973c80fb670c7a70 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image1.jpg differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image2.png b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image2.png new file mode 100644 index 0000000000000000000000000000000000000000..af8d4c98a86f23a41841d07b74636926a17d1c89 Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/transition_image2.png differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/tree.JPG b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/tree.JPG new file mode 100644 index 0000000000000000000000000000000000000000..bdad6db5558c4190bccb951489e8bc67fc0ababe Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/media/tree.JPG differ diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/backup_config.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/backup_config.json new file mode 100644 index 0000000000000000000000000000000000000000..78f40ae7c494d71e2482278f359ec790ca73471a --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/backup_config.json @@ -0,0 +1,3 @@ +{ + "allowToBackupRestore": true +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/main_pages.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/main_pages.json new file mode 100644 index 0000000000000000000000000000000000000000..848733fbd37aa508501d724aaec6f794e418ffd5 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/base/profile/main_pages.json @@ -0,0 +1,43 @@ +{ + "src": [ + "pages/Index", + "pages/transform/template1/Index", + "pages/transform/template2/Index", + "pages/transform/template3/Index", + "pages/opacity/template1/Index", + "pages/clip/template1/Index", + "pages/clip/template2/Index", + "pages/imageEffect/template1/Index", + "pages/imageEffect/template2/Index", + "pages/imageEffect/template3/Index", + "pages/imageEffect/template4/Index", + "pages/imageEffect/template5/Index", + "pages/imageEffect/template6/Index", + "pages/imageEffect/template7/Index", + "pages/imageEffect/template8/Index", + "pages/imageEffect/template9/Index", + "pages/imageEffect/template10/Index", + "pages/background/template1/Index", + "pages/background/template2/Index", + "pages/background/template3/Index", + "pages/background/template4/Index", + "pages/background/template5/Index", + "pages/background/template6/Index", + "pages/background/template7/Index", + "pages/foregroundBlurStyle/template1/Index", + "pages/foregroundColor/template1/Index", + "pages/foregroundColor/template2/Index", + "pages/foregroundColor/template3/Index", + "pages/clickEffect/template1/Index", + "pages/useEffect/template1/Index", + "pages/renderFit/template1/Index", + "pages/outline/template1/Index", + "pages/outline/template2/Index", + "pages/motionBlur/template1/Index", + "pages/linearGradient/template1/Index", + "pages/linearGradient/template2/Index", + "pages/linearGradient/template3/Index", + "pages/foregroundEffect/template1/Index", + "pages/visualEffect/template1/Index" + ] +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/dark/element/color.json b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/dark/element/color.json new file mode 100644 index 0000000000000000000000000000000000000000..79b11c2747aec33e710fd3a7b2b3c94dd9965499 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/main/resources/dark/element/color.json @@ -0,0 +1,8 @@ +{ + "color": [ + { + "name": "start_window_background", + "value": "#000000" + } + ] +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/mock/mock-config.json5 b/code/DocsSample/ArkUISample/VisionEffect/entry/src/mock/mock-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..323d1d611fecf4ecb751976e3a71500b3712a445 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/mock/mock-config.json5 @@ -0,0 +1,16 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Ability.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Ability.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..7f7cdedbde009a69923d11e79b251d52ee3eaa92 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Ability.test.ets @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { hilog } from '@kit.PerformanceAnalysisKit'; +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function abilityTest() { + describe('ActsAbilityTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }) + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }) + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }) + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }) + /* + * @tc.number: VisionEffect_assertContain + * @tc.name: Test ability + * @tc.desc: Test ability + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + hilog.info(0x0000, 'testTag', '%{public}s', 'it begin'); + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + hilog.info(0x0000, 'testTag', '%{public}s', 'it end'); + }) + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Background.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Background.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..b94e5e1c60390087c2e5f8746643f9c63a12df7c --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Background.test.ets @@ -0,0 +1,165 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function BackgroundTest() { + describe('VisionEffect_BackgroundTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.background')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_001 + * @tc.name: example_one_background + * @tc.desc: example_one_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_002 + * @tc.name: example_two_background + * @tc.desc: example_two_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_002_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_003 + * @tc.name: example_three_background + * @tc.desc: example_three_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_three_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_003_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_004 + * @tc.name: example_four_background + * @tc.desc: example_four_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_four_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_004_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_005 + * @tc.name: example_five_background + * @tc.desc: example_five_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_five_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_005_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_006 + * @tc.name: example_six_background + * @tc.desc: example_six_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_six_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_006_end'); + }) + + /* + * @tc.number: VisionEffect_BackgroundTest_007 + * @tc.name: example_seven_background + * @tc.desc: example_seven_background + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'BackgroundTest_007', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_007_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_seven_background')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_007_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ClickEffect.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ClickEffect.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..b2b43c5bc710e5628e028583cf31d9297f119a77 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ClickEffect.test.ets @@ -0,0 +1,90 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() + +const driver = Driver.create(); +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ClickEffectTest() { + describe('VisionEffect_ClickEffectTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.clickEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ClickEffectTest_001 + * @tc.name: example_one_clickEffect + * @tc.desc: example_one_clickEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ClickEffectTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ClickEffectTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_clickEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + + let Toggles = await driver.findComponents(ON.type('Toggle')); + await Toggles[0].click(); + await driver.delayMs(1000); + + await Toggles[1].click(); + await driver.delayMs(1000); + + await Toggles[2].click(); + await driver.delayMs(1000); + + await Toggles[3].click(); + await driver.delayMs(1000); + + let aimComponents = await driver.findComponents(ON.text('status button')); + await aimComponents[0].click(); + await driver.delayMs(1000); + + await aimComponents[1].click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ClickEffectTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Clip.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Clip.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..544677206c2d1ca3091a2d47952dc9134dd121f7 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Clip.test.ets @@ -0,0 +1,106 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ClipTest() { + describe('VisionEffect_ClipTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.clip')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ClipTest_001 + * @tc.name: example_one_clip + * @tc.desc: example_one_clip + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ClipTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ClipTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_clip')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ClipTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_ClipTest_002 + * @tc.name: example_two_clip + * @tc.desc: example_two_clip + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ClipTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ClipTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_clip')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('updateProgress')); + for (let index = 0; index < 10; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + + aimComponent = await driver.findComponent(ON.text('click reset!')); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('updateColor')); + await aimComponent.click(); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text('updateProgress')); + for (let index = 0; index < 10; index++) { + await aimComponent.click(); + await driver.delayMs(100); + } + hilog.info(DOMAIN, TAG, 'VisionEffect_ClipTest_002_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundBlurStyle.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundBlurStyle.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..150f45e25607f683e9c530d25e5d1f561409e4a1 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundBlurStyle.test.ets @@ -0,0 +1,70 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ForegroundBlurStyleTest() { + describe('VisionEffect_ForegroundBlurStyleTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.foregroundBlurStyle')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ForegroundBlurStyleTest_001 + * @tc.name: example_one_foregroundBlurStyle + * @tc.desc: example_one_foregroundBlurStyle + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ForegroundBlurStyleTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundBlurStyleTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_foregroundBlurStyle')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundBlurStyleTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundColor.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundColor.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..6bf224c4bd6b64b1bf73ac5d7055fd6335f23f42 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundColor.test.ets @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ForegroundColorTest() { + describe('VisionEffect_ForegroundColorTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.foregroundColor')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ForegroundColorTest_001 + * @tc.name: example_one_foregroundColor + * @tc.desc: example_one_foregroundColor + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ForegroundColorTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_foregroundColor')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_ForegroundColorTest_002 + * @tc.name: example_two_foregroundColor + * @tc.desc: example_two_foregroundColor + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ForegroundColorTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_foregroundColor')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_002_end'); + }) + + /* + * @tc.number: VisionEffect_ForegroundColorTest_003 + * @tc.name: example_three_foregroundColor + * @tc.desc: example_three_foregroundColor + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ForegroundColorTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_three_foregroundColor')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundColorTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundEffect.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundEffect.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..cb5ea0bd469c7beb236cdcdcce9b34123c8277eb --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ForegroundEffect.test.ets @@ -0,0 +1,70 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ForegroundEffectTest() { + describe('VisionEffect_ForegroundEffectTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.foregroundEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ForegroundEffectTest_001 + * @tc.name: example_one_foregroundEffect + * @tc.desc: example_one_foregroundEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ForegroundEffectTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundEffectTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_foregroundEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ForegroundEffectTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ImageEffect.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ImageEffect.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..f96dad946ca9e0e7a73dfad6847aa02dc6d61ae8 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/ImageEffect.test.ets @@ -0,0 +1,214 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function ImageEffectTest() { + describe('VisionEffect_ImageEffectTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_001 + * @tc.name: example_one_imageEffect + * @tc.desc: example_one_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_BackgroundTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_002 + * @tc.name: example_two_imageEffect + * @tc.desc: example_two_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_002_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_003 + * @tc.name: example_three_imageEffect + * @tc.desc: example_three_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_three_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_003_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_004 + * @tc.name: example_four_imageEffect + * @tc.desc: example_four_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_004', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_004_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_four_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_004_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_005 + * @tc.name: example_five_imageEffect + * @tc.desc: example_five_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_005', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_005_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_five_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_005_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_006 + * @tc.name: example_six_imageEffect + * @tc.desc: example_six_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_006', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_006_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_six_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_006_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_007 + * @tc.name: example_seven_imageEffect + * @tc.desc: example_seven_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_007', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_007_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_seven_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_007_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_008 + * @tc.name: example_eight_imageEffect + * @tc.desc: example_eight_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_008', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_008_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_eight_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_008_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_009 + * @tc.name: example_nine_imageEffect + * @tc.desc: example_nine_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_009', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_009_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_nine_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_009_end'); + }) + + /* + * @tc.number: VisionEffect_ImageEffectTest_010 + * @tc.name: example_ten_imageEffect + * @tc.desc: example_ten_imageEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'ImageEffectTest_010', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_010_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_ten_imageEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_ImageEffectTest_010_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/LinearGradient.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/LinearGradient.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..9167606aace450a1cdbf4e59c7cb1c6f20f18cdd --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/LinearGradient.test.ets @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function LinearGradientTest() { + describe('VisionEffect_LinearGradientTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.linearGradient')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_LinearGradientTest_001 + * @tc.name: example_one_linearGradient + * @tc.desc: example_one_linearGradient + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'LinearGradientTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_linearGradient')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_LinearGradientTest_002 + * @tc.name: example_two_linearGradient + * @tc.desc: example_two_linearGradient + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'LinearGradientTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_linearGradient')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_002_end'); + }) + + /* + * @tc.number: VisionEffect_LinearGradientTest_003 + * @tc.name: example_three_linearGradient + * @tc.desc: example_three_linearGradient + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'LinearGradientTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_three_linearGradient')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_LinearGradientTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/List.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..318bbc28c73fb4d174eb1720cc76c84e11882532 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/List.test.ets @@ -0,0 +1,48 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { TransformTest } from './Transform.test'; +import { OpacityTest } from './Opacity.test'; +import { ClipTest } from './Clip.test'; +import { ImageEffectTest } from './ImageEffect.test'; +import { BackgroundTest } from './Background.test'; +import { ForegroundBlurStyleTest } from './ForegroundBlurStyle.test'; +import { ForegroundColorTest } from './ForegroundColor.test'; +import { ClickEffectTest } from './ClickEffect.test'; +import { UseEffectTest } from './UseEffect.test'; +import { OutLineTest } from './OutLine.test'; +import { RenderFitTest } from './RenderFit.test'; +import { MotionBlurTest } from './MotionBlur.test'; +import { LinearGradientTest } from './LinearGradient.test'; +import { ForegroundEffectTest } from './ForegroundEffect.test'; +import { VisualEffectTest } from './VisualEffect.test' + + +export default function testsuite() { + TransformTest(); + OpacityTest(); + ClipTest(); + ImageEffectTest(); + BackgroundTest(); + ForegroundBlurStyleTest(); + ForegroundColorTest(); + ClickEffectTest(); + UseEffectTest(); + RenderFitTest(); + OutLineTest(); + MotionBlurTest(); + LinearGradientTest(); + ForegroundEffectTest(); + VisualEffectTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/MotionBlur.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/MotionBlur.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..19e739f5794bbb785e63e030e26ed6c12aee20fe --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/MotionBlur.test.ets @@ -0,0 +1,78 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function MotionBlurTest() { + describe('VisionEffect_MotionBlurTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.motionBlur')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_MotionBlurTest_001 + * @tc.name: example_one_motionBlur + * @tc.desc: example_one_motionBlur + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'MotionBlurTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_MotionBlurTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_motionBlur')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Image')) + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.type('Image')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_MotionBlurTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Opacity.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Opacity.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..897bf55df22e64fe4d39fb2357d5607eaf753c2f --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Opacity.test.ets @@ -0,0 +1,70 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function OpacityTest() { + describe('VisionEffect_OpacityTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.opacity')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_OpacityTest_001 + * @tc.name: example_one_opacity + * @tc.desc: example_one_opacity + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OpacityTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_OpacityTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_opacity')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_OpacityTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/OutLine.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/OutLine.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..4c18d7e3f8cd9c4796900bdba5644fbaaab99539 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/OutLine.test.ets @@ -0,0 +1,86 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function OutLineTest() { + describe('VisionEffect_OutLineTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.outline')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_OutLineTest_001 + * @tc.name: example_one_outline + * @tc.desc: example_one_outline + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OutLineTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_OutLineTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_outline')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_OutLineTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_OutLineTest_002 + * @tc.name: example_two_outline + * @tc.desc: example_two_outline + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'OutLineTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_OutLineTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_outline')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_OutLineTest_002_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/RenderFit.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/RenderFit.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..50bdc69d39dad7a9944c58d41529403f0e9ada35 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/RenderFit.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function RenderFitTest() { + describe('VisionEffect_RenderFitTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.renderFit')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_RenderFitTest_001 + * @tc.name: example_one_renderFit + * @tc.desc: example_one_renderFit + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'RenderFitTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_RenderFitTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_renderFit')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('animate')); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_RenderFitTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Transform.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Transform.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..8f12681f8738e7effb2afea3494e8eec3b8fa280 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/Transform.test.ets @@ -0,0 +1,106 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function TransformTest() { + describe('VisionEffect_TransformTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.transform')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_TransformTest_001 + * @tc.name: example_one_transform + * @tc.desc: example_one_transform + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'TransformTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_transform')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_001_end'); + }) + + /* + * @tc.number: VisionEffect_TransformTest_002 + * @tc.name: example_two_transform + * @tc.desc: example_two_transform + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'TransformTest_002', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_002_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_two_transform')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('change prep')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_002_end'); + }) + + /* + * @tc.number: VisionEffect_TransformTest_003 + * @tc.name: example_three_transform + * @tc.desc: example_three_transform + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'TransformTest_003', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_003_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_three_transform')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_TransformTest_003_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/UseEffect.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/UseEffect.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..b835508bd4b75f9437da79ce863bfa9773e8bb57 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/UseEffect.test.ets @@ -0,0 +1,74 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function UseEffectTest() { + describe('VisionEffect_UseEffectTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.useEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_UseEffectTest_001 + * @tc.name: example_one_useEffect + * @tc.desc: example_one_useEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'UseEffectTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_UseEffectTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_useEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + + aimComponent = await driver.findComponent(ON.text('useEffect')) + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_UseEffectTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/VisualEffect.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/VisualEffect.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..beed8c5f11bd0afb5621048fd3b5a99175c37ea7 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/ets/test/VisualEffect.test.ets @@ -0,0 +1,70 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { abilityDelegatorRegistry, Component, Driver } from '@kit.TestKit'; +import { afterEach, beforeAll, describe, expect, it } from '@ohos/hypium'; +import { ON } from '@ohos.UiTest'; +import { hilog } from '@kit.PerformanceAnalysisKit'; + +const delegator: abilityDelegatorRegistry.AbilityDelegator = abilityDelegatorRegistry.getAbilityDelegator() +const BUNDLE = 'VisionEffect_' +const TAG = '[Sample_VisionEffect_]'; +const DOMAIN = 0xF811 + +const driver = Driver.create(); + +let aimComponent : Component +let resourceManager = delegator.getAppContext().resourceManager; + +export function VisualEffectTest() { + describe('VisionEffect_VisualEffectTest', () => { + + beforeAll(async () => { + await delegator.startAbility({ + bundleName: 'com.samples.visionEffect', + abilityName: 'EntryAbility' + }); + await driver.delayMs(3000); + + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.visualEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + }) + + afterEach(async () => { + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + do { + await driver.pressBack(); + aimComponent = await driver.findComponent(ON.text('VisionEffectIndex')); + } while (aimComponent == null) + }) + + /* + * @tc.number: VisionEffect_VisualEffectTest_001 + * @tc.name: example_one_visualEffect + * @tc.desc: example_one_visualEffect + * @tc.size: MediumTest + * @tc.type: Function + * @tc.level Level 1 + */ + it(BUNDLE + 'VisualEffectTest_001', 0, async () => { + hilog.info(DOMAIN, TAG, 'VisionEffect_VisualEffectTest_001_begin'); + aimComponent = await driver.findComponent(ON.text(resourceManager.getStringSync($r('app.string.example_one_visualEffect')))); + await aimComponent.click(); + await driver.delayMs(1000); + hilog.info(DOMAIN, TAG, 'VisionEffect_VisualEffectTest_001_end'); + }) + + }) +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/module.json5 b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/module.json5 new file mode 100644 index 0000000000000000000000000000000000000000..1cafc28b86d7d9f2b34f24d26a75c0dbd7299715 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/ohosTest/module.json5 @@ -0,0 +1,25 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "module": { + "name": "entry_test", + "type": "feature", + "deviceTypes": [ + "phone" + ], + "deliveryWithInstall": true, + "installationFree": false + } +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/List.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/List.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..a60c87c5cbb0badf7c3fd8975034590e6fafa992 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/List.test.ets @@ -0,0 +1,19 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import localUnitTest from './LocalUnit.test'; + +export default function testsuite() { + localUnitTest(); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/LocalUnit.test.ets b/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/LocalUnit.test.ets new file mode 100644 index 0000000000000000000000000000000000000000..841bfd77e56060e50ec0924302a5ae624e76e3aa --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/entry/src/test/LocalUnit.test.ets @@ -0,0 +1,47 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium'; + +export default function localUnitTest() { + describe('localUnitTest', () => { + // Defines a test suite. Two parameters are supported: test suite name and test suite function. + beforeAll(() => { + // Presets an action, which is performed only once before all test cases of the test suite start. + // This API supports only one parameter: preset action function. + }); + beforeEach(() => { + // Presets an action, which is performed before each unit test case starts. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: preset action function. + }); + afterEach(() => { + // Presets a clear action, which is performed after each unit test case ends. + // The number of execution times is the same as the number of test cases defined by **it**. + // This API supports only one parameter: clear action function. + }); + afterAll(() => { + // Presets a clear action, which is performed after all test cases of the test suite end. + // This API supports only one parameter: clear action function. + }); + it('assertContain', 0, () => { + // Defines a test case. This API supports three parameters: test case name, filter parameter, and test case function. + let a = 'abc'; + let b = 'b'; + // Defines a variety of assertion methods, which are used to declare expected boolean conditions. + expect(a).assertContain(b); + expect(a).assertEqual(a); + }); + }); +} \ No newline at end of file diff --git a/code/DocsSample/ArkUISample/VisionEffect/hvigor/hvigor-config.json5 b/code/DocsSample/ArkUISample/VisionEffect/hvigor/hvigor-config.json5 new file mode 100644 index 0000000000000000000000000000000000000000..2d5b53c87bb8c7e5a38072d17a6e9b9533003301 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/hvigor/hvigor-config.json5 @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "5.1.0", + "dependencies": { + }, + "execution": { + // "analyze": "normal", /* Define the build analyze mode. Value: [ "normal" | "advanced" | false ]. Default: "normal" */ + // "daemon": true, /* Enable daemon compilation. Value: [ true | false ]. Default: true */ + // "incremental": true, /* Enable incremental compilation. Value: [ true | false ]. Default: true */ + // "parallel": true, /* Enable parallel compilation. Value: [ true | false ]. Default: true */ + // "typeCheck": false, /* Enable typeCheck. Value: [ true | false ]. Default: false */ + }, + "logging": { + // "level": "info" /* Define the log level. Value: [ "debug" | "info" | "warn" | "error" ]. Default: "info" */ + }, + "debugging": { + // "stacktrace": false /* Disable stacktrace compilation. Value: [ true | false ]. Default: false */ + }, + "nodeOptions": { + // "maxOldSpaceSize": 8192 /* Enable nodeOptions maxOldSpaceSize compilation. Unit M. Used for the daemon process. Default: 8192*/ + // "exposeGC": true /* Enable to trigger garbage collection explicitly. Default: true*/ + } +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/hvigorfile.ts b/code/DocsSample/ArkUISample/VisionEffect/hvigorfile.ts new file mode 100644 index 0000000000000000000000000000000000000000..6b365cacd0191d3b1178eb6b9807b1ae0add6271 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/hvigorfile.ts @@ -0,0 +1,20 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { appTasks } from '@ohos/hvigor-ohos-plugin'; + +export default { + system: appTasks, /* Built-in plugin of Hvigor. It cannot be modified. */ + plugins:[] /* Custom plugin to extend the functionality of Hvigor. */ +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/oh-package.json5 b/code/DocsSample/ArkUISample/VisionEffect/oh-package.json5 new file mode 100644 index 0000000000000000000000000000000000000000..b56a095f3819541cf150766a67ff7e23a23973a9 --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/oh-package.json5 @@ -0,0 +1,24 @@ +/* + * Copyright (c) 2025 Huawei Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +{ + "modelVersion": "5.1.0", + "description": "Please describe the basic information.", + "dependencies": { + }, + "devDependencies": { + "@ohos/hypium": "1.0.21", + "@ohos/hamock": "1.0.0" + } +} diff --git a/code/DocsSample/ArkUISample/VisionEffect/ohosTest.md b/code/DocsSample/ArkUISample/VisionEffect/ohosTest.md new file mode 100644 index 0000000000000000000000000000000000000000..9c090d5c0dca5f9949c78f5a2da22450c84a955e --- /dev/null +++ b/code/DocsSample/ArkUISample/VisionEffect/ohosTest.md @@ -0,0 +1,21 @@ +# VisualEffect 测试用例归档 + +## 用例表 + +| 测试功能 | 预置条件 | 输入 | 预期输出 | 是否自动 | 测试结果 | +| ------------------- | -------------- | ----------------------- | ------------------------------------------------------------ | :------- | -------- | +| 背景设置示例代码验证 | 设备正常运行 | 切换背景颜色 | 背景颜色效果符合预期 | 是 | Pass | +| 点击回弹效果示例代码验证 | 设备正常运行 | 切换回弹效果 | 回弹效果符合预期 | 是 | Pass | +| 形状裁剪示例代码验证 | 设备正常运行 | 查看各个组件的裁剪效果 | 各个组件的裁剪效果正常 | 是 | Pass | +| 组件内容模糊示例代码验证 | 设备正常运行 | 查看各个组件的模糊效果 | 模糊效果正常，页面布局正常 | 是 | Pass | +| 前景色设置示例代码验证 | 设备正常运行 | 切换前景色 | 前景色正常，页面布局正常 | 是 | Pass | +| 前景属性设置示例代码验证 | 设备正常运行 | 切换前景属性 | 视效效果符合预期 | 是 | Pass | +| 图像效果示例代码验证 | 设备正常运行 | 切换页面，查看各种图像效果 | 图像效果符合预期 | 是 | Pass | +| 颜色渐变示例代码验证 | 设备正常运行 | 查看各个组件的渐变效果 | 渐变效果符合预期 | 是 | Pass | +| 运动模糊示例代码验证 | 设备正常运行 | 点击控件触发视效 | 运动模糊效果符合预期 | 是 | Pass | +| 透明度设置示例代码验证 | 设备正常运行 | 查看各个控件的透明度效果 | 透明度效果从上至下由深到浅 | 是 | Pass | +| 外描边设置示例代码验证 | 设备正常运行 | 查看各个控件的外描边效果 | 外描边效果符合预期 | 是 | Pass | +| 组件内容填充方式示例代码验证 | 设备正常运行 | 点击animate按钮 | 动画效果正常，视效效果正常，页面布局正常 | 是 | Pass | +| 图形变换示例代码验证 | 设备正常运行 | 查看各个示例页面中的组件 | 图形变换效果正常，页面布局正常 | 是 | Pass | +| 特效绘制合并示例代码验证 | 设备正常运行 | 点击useEffect按钮 | 特效绘制合并效果正常，页面布局正常 | 是 | Pass | +| 视效设置示例代码验证 | 设备正常运行 | 点击各种视觉效果 | 视效效果正常，页面布局正常 | 是 | Pass | diff --git a/code/DocsSample/ArkUISample/VisionEffect/screenshots/device/image1.png b/code/DocsSample/ArkUISample/VisionEffect/screenshots/device/image1.png new file mode 100644 index 0000000000000000000000000000000000000000..c169671c94477334f99ca19063dd351cde63861f Binary files /dev/null and b/code/DocsSample/ArkUISample/VisionEffect/screenshots/device/image1.png differ