!9482 【ACE子系统】新增接口用例

Merge pull request !9482 from hekun/master

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/TouchAdd.ets

+/**
+ * Copyright (c) 2023 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 TouchExample {
+  @State text: string = ''
+  @State eventType: string = ''
+
+  build() {
+    Column() {
+      Button('Touch').height(40).width(100)
+        .onTouch((event: TouchEvent) => {
+          if (event.type === TouchType.Down) {
+            this.eventType = 'Down'
+          }
+          if (event.type === TouchType.Up) {
+            this.eventType = 'Up'
+          }
+          if (event.type === TouchType.Move) {
+            this.eventType = 'Move'
+          }
+          this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
+          + event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
+          + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
+          + event.target.area.width + '\nheight:' + event.target.area.height + '\n' + event.getHistoricalPoints()
+        }).key('touchAdd')
+      Button('Touch').height(50).width(200).margin(20)
+        .onTouch((event: TouchEvent) => {
+          if (event.type === TouchType.Down) {
+            this.eventType = 'Down'
+          }
+          if (event.type === TouchType.Up) {
+            this.eventType = 'Up'
+          }
+          if (event.type === TouchType.Move) {
+            this.eventType = 'Move'
+          }
+          this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
+          + event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
+          + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
+          + event.target.area.width + '\nheight:' + event.target.area.height
+        })
+      Text(this.text)
+    }.width('100%').padding(30)
+  }
+}

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/animateAdd.ets

+/**
+ * Copyright (c) 2023 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';
+          }
+          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.icon')).width(200).height(200)
+          .key('keyImageAdd')
+          .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.icon')).width(200).height(200).margin({ top: 100 })
+          .transition(
+          TransitionEffect.asymmetric(
+          TransitionEffect.scale({ x: 0, y: 0 }),
+          TransitionEffect.IDENTITY
+          )
+          )
+
+        Image($r('app.media.icon')).width(200).height(200).margin({ top: 100 })
+          .transition(
+          TransitionEffect.asymmetric(
+          TransitionEffect.move(TransitionEdge.START),
+          TransitionEffect.IDENTITY
+          )
+          )
+      }
+    }.width('100%')
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/bindConver.ets

+
+/**
+ * Copyright (c) 2023 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
+  @State sheetHeight:number = 300;
+  @State showDragBar:boolean = true;
+  @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, onAppear: () => {console.log("BindContentCover onAppear.")}, 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
+        })
+        .key('buttonAdd')
+        .fontSize(20)
+        .margin(10)
+        .bindContentCover($$this.isShow,this.myBuilder(),{modalTransition:ModalTransition.NONE})
+        .bindContentCover($$this.isShow, this.myBuilder(), {modalTransition: ModalTransition.NONE, backgroundColor: Color.Pink, onAppear: () => {console.log("BindContentCover onAppear.")}, onDisappear: () => {console.log("BindContentCover onDisappear.")}})
+      Button("transition modal 2")
+        .onClick(() => {
+          this.isShow = true
+        })
+        .fontSize(20)
+        .margin(10)
+        .bindSheet($$this.isShow, this.myBuilder(), {height: this.sheetHeight, dragBar: this.showDragBar, backgroundColor: Color.Green, onAppear: () => {console.log("BindSheet onAppear.")}, onDisappear: () => {console.log("BindSheet onDisappear.")}})
+
+
+    }
+    .justifyContent(FlexAlign.Center)
+    .backgroundColor("#ff49c8ab")
+    .width('100%')
+    .height('100%')
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/commonAdd.ets

+/**
+ * Copyright (c) 2023 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.icon'))
+        .width(300)
+        .height(350)
+        .key('commonAdd')
+        .foregroundBlurStyle(BlurStyle.Thin, { colorMode: ThemeColorMode.LIGHT, adaptiveColor: AdaptiveColor.DEFAULT, scale: 1.0 })
+        .mouseResponseRegion(null)
+        .background(null)
+        .renderGroup(false)
+        .renderFit(RenderFit.BOTTOM)
+        .sphericalEffect(0.5)
+        .lightUpEffect(0.6)
+        .pixelStretchEffect({top:10,left:10,right:10,bottom:10 })
+        .reuseId(null)
+
+    }
+    .height('100%')
+    .width('100%')
+    .width('100%')
+    .accessibilityGroup(true)
+    .accessibilityLevel("yes")
+    .accessibilityText("分组")
+    .accessibilityDescription("Column组件可以被选中，播报的内容是“分组”")
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/common_ets_api.ets

+/**
+ * Copyright (c) 2023 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 Common_ts_ets_apiStaticClear {
+  @StorageLink('varA') varA: number = 2
+  private label: string = 'count'
+  @StorageLink('highScore') highScore: number = 0
+
+
+
+  build() {
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelAAd")
+        .onClick(() => {
+          Environment.envProp("test",200);
+        })
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelB")
+        .onClick(() => {
+          Environment.envProps(null);
+        })
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelC")
+        .onClick(() => {
+           PersistentStorage.persistProp("delete",0);
+        })
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelD")
+        .onClick(() => {
+          PersistentStorage.deleteProp("delete");
+        })
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelE")
+        .onClick(() => {
+          PersistentStorage.persistProps(null);
+        })
+      Text(`${this.label}: ${this.varA}`)
+        .width(320)
+        .height(70)
+        .fontSize(20)
+        .opacity(1)
+        .align(Alignment.TopStart)
+        .fontColor(0xCCCCCC)
+        .lineHeight(25)
+        .border({ width: 1 })
+        .padding(10)
+        .textAlign(TextAlign.Center)
+        .textOverflow({ overflow: TextOverflow.None })
+        .key("labelF")
+        .onClick(() => {
+          LocalStorage.getShared();
+        })
+
+
+
+    }.width("100%").height("100%")
+  }
+}
+

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/createBuilderadd.ets

+/**
+ * Copyright (c) 2023 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 componentSnapshot from '@ohos.arkui.componentSnapshot'
+import image from '@ohos.multimedia.image'
+
+@Entry
+@Component
+struct OffscreenSnapshotExample {
+  @State pixmap: image.PixelMap = undefined
+
+  @Builder
+  RandomBuilder() {
+    Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
+      Text('Test menu item 1')
+        .fontSize(20)
+        .width(100)
+        .height(50)
+        .textAlign(TextAlign.Center)
+      Divider().height(10)
+      Text('Test menu item 2')
+        .fontSize(20)
+        .width(100)
+        .height(50)
+        .textAlign(TextAlign.Center)
+    }.width(100)
+  }
+
+  build() {
+    Column() {
+      Button("click to generate offscreen UI snapshot")
+        .onClick(() => {
+          componentSnapshot.createFromBuilder(this.RandomBuilder.bind(this))
+            .then((pixmap: image.PixelMap) => {
+              this.pixmap = pixmap
+              // save pixmap to file
+              // ....
+            })
+        })
+
+      Button("click to generate offscreen UI snapshot").margin({top:20}).key('crateFrom')
+        .onClick(() => {
+          componentSnapshot.createFromBuilder(this.RandomBuilder.bind(this),
+            (error: Error, pixmap: image.PixelMap) => {
+              this.pixmap = pixmap
+              // save pixmap to file
+              // ....
+            })
+        })
+
+      Button("click to generate UI snapshot").margin({top:20})
+        .onClick(() => {
+          componentSnapshot.get("root", (error: Error, pixmap: image.PixelMap) => {
+            this.pixmap = pixmap
+            // save pixmap to file
+            // ....
+          })
+        })
+
+      Button("click to generate UI snapshot").margin({top:20})
+        .onClick(() => {
+          componentSnapshot.get("root")
+            .then((pixmap: image.PixelMap) => {
+              this.pixmap = pixmap
+              // save pixmap to file
+              // ....
+            })
+        })
+
+
+    }.width('80%').margin({ left: 10, top: 5, bottom: 5 }).height(200)
+    .border({ color: '#880606', width: 2 })
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/customAdd.ets

+/**
+ * Copyright (c) 2023 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 IndexComponent {
+  @State textColor: Color = Color.Black;
+
+  onPageShow() {
+    this.textColor = Color.Blue;
+    console.info('IndexComponent onPageShow');
+  }
+
+  onPageHide() {
+    this.textColor = Color.Transparent;
+    console.info('IndexComponent onPageHide');
+  }
+
+  onBackPress() {
+    this.textColor = Color.Red;
+    console.info('IndexComponent onBackPress');
+  }
+  aboutToReuse() {
+    console.info('aboutReuse');
+  }
+  build() {
+    Column() {
+      Text('Hello World')
+        .fontColor(this.textColor)
+        .fontSize(30)
+        .margin(30).key('customAdd')
+    }.width('100%')
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/dragAdd.ets

+/**
+ * Copyright (c) 2023 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 udmf from '@ohos.data.UDMF';
+import promptAction from '@ohos.promptAction';
+@Entry
+@Component
+struct Index {
+  @State targetImage: string = '';
+  @State targetText: string = 'Drag Text';
+  @State hyperLinkText: string = 'HyperLink';
+  @State hyperLinkContent: string = 'HyperLink';
+  @State imageWidth: number = 100;
+  @State imageHeight: number = 100;
+  @State imgState: Visibility = Visibility.Visible;
+  @State videoSrc: string = 'resource://RAWFILE/02.mp4';
+  @State abstractContent: string = "abstract";
+  @State textContent: string = "";
+
+  getDataFromUdmfRetry(event: DragEvent, callback: (data: DragEvent)=>void)
+  {
+    let records: Array<udmf.UnifiedRecord> = event.getData().getRecords();
+    if (records.length !== 0) {
+      callback(event);
+      return;
+    }
+    setTimeout(()=>{
+      this.getDataFromUdmfRetry(event, callback);
+    }, 1500);
+  }
+
+  build() {
+    Row() {
+      Column() {
+        Text('start Drag')
+          .fontSize(18)
+          .width('100%')
+          .height(40)
+          .margin(10)
+          .key('dragAdd')
+          .backgroundColor('#008888')
+        Image($r('app.media.icon'))
+          .width(100)
+          .height(100)
+          .draggable(true)
+          .margin({left: 15})
+          .visibility(this.imgState)
+          .onDragEnd((event)=>{
+            if (event.getResult() === DragRet.DRAG_SUCCESS) {
+              promptAction.showToast({duration: 100, message: 'Drag Success'});
+            } else if (event.getResult() === DragRet.DRAG_FAILED) {
+              promptAction.showToast({duration: 100, message: 'Drag failed'});
+            }
+          })
+        Text('test drag event')
+          .width('100%')
+          .height(100)
+          .draggable(true)
+          .margin({left: 15})
+          .copyOption(CopyOptions.InApp)
+        TextArea({placeholder: 'please input words'})
+          .copyOption(CopyOptions.InApp)
+          .width('100%')
+          .height(50)
+          .draggable(true)
+        Search({placeholder: 'please input you word'})
+          .searchButton('Search')
+          .width('100%')
+          .height(80)
+          .textFont({size: 20})
+        Column() {
+          Text('change video source')
+        }.draggable(true)
+        .onDragStart((event)=>{
+          let video: udmf.Video = new udmf.Video();
+          video.videoUri = 'resource://RAWFILE/01.mp4';
+          let data: udmf.UnifiedData = new udmf.UnifiedData(video);
+          event.setData(data);
+        })
+        Column() {
+          Text('this is abstract')
+            .fontSize(20)
+            .width('100%')
+        }.margin({left: 40, top: 20})
+        .width('100%')
+        .height(100)
+        .onDragStart((event)=>{
+          let data: udmf.PlainText = new udmf.PlainText();
+          data.abstract = 'this is abstract';
+          data.textContent = 'this is content this is content';
+          event.setData(new udmf.UnifiedData(data));
+        })
+      }.width('45%')
+      .height('100%')
+      Column() {
+        Text('Drag Target Area')
+          .fontSize(20)
+          .width('100%')
+          .height(40)
+          .margin(10)
+          .backgroundColor('#008888')
+        Image(this.targetImage)
+          .width(this.imageWidth)
+          .height(this.imageHeight)
+          .draggable(true)
+          .margin({left: 15})
+          .border({color: Color.Black, width: 1})
+          .allowDrop([udmf.UnifiedDataType.IMAGE])
+          .onDrop((dragEvent: DragEvent)=> {
+            this.getDataFromUdmfRetry(dragEvent, (event)=>{
+              let records: Array<udmf.UnifiedRecord> = event.getData().getRecords();
+              let rect: Rectangle = event.getPreviewRect();
+              this.imageWidth = Number(rect.width);
+              this.imageHeight = Number(rect.height);
+              this.targetImage = (<udmf.Image>(records[0])).imageUri;
+              event.useCustomDropAnimation = false;
+              animateTo({duration: 1000}, ()=>{
+                this.imageWidth = 100;
+                this.imageHeight = 100;
+                this.imgState = Visibility.None;
+              })
+              event.setResult(DragRet.DRAG_SUCCESS);
+            })
+          })
+
+        Text(this.targetText)
+          .width('100%')
+          .height(100)
+          .border({color: Color.Black, width: 1})
+          .margin(15)
+          .allowDrop([udmf.UnifiedDataType.TEXT])
+          .onDrop((dragEvent: DragEvent)=>{
+            console.info("the getDisplayX " + dragEvent.getDisplayX());
+            console.info("the getDisplayY " + dragEvent.getDisplayY());
+            console.info("the getWindowX " + dragEvent.getWindowX());
+            console.info("the getWindowY " + dragEvent.getWindowY());
+            console.info("the getDisplayX " + dragEvent.getSummary());
+            console.info("the getVelocityX " + dragEvent.getVelocityX());
+            console.info("the getVelocityY " + dragEvent.getVelocityY());
+            console.info("the getVelocity " + dragEvent.getVelocity());
+            this.getDataFromUdmfRetry(dragEvent, event => {
+              let records:Array<udmf.UnifiedRecord> = event.getData().getRecords();
+              this.targetText = (<udmf.Text>(records[0])).details['value'];
+            })
+          })
+
+        Video({src: this.videoSrc, previewUri: $r('app.media.icon')})
+          .width('100%')
+          .height(200)
+          .controls(true)
+          .allowDrop([udmf.UnifiedDataType.VIDEO])
+
+        Column() {
+          Text(this.abstractContent).fontSize(20).width('100%')
+          Text(this.textContent).fontSize(15).width('100%')
+        }.width('100%').height(100).margin(20).border({color: Color.Black, width: 1})
+        .allowDrop([udmf.UnifiedDataType.PLAIN_TEXT])
+        .onDrop((dragEvent)=>{
+          this.getDataFromUdmfRetry(dragEvent, event=>{
+            let records: Array<udmf.UnifiedRecord> = event.getData().getRecords();
+            let plainText: udmf.PlainText = <udmf.PlainText>(records[0]);
+            this.abstractContent = plainText.abstract;
+            this.textContent = plainText.textContent;
+          })
+        })
+      }.width('45%')
+      .height('100%')
+      .margin({left: '5%'})
+    }
+    .height('100%')
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/MainAbility/pages/drwableAdd.ets

+/**
+ * Copyright (c) 2023 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 {DrawableDescriptor, LayeredDrawableDescriptor } from '@ohos.arkui.drawableDescriptor'
+import Curves from '@ohos.curves'
+
+
+@Entry
+@Component
+struct Index2 {
+  private resManager = getContext().resourceManager
+
+  build() {
+      Column() {
+        Image((<LayeredDrawableDescriptor> (this.resManager.getDrawableDescriptor($r('app.media.icon').id))))
+        Image(((<LayeredDrawableDescriptor> (this.resManager.getDrawableDescriptor($r('app.media.app_icon')
+          .id))).getForeground()).getPixelMap())
+        Image($r('app.media.icon'))
+          .width('200px').height('200px')
+          .clip(new Path({commands:LayeredDrawableDescriptor.getMaskClipPath()}))
+
+        Button("getBackground()").margin({top:20})
+          .onClick(() => {
+             let drawable = (<LayeredDrawableDescriptor> (this.resManager.getDrawableDescriptor($r('app.media.icon')
+              .id))).getBackground();
+          })
+        Button("getMask()").margin({top:20})
+          .onClick(() => {
+            let drawable = (<LayeredDrawableDescriptor> (this.resManager.getDrawableDescriptor($r('app.media.icon')
+              .id))).getMask();
+          })
+        Button("getMashClipPath").margin({top:20})
+          .onClick(() => {
+            let drawable = (<LayeredDrawableDescriptor> (this.resManager.getDrawableDescriptor($r('app.media.icon')
+              .id))).getMask();
+          })
+
+        Button("interpolatingSpring").margin({top:20}).key('drawleAdd')
+          .onClick(() => {
+            Curves.interpolatingSpring(100, 1, 228, 30) // 创建一个时长由弹簧参数决定的弹簧插值曲线
+          })
+
+
+      }.height('100%')
+  }
+}
\ No newline at end of file

arkui/ace_ets_component_ui/entry/src/main/ets/test/ApiCommponentAddJsunit.test.ets

@@ -447,6 +447,173 @@ export default function ApiCommponentAddJsunit() {
       done();   
     });
 
+    it('apiCommponentAddJsunit_1600', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_1600] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/animateAdd',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('keyImageAdd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_1600'] component obj is: " + obj.$attrs.width);
+      expect(obj.$attrs.width).assertEqual('200.00vp');
+      done();
+    });
+
+    it('apiCommponentAddJsunit_1700', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_1700] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/bindConver',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('buttonAdd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_1700'] component obj is: " + obj.$attrs.borderWidth);
+      expect(obj.$attrs.borderWidth).assertEqual('0.00vp');
+      done();
+    });
+
+    it('apiCommponentAddJsunit_1800', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_1800] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/common_ets_api',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('labelAAd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_1800'] component obj is: " + obj.$attrs.width);
+      expect(obj.$attrs.width).assertEqual('320.00vp');
+      done();
+    });
+
+
+    it('apiCommponentAddJsunit_1900', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_1900] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/commonAdd',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('commonAdd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_1900'] component obj is: " + obj.$attrs.width);
+      expect(obj.$attrs.width).assertEqual('300.00vp');
+      done();
+    });
+
+    it('apiCommponentAddJsunit_2000', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_2000] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/createBuilderadd',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('crateFrom');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_2000'] component obj is: " + obj.$attrs.borderWidth);
+      expect(obj.$attrs.borderWidth).assertEqual('0.00vp');
+      done();
+    });
+    it('apiCommponentAddJsunit_2100', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_2100] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/dragAdd',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('dragAdd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_2100'] component obj is: " + obj.$attrs.margin);
+      expect(obj.$attrs.margin).assertEqual('10.00vp');
+      done();
+    });
+   
+    it('apiCommponentAddJsunit_2200', 0, async function (done) {
+      console.info("[apiCommponentAddJsunit_2200] START" );
+      ohosrouter.clear();
+      ohosrouter.pushUrl({
+        url: 'MainAbility/pages/TouchAdd',
+        params: {
+          data1: 'message',
+          data2: {
+            data3: [123, 456, 789]
+          }
+        }
+      }).then(() => {
+        // success
+      }).catch(err => {
+        console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
+      })
+      await CommonFunc.sleep(1000);
+      let strJson = getInspectorByKey('touchAdd');
+      let obj = JSON.parse(strJson);
+      console.info("[apiCommponentAddJsunit_2200'] component obj is: " + obj.$attrs.margin);
+      expect(obj.$attrs.margin).assertEqual('0.00vp');
+      done();
+    });
   })
 
 

arkui/ace_ets_component_ui/entry/src/main/ets/test/fontJsunit.test.ets

@@ -95,6 +95,31 @@ export default function fontJsunit() {
       done();
     });
 
+     it('fontJsunit_0500', 0, async function (done) {
+      // Get the information of the font
+      console.info('fontJsunit_0500 START');
+      try {
+        let font = globalThis.uiContext.getFont().getUIInspector();
+        expect(font !=null).assertTrue();
+      } catch (err) {
+        console.error("fontJsunit_0500 error " + JSON.stringify(err));
+      }
+      done();
+    });
+
+    it('fontJsunit_0600', 0, async function (done) {
+      // Get the information of the font
+      console.info('fontJsunit_0600 START');
+      try {
+        let font = globalThis.uiContext.getFont().getComponentUtils();
+        expect(font !=null).assertTrue();
+      } catch (err) {
+        console.error("fontJsunit_0600 error " + JSON.stringify(err));
+      }
+      done();
+    });
+
+
 
   })
 }

arkui/ace_ets_component_ui/entry/src/main/resources/base/profile/main_pages.json

@@ -63,7 +63,14 @@
         "MainAbility/pages/listItemAddgroup",
         "MainAbility/pages/navrouteradd",
         "MainAbility/pages/animationAdd",
-        "MainAbility/pages/postCardAction"
-        
+        "MainAbility/pages/postCardAction",
+        "MainAbility/pages/animateAdd",
+        "MainAbility/pages/bindConver",
+        "MainAbility/pages/common_ets_api",
+        "MainAbility/pages/commonAdd",
+        "MainAbility/pages/createBuilderadd",
+        "MainAbility/pages/dragAdd",
+        "MainAbility/pages/TouchAdd",
+        "MainAbility/pages/drwableAdd"
     ]
 }
\ No newline at end of file