!9599 【ACE子系统】cherrypick OpenHarmony-4.0-Beta2

Merge pull request !9599 from hekun/cherry-pick-1690633312

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

@@ -27,6 +27,14 @@ struct BlurStyle1 {
         .backgroundBlurStyle(BlurStyle.BACKGROUND_THICK)
       Text("BlurStyle.BACKGROUND_ULTRA_THICK").margin(5).id("BACKGROUND_ULTRA_THICK")
         .backgroundBlurStyle(BlurStyle.BACKGROUND_ULTRA_THICK)
+      Column({ space: 100 }) {
+        // 绘制一个直径为150的圆,默认填充色为黑色
+        Circle({ width: 150, height: 200 })
+        // 绘制一个直径为150的圆，
+        Circle({ width: 150, height: 200 })
+          .backgroundColor(Color.White)
+          .foregroundColor(ColoringStrategy.INVERT)
+      }.width('100%').backgroundColor(Color.Blue)
     }.width('90%').height("90%")
   }
 }
\ No newline at end of file

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

@@ -16,22 +16,54 @@
 @Entry
 @Component
 struct CanvasRenderer1 {
-  private settings: RenderingContextSettings = new RenderingContextSettings(true)
-  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
+  private settings: RenderingContextSettings = new RenderingContextSettings(true);
+  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
   private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600)
+  private img:ImageBitmap = new ImageBitmap("resource/media/icon.png");
 
   build() {
     Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
       Canvas(this.context)
-//        .imageSmooththingQuality(ImageSmooththingQuality.high)
         .width('100%')
         .height('100%')
         .backgroundColor('#ffff00')
         .onReady(() =>{
-          this.offCanvas
           var offContext = this.offCanvas.getContext("2d", this.settings)
-          offContext.fillStyle = 0x0000FF
-          offContext.fillRect(20, 20, 150, 100)
+          let offctx = offContext
+          offctx.imageSmoothingEnabled = true
+          offctx.imageSmoothingQuality = 'high'
+          offctx.drawImage(this.img, 0, 0, 400, 200)
+
+          var image = this.offCanvas.transferToImageBitmap()
+          this.context.transferFromImageBitmap(image)
+        })
+
+      Canvas(this.context)
+        .width('100%')
+        .height('100%')
+        .backgroundColor('#ffff00')
+        .onReady(() =>{
+          var offContext = this.offCanvas.getContext("2d", this.settings)
+          let offctx = offContext
+          offctx.imageSmoothingEnabled = true
+          offctx.imageSmoothingQuality = 'medium'
+          offctx.drawImage(this.img, 0, 300, 400, 500)
+
+          var image = this.offCanvas.transferToImageBitmap()
+          this.context.transferFromImageBitmap(image)
+        })
+
+      Canvas(this.context)
+        .width('100%')
+        .height('100%')
+        .backgroundColor('#ffff00')
+        .onReady(() =>{
+          var offContext = this.offCanvas.getContext("2d", this.settings)
+          let offctx = offContext
+          offctx.imageSmoothingEnabled = true
+          offctx.imageSmoothingQuality = 'low'
+          offctx.drawImage(this.img, 0, 600, 400, 800)
+
           var image = this.offCanvas.transferToImageBitmap()
           this.context.transferFromImageBitmap(image)
         })

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

@@ -12,6 +12,9 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+function Rect1(x, y, z){
+  return {width: x, height: y, radios: z}
+}
 
 @Entry
 @Component
@@ -24,12 +27,14 @@ struct ClickExample {
 
   build() {
     Column() {
+      Rect(Rect1(200, 80, 1)).margin(10)
+
       Text(this.displayX).id("displayX")
       Text(this.displayY).id("displayY")
       Text(this.windowX).id("windowX")
       Text(this.windowY).id("windowY")
-
       Text(this.intentionCode).id("intentionCode")
+
       Row({ space: 20 }) {
         Button('Click').width(100).height(40).id("Button_click")
           .onClick((event: ClickEvent) => {

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

@@ -12,9 +12,11 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import dragController from "@ohos.arkui.dragController"
+import UDMF from '@ohos.data.UDMF'
+import promptAction from '@ohos.promptAction';
 
 
-import promptAction from '@ohos.promptAction';
 @Entry
 @Component
 struct DragEvent {
@@ -31,6 +33,14 @@ struct DragEvent {
   @State useCustomDropAnimation1: string = "useCustomDropAnimation";
   @State imgState: Visibility = Visibility.Visible;
 
+  @Builder DraggingBuilder() {
+    Column() {
+      Text("DraggingBuilder")
+    }
+    .width(100)
+    .height(100)
+    .backgroundColor(Color.Blue)
+  }
 
   build() {
     Row() {
@@ -38,6 +48,7 @@ struct DragEvent {
         Text(this.dragBehavior).id("dragBehavior").margin(5)
         Text(this.dragRet).id("dragRet").margin(5)
         Text(this.useCustomDropAnimation1).id("useCustomDropAnimation").margin(5)
+
         Image($r('app.media.icon')).margin(5)
           .width(100)
           .height(100)
@@ -45,7 +56,9 @@ struct DragEvent {
           .margin({left: 15})
           .visibility(this.imgState)
           .onDragStart((event)=>{
+            event.dragBehavior = DragBehavior.COPY
             event.setResult(DragRet.DRAG_SUCCESS);
+
           })
           .onDragEnd((event)=>{
             event.dragBehavior = DragBehavior.MOVE
@@ -63,9 +76,31 @@ struct DragEvent {
               promptAction.showToast({duration: 100, message: 'Drag Canceled'});
             } else if (event.getResult() === DragRet.DROP_DISABLED) {
               promptAction.showToast({duration: 100, message: 'Drop Disabled'});
+            }else if (event.getResult() === DragRet.DROP_ENABLED) {
+              promptAction.showToast({duration: 100, message: 'Drop Enabled'});
             }
             this.dragRet = event.getResult().toString()
           })
+
+        Button('touch to execute drag')
+          .onTouch((event) => {
+            if (event.type == TouchType.Down) {
+              let text = new UDMF.Text()
+              let unifiedData = new UDMF.UnifiedData(text)
+              let dragInfo: dragController.DragInfo = {
+                pointerId: 0,
+                data: unifiedData,
+                extraParams: ''
+              }
+              dragController.executeDrag(this.DraggingBuilder.bind(this), dragInfo, (err, {event, extraParams}) => {
+                if (event.getResult() == DragRet.DRAG_SUCCESS) {
+                  // ...
+                } else if (event.getResult() == DragRet.DRAG_FAILED) {
+                  // ...
+                }
+              })
+            }
+          })
       }.width('90%')
       .height('100%')
       .margin({left: '5%'})

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

@@ -14,8 +14,9 @@
  */
 
 
+@Entry({ routeName : 'ApiRect' })
 @Component
-struct HelloComponent {
+struct MyComponent {
   @State message: string = 'Hello, World!';
 
   build() {
@@ -28,18 +29,4 @@ struct HelloComponent {
         })
     }
   }
-}
-
-
-@Entry
-@Component
-struct myPage {
-  build() {
-    Column() {
-      Text('ArkUI message')
-      HelloComponent({ message: 'Hello, World!' });
-      Divider()
-      HelloComponent({ message: '你好!' });
-    }
-  }
 }
\ No newline at end of file

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

@@ -15,7 +15,7 @@
 
 @Entry
 @Component
-struct ModalTransition1 {
+struct ModalTransition11 {
   @State isShow:boolean = false
   @State isShow2:boolean = false
 
@@ -41,7 +41,7 @@ struct ModalTransition1 {
         .fontSize(20)
         .onClick(()=>{
           this.isShow2 = true;
-        }).bindContentCover(this.isShow2, this.myBuilder2(), {modalTransition: ModalTransition.ALPHA, backgroundColor: Color.Gray, onAppear: () => {console.log("BindContentCover onAppear.")}, onDisappear: () => {console.log("BindContentCover onDisappear.")}})
+        }).bindContentCover(this.isShow2, this.myBuilder2(), {modalTransition: ModalTransition.NONE, backgroundColor: Color.Gray, onAppear: () => {console.log("BindContentCover onAppear.")}, onDisappear: () => {console.log("BindContentCover onDisappear.")}})
 
       Button("close modal 1")
         .margin(10)
@@ -64,6 +64,14 @@ struct ModalTransition1 {
         .fontSize(20)
         .margin(10)
         .bindContentCover($$this.isShow, this.myBuilder(), {modalTransition: ModalTransition.ALPHA, backgroundColor: Color.Pink, onAppear: () => {console.log("BindContentCover onAppear.")}, onDisappear: () => {console.log("BindContentCover onDisappear.")}})
+
+      Button("transition modal 3")
+        .onClick(() => {
+          this.isShow = true
+        })
+        .fontSize(20)
+        .margin(10)
+        .bindContentCover($$this.isShow, this.myBuilder(), {modalTransition: ModalTransition.DEFAULT, backgroundColor: Color.Pink, onAppear: () => {console.log("BindContentCover onAppear.")}, onDisappear: () => {console.log("BindContentCover onDisappear.")}})
     }
     .justifyContent(FlexAlign.Center)
     .backgroundColor(Color.White)

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

@@ -43,22 +43,19 @@ struct TransitionEffectExample1 {
       }else{
         Image($r('app.media.icon')).width(200).height(200)
           .transition(TransitionEffect.IDENTITY
-
             .animation({ duration: 2000, curve: Curve.Ease }).combine(
             TransitionEffect.rotate({ z: 1, centerZ: 1, angle: 180 })
             ))
       }
       Image($r('app.media.icon')).width(200).height(200)
         .transition(
-        TransitionEffect.SLIDE
-          .animation({ duration: 2000, curve: Curve.Ease })
-          .combine(
-          TransitionEffect.rotate({ z: 1, centerZ: 1, angle: 180 })
+        TransitionEffect.asymmetric(
+          TransitionEffect.rotate({ z: 1, centerZ: 1, angle: 180 }),
+          TransitionEffect.rotate({ z: 1, centerZ: 1, angle: 90 })
           )
-//          .asymmetric({
-//          appear: TransitionEffect,
-//          disappear: TransitionEffect })
         )
+      Image($r('app.media.icon')).width(200).height(200)
+        .transition(TransitionEffect.SLIDE_SWITCH)
     }.width('100%')
   }
 }
\ No newline at end of file