@react-native-ohos/react-native-context-menu-view 1.19.1-rc.1 → 1.19.1-rc.2

package/README.md

@@ -1,6 +1,6 @@
 # @react-native-ohos/react-native-context-menu-view
 
-This project is based on [react-native-context-menu-view](https://github.com/mpiannucci/react-native-context-menu-view/tree/v1.19.0)
+This project is based on [react-native-context-menu-view@v1.19.0](https://github.com/mpiannucci/react-native-context-menu-view/tree/v1.19.0)
 
 ## Documentation
 

package/harmony/context_menu/oh-package.json5

@@ -2,7 +2,7 @@
   license: 'ISC',
   types: '',
   name: "@react-native-ohos/react-native-context-menu-view",
-  version: '1.19.1-rc.1',
+  version: '1.19.1-rc.2',
   description: '',
   main: 'index.ets',
   type: 'module',

package/harmony/context_menu/src/main/ets/ContextMenuLongPress.ets

@@ -27,6 +27,7 @@ import Logger from './Logger';
 import { SymbolGlyphModifier } from '@kit.ArkUI';
 import { ContextMenuTwoMenu } from './ContextMenuTwoMenu';
 import { ContextMenuTwoMenuWithNoSelect } from './ContextMenuTwoMenuWithNoSelect';
+import { writeResult } from './ContextMenuTurboModule';
 
 //这里的属性类型要和ContextMenuTurboModule.ets下的ContextMenuProps一致
 interface ContextMenuProps {
@@ -384,7 +385,11 @@ export struct ContextMenuLongPress {
           }
         })
       }.backgroundColor('white')
-    }.onDisAppear(() => {
+    }
+    .onSizeChange((oldValue: SizeOptions, newValue: SizeOptions) => {
+      writeResult(newValue.width, newValue.height)
+    })
+    .onDisAppear(() => {
       this.menuCtx.rnInstance.postMessageToCpp('contextMenu::onCancel', {
         itemTag: this.menuTag,
       });

package/harmony/context_menu/src/main/ets/ContextMenuLongPressWithNoSelect.ets

@@ -27,6 +27,7 @@ import Logger from './Logger';
 import { SymbolGlyphModifier } from '@kit.ArkUI';
 import { ContextMenuTwoMenu } from './ContextMenuTwoMenu';
 import { ContextMenuTwoMenuWithNoSelect } from './ContextMenuTwoMenuWithNoSelect';
+import { writeResult } from './ContextMenuTurboModule';
 
 //这里的属性类型要和ContextMenuTurboModule.ets下的ContextMenuProps一致
 interface ContextMenuProps {
@@ -366,7 +367,11 @@ export struct ContextMenuLongPressWithNoSelect {
           }
         })
       }.backgroundColor('white')
-    }.onDisAppear(() => {
+    }
+    .onSizeChange((oldValue: SizeOptions, newValue: SizeOptions) => {
+      writeResult(newValue.width, newValue.height)
+    })
+    .onDisAppear(() => {
       this.menuCtx.rnInstance.postMessageToCpp('contextMenu::onCancel', {
         itemTag: this.menuTag,
       });

package/harmony/context_menu/src/main/ets/ContextMenuTurboModule.ets

@@ -41,6 +41,43 @@ function buildContextMenuWithNoSelect(realViewPoint: ESObject) {
 }
 
 
+let uiContext = null;
+let promptAction = null;
+let contentNode = null;
+
+let realViewPointX = 0;
+let realViewPointY = 0;
+let windowWidth: number = 0;
+let windowHeight: number = 0;
+
+export function writeResult(width: Length, height: Length) {
+  try {
+    let x = realViewPointX + (width as number);
+    let y = realViewPointY + (height as number);
+
+    if (x > windowWidth) {
+      realViewPointX = realViewPointX - (x - windowWidth) - 10;
+    }
+    if (y > windowHeight) {
+      realViewPointY = realViewPointY - (y - windowHeight) - 10;
+    }
+
+    promptAction?.openCustomDialog(contentNode, {
+      alignment: DialogAlignment.TopStart,
+      offset: {
+        dx: realViewPointX,
+        dy: realViewPointY,
+      }
+    })
+    this.menuHeight = 0;
+    this.ctx.rnInstance.cppEventEmitter.subscribe("RNGH::CLOSE_MENU", () => {
+      promptAction?.closeCustomDialog(contentNode);
+    })
+  } catch (error) {
+    console.error(`eroor`);
+  }
+}
+
 export interface ContextMenuProps {
   tag?: number;
   width?: number;
@@ -120,6 +157,9 @@ export class ContextMenuTurboModule extends TurboModule {
             this.romWidth = e.touchableViews[0].width;
             this.realViewPoint.romHeight = e.touchableViews[0].height;
             this.romHeight = e.touchableViews[0].height;
+
+            windowWidth = this.romWidth;
+            windowHeight = this.romHeight;
             break;
           case 2:
             //isCancel = true; move x1-x > 150 移动判断  y1-y >200
@@ -142,6 +182,9 @@ export class ContextMenuTurboModule extends TurboModule {
               this.windowX = e.touchPoints[0].windowX;
               this.realViewPoint.windowY = e.touchPoints[0].windowY;
               this.windowY = e.touchPoints[0].windowY;
+
+              realViewPointX = this.windowX;
+              realViewPointY = this.windowY;
               this.realViewPoint.touchViewActions = e.touchViewActions;
               let selectedActions: ESObject = e.touchViewActions;
               if (!this.longPressLock) {
@@ -197,6 +240,10 @@ export class ContextMenuTurboModule extends TurboModule {
               this.windowX = e.touchPoints[0].windowX;
               this.realViewPoint.windowY = e.touchPoints[0].windowY;
               this.windowY = e.touchPoints[0].windowY;
+
+              realViewPointX = this.windowX;
+              realViewPointY = this.windowY;
+
               //此处获取actions值
               this.realViewPoint.touchViewActions = e.touchViewActions;
               //当获取到了view视图,并且dropdownMenuMode为true的时候,进入单点效果.
@@ -244,54 +291,18 @@ export class ContextMenuTurboModule extends TurboModule {
   onTouch(realViewPoint: Object) {
     window.getLastWindow(this.ctx.uiAbilityContext)
       .then((value) => {
-        const uiContext = value.getUIContext()
-        const promptAction = uiContext?.getPromptAction();
-        const contentNode = new ComponentContent(uiContext!, wrapBuilder(buildContextMenu), realViewPoint);
-        let offDx = -this.romWidth / 2 + this.windowX + this.width / 2;
-        let OffDy = -this.romHeight / 2 + this.windowY + this.height * 0.4 + 48 * this.menuHeight;
-        try {
-          promptAction?.openCustomDialog(contentNode, {
-            offset: {
-              dx: offDx,
-              dy: OffDy,
-            }
-          })
-          this.menuHeight = 0;
-          this.ctx.rnInstance.cppEventEmitter.subscribe("RNGH::CLOSE_MENU", () => {
-            promptAction?.closeCustomDialog(contentNode);
-            offDx = 0;
-            OffDy = 0;
-          })
-        } catch (error) {
-          console.error(`eroor`);
-        }
+        uiContext = value.getUIContext()
+        promptAction = uiContext?.getPromptAction();
+        contentNode = new ComponentContent(uiContext!, wrapBuilder(buildContextMenu), realViewPoint);
       })
   }
 
   onTouchWithNoSelect(realViewPoint: Object) {
     window.getLastWindow(this.ctx.uiAbilityContext)
       .then((value) => {
-        const uiContext = value.getUIContext()
-        const promptAction = uiContext?.getPromptAction();
-        const contentNode = new ComponentContent(uiContext!, wrapBuilder(buildContextMenuWithNoSelect), realViewPoint);
-        let offDx = -this.romWidth / 2 + this.windowX + this.width / 2;
-        let OffDy = -this.romHeight / 2 + this.windowY + this.height * 0.4 + 48 * this.menuHeight;
-        try {
-          promptAction?.openCustomDialog(contentNode, {
-            offset: {
-              dx: offDx,
-              dy: OffDy,
-            }
-          })
-          this.menuHeight = 0;
-          this.ctx.rnInstance.cppEventEmitter.subscribe("RNGH::CLOSE_MENU", () => {
-            promptAction?.closeCustomDialog(contentNode);
-            offDx = 0;
-            OffDy = 0;
-          })
-        } catch (error) {
-          console.error(`eroor`);
-        }
+        uiContext = value.getUIContext()
+        promptAction = uiContext?.getPromptAction();
+        contentNode = new ComponentContent(uiContext!, wrapBuilder(buildContextMenuWithNoSelect), realViewPoint);
       })
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-ohos/react-native-context-menu-view",
-  "version": "1.19.1-rc.1",
+  "version": "1.19.1-rc.2",
   "description": "Use native context menu views from React Native",
   "main": "index.js",
   "types": "index.d.ts",
@@ -22,13 +22,13 @@
     "android",
     "harmony"
   ],
-  "repository": "https://github.com/<your_github_handle>/rtn-centered-text",
+  "repository": "https://github.com/react-native-oh-library/react-native-context-menu-view",
   "author": "<Your Name> <your_email@your_provider.com> (https://github.com/<your_github_handle>)",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/<your_github_handle>/rtn-centered-text/issues"
+    "url": "https://github.com/react-native-oh-library/react-native-context-menu-view/issues"
   },
-  "homepage": "https://github.com/<your_github_handle>/rtn-centered-text#readme",
+  "homepage": "https://github.com/react-native-oh-library/react-native-context-menu-view/tree/br_rnoh0.77#readme",
   "peerDependencies": {
     "react": "*",
     "react-native": "*"