【每日学点HarmonyOS Next知识】获取页面堆栈对象、画布动画、安全按钮、图片组件修改图片颜色、设置弹窗只在当前页面展示

1、HarmonyOS 如何获取到页面堆栈对象？

在通过 router 如何获取当前页面层级的环境，以及获取页面层级对象，例如 页面 A - B - C ，在C 页面是可以获取到当前页面层级的list，并且获取到对应页面对象
目前只能获取到router页面栈内当前页面的信息如index，路径，页面名称，和页面站内页面的数量，暂不支持获取到页面栈的list。
现在模块内和模块间的跳转都会能用navigation实现的都只管用navigation实现，因为后续router会停止演进，后续大概不会新增能力。模块间的跳转，用navigation导致的耦合精密的问题，可以通过动态import来解决。目前router不支持对页面栈举行精细操作，在清除栈方面，如A-B-B1不支持在B1页面时清除B页面，只支持使用claer清算掉当前页面以外的所有页面。router不支持跳过最大限度32.页面栈的最大容量为32个页面。router路由栈只支持获取栈顶页面属性，仅包含当前页面路径，页面文件名。navigation后续会继承演进，如果有能力为得到满意可以继承规划需求。navigation中可以通过getAllPathName 获取栈中所有NavDestination页面的名称，（具体可参考如下链接下的示例2：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-navigation-V5#getallpathname10）

1. // Index.ets
2. @Entry
3. @Component
4. struct NavigationExample {
5.   pageInfos: NavPathStack = new NavPathStack()
6.   isUseInterception: boolean = false;
8.   registerInterception() {
9.     this.pageInfos.setInterception({
10.       // 页面跳转前拦截，允许操作栈，在当前跳转中生效。
11.       willShow: (from: NavDestinationContext | "navBar", to: NavDestinationContext | "navBar",
12.         operation: NavigationOperation, animated: boolean) => {
13.         if (!this.isUseInterception) {
14.           return;
15.         }
16.         if (typeof to === "string") {
17.           console.log("target page is navigation home");
18.           return;
19.         }
20.         // 重定向目标页面，更改为pageTwo页面到pageOne页面。
21.         let target: NavDestinationContext = to as NavDestinationContext;
22.         if (target.pathInfo.name === 'pageTwo') {
23.           target.pathStack.pop();
24.           target.pathStack.pushPathByName('pageOne', null);
25.         }
26.       },
27.       // 页面跳转后回调，在该回调中操作栈在下一次跳转中刷新。
28.       didShow: (from: NavDestinationContext | "navBar", to: NavDestinationContext | "navBar",
29.         operation: NavigationOperation, isAnimated: boolean) => {
30.         if (!this.isUseInterception) {
31.           return;
32.         }
33.         if (typeof from === "string") {
34.           console.log("current transition is from navigation home");
35.         } else {
36.           console.log(`current transition is from  ${(from as NavDestinationContext).pathInfo.name}`)
37.         }
38.         if (typeof to === "string") {
39.           console.log("current transition to is navBar");
40.         } else {
41.           console.log(`current transition is to ${(to as NavDestinationContext).pathInfo.name}`);
42.         }
43.       },
44.       // Navigation单双栏显示状态发生变更时触发该回调。
45.       modeChange: (mode: NavigationMode) => {
46.         if (!this.isUseInterception) {
47.           return;
48.         }
49.         console.log(`current navigation mode is ${mode}`);
50.       }
51.     })
52.   }
54.   build() {
55.     Navigation(this.pageInfos) {
56.       Column() {
57.         Button('pushPath', { stateEffect: true, type: ButtonType.Capsule })
58.           .width('80%')
59.           .height(40)
60.           .margin(20)
61.           .onClick(() => {
62.             this.pageInfos.pushPath({ name: 'pageOne' }) //将name指定的NavDestination页面信息入栈
63.           })
64.         Button('use interception', { stateEffect: true, type: ButtonType.Capsule })
65.           .width('80%')
66.           .height(40)
67.           .margin(20)
68.           .onClick(() => {
69.             this.isUseInterception = !this.isUseInterception;
70.             if (this.isUseInterception) {
71.               this.registerInterception();
72.             } else {
73.               this.pageInfos.setInterception(undefined);
74.             }
75.           })
76.       }
77.     }.title('NavIndex')
78.   }
79. }

复制代码

2、HarmonyOS 基于drawing.canvas实现的动画demo？

可参考：https://developer.huawei.com/consumer/cn/blog/topic/03797837883380062
3、HarmonyOS 安全按钮返回权限失败？

安全按钮返回权限失败，result 返回TEMPORARY_AUTHORIZATION_FAILED，如何解决

1. // 默认参数下，图标、文字、背景都存在
2. SaveButton().onClick(async (event:ClickEvent, result:SaveButtonOnClickResult) => {
3.   if (result == SaveButtonOnClickResult.SUCCESS) {}
4. }

复制代码

使用uri打开文件，可以连续写入内容，写入过程不受时间限定 let file = await fs.open(uri, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);这个是需要对应权限的，需要在modules.json5中定义对应的权限 { "name": "ohos.permission.WRITE\_MEDIA", "reason": "$string:EntryAbility\_desc", "usedScene": { "abilities": [ "EntryAbility" ], "when": "always" } }
4、HarmonyOS Image组件设置了本地资源文件后，可以动态修改图片的颜色吗？

Image组件设置了本地资源文件后，可以动态修改图片的颜色吗
参考以下文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-image-V5#colorfilter9
colorFilter(value: ColorFilter | DrawingColorFilter)
为图像设置颜色滤镜效果。
设置该属性时，renderMode属性设置不见效。
参数名类型必填阐明valueColorFilter | DrawingColorFilter是1. 给图像设置颜色滤镜效果，入参为一个的4x5的RGBA转换矩阵。

矩阵第一行表现R（红色）的向量值，第二行表现G（绿色）的向量值，第三行表现B（蓝色）的向量值，第四行表现A（透明度）的向量值，4行分别代表不同的RGBA的向量值。

当矩阵对角线值为1，别的值为0时，保持图片原有色彩。

计算规则：

如果输入的滤镜矩阵为：

像素点为[R, G, B, A]

则过滤后的颜色为 [R’, G’, B’, A’]

2. 从API Version12开始支持@ohos.graphics.drawing的ColorFilter类型作为入参。

阐明：
API Version 11及之前，svg类型图源不支持该属性。
从API version 12开始，该接口中的DrawingColorfilter类型支持在元服务中使用。此中，svg类型的图源需具有stroke属性。 5、HarmonyOS 如何设置popup 只在当前页面展示？

正在使用popup 作为一个收到关照一个弹层提示，A页面 show出popup, A页已经跳转到B页面了，在显示 popup时，popup会出现在B页面上，是否可以设置仅在A页面展示
popup目前行为确实云云应用可以使用CustomDialog来实现，参考文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-common-components-custom-dialog-V5
示例demo：

1. import router from '@ohos.router';
3. @CustomDialog
4. export default struct UserPrivacyDialog {
5.   controller: CustomDialogController = new CustomDialogController({ builder: '' });
6.   cancel: Function = () => {
7.   };
8.   confirm: Function = () => {
9.   };
10.   visible: Visibility = Visibility.None
12.   build() {
13.     Column() {
14.       Text('我是弹窗')
16.       Button('jump')
17.         .onClick(() => {
18.           router.pushUrl({
19.             url: 'pages/Second'
20.           })
21.         }).backgroundColor(0xffffff).fontColor(Color.Red)
22.     }
23.     .margin({ top: 22 })
24.     .justifyContent(FlexAlign.SpaceEvenly)
25.   }
26. }
28. @Entry
29. @Component
30. struct Index {
31.   @State textValue: string = 'Hello World'
32.   @State visible: Visibility = Visibility.None
34.   build() {
35.     Stack() {
36.       Row() {
37.         Column() {
38.           Button('click')
39.             .onClick(() => {
40.               if (this.visible == Visibility.Visible) {
41.                 this.visible = Visibility.None
42.               } else {
43.                 this.visible = Visibility.Visible
44.               }
45.             })
46.             .backgroundColor(0x777474)
47.             .fontColor(0x000000)
48.         }
49.         .width('100%')
50.       }
51.       .height('100%')
52.       .backgroundColor(0x885555)
54.       Text('')
55.         .onClick(() => {
56.           if (this.visible == Visibility.Visible) {
57.             this.visible = Visibility.None
58.           } else {
59.             this.visible = Visibility.Visible
60.           }
61.         })
62.         .width('100%')
63.         .height('100%')// 透明度可以自己调节一下
64.         .opacity(0.16)
65.         .backgroundColor(0x000000)
66.         .visibility(this.visible)
68.       Column() {
69.         GridRow({
70.           columns: { xs: 1, sm: 4, md: 8, lg: 12 },
71.           breakpoints: {
72.             value: ["400vp", "600vp", "800vp"],
73.             reference: BreakpointsReference.WindowSize
74.           },
75.         }) {
76.           GridCol({
77.             span: { xs: 1, sm: 2, md: 4, lg: 8 },
78.             offset: { xs: 0, sm: 1, md: 2, lg: 2 }
79.           }) {
80.             Column() {
81.               Flex({ justifyContent: FlexAlign.SpaceAround }) {
82.                 UserPrivacyDialog();
83.               }.margin({ bottom: 10 })
84.             }
85.             .backgroundColor(0xffffff)
86.             .visibility(this.visible)
87.             .clip(true)
88.             .borderRadius(20)
89.           }
90.         }
91.       }.width('95%') //设置弹窗宽度
92.     }
93.   }
94. }

复制代码

componentUtils.getRectangleById参考：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-arkui-componentutils-V5#componentutilsgetrectanglebyid
getRectangleById(id: string): ComponentInfo
根据组件ID获取组件实例对象, 通过组件实例对象将获取的坐标位置和巨细同步返回给开辟者。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。