Free Multi-Window Size Acquisition, Custom Keyboard Screen Recording Prevention, Foldable Screen Width

#harmonyosnext

[Daily HarmonyOS Next Knowledge] Free Multi-Window Size Acquisition, Custom Keyboard Screen Recording Prevention, Foldable Screen Width, Tablet Free Multi-Window Activation, App Floating Button

1. Does HarmonyOS have a method to monitor and obtain the size (width and height) of a window in free multi-window mode?

For monitoring application window changes, refer to:

https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-window.md#onwindowstatuschange11

2. What is the solution for preventing screen recording of custom keyboards in HarmonyOS?

In project development, a custom keyboard is used. There is a security compliance requirement to ensure that the custom keyboard (or specified UI components) are not recorded in screen recordings. Is there a provided solution to prevent screen recording?

Currently, there is no component-level screen recording prevention solution. Screen recording and screenshot prevention can only be achieved by setting privacy mode for specific windows. This configuration applies to the current window. Reference: https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-window-V5#setwindowprivacymode9

setWindowPrivacyMode(isPrivacyMode: boolean, callback: AsyncCallback<void>): void

Sets whether the window is in privacy mode, using an asynchronous callback. The content of a window set to privacy mode cannot be screenshotted or screen recorded. This API is suitable for scenarios requiring screenshot/screen recording prohibition.

Parameter Name	Type	Required	Description
isPrivacyMode	boolean	Yes	Whether the window is in privacy mode. `true` enables the mode; `false` disables it.
callback	AsyncCallback	Yes	The callback function.

3. Why is the screen width incorrectly obtained when the foldable screen in HarmonyOS switches between folded and unfolded states?

The foldstatus monitoring notifies changes in the fold state. When the fold/unfold process exceeds the half-fold threshold, foldstatus updates. After foldstatus changes, the screen must be notified to update its width/height and foldable display mode.

display.on(foldstatus) notifies foldstatus changes, but querying foldstatus in real-time during fold/unfold (before the process completes) returns old values, which are meaningless.
display.on(change) monitors screen property changes, triggered after property updates, but does not distinguish the cause of the change.
display.on(folddisplaymode) monitors screen display mode changes, notifying after the fold/unfold display mode switches. Reading screen properties in this callback returns data after the fold/unfold process completes.

4. How to enable free multi-window mode on MatePad devices in HarmonyOS?

Reference document: https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/multi-faq-V5#%E5%A6%82%E4%BD%95%E5%BC%80%E5%90%AF%E8%87%AA%E7%94%B1%E7%AA%97%E5%8F%A3

The free window feature is disabled by default. Enable it as follows:

# Extract the window configuration file and modify <decor enable="false"></decor> to <decor enable="true"></decor>
hdc file recv system/etc/window/resources/window_manager_config.xml ./
# Remount the root directory in read-write mode and update the configuration file
hdc shell mount -o rw,remount /
hdc file send window_manager_config.xml system/etc/window/resources/window_manager_config.xml
# Reboot the device for the configuration to take effect
hdc shell reboot

When the screen is small and finger operations are inconvenient, connect an external mouse:

Hover the mouse over the app's top to summon the window toolbar.
Click the zoom button (second from the left) in the window toolbar to display the app in free window mode.
In free window mode, drag the window's border or corner to resize it, triggering app display refresh.

5. What is the development solution for floating buttons within a HarmonyOS app?

The app requires a floating control (without requesting system floating window permissions) that remains visible across internal pages, enabling quick navigation to specified locations when clicked. Competitors implement this by adding floating controls to each page in baseActivity, creating the illusion of cross-page floating. HarmonyOS documentation on floating windows does not seem suitable for this scenario. Implementing cross-page floating via per-page controls is complex due to the lack of inheritance between pages. How to best achieve this in HarmonyOS?

Use createSubWindow to set a sub-window for floating control functionality. Reference: https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/application-window-stage-V5#%E8%AE%BE%E7%BD%AE%E5%BA%94%E7%94%A8%E5%AD%90%E7%AA%97%E5%8F%A3

Create an app sub-window: Use the createSubWindow API.
Set sub-window properties: Modify size, position, background color, brightness, etc.
Load and display sub-window content: Use setUIContent and showWindow.
Destroy the sub-window: Use destroyWindow when no longer needed.

Example code for creating a sub-window in onWindowStageCreate:

import { UIAbility } from '@kit.AbilityKit';
import { window } from '@kit.ArkUI';
import { BusinessError } from '@kit.BasicServicesKit';


let windowStage_: window.WindowStage | null = null;
let sub_windowClass: window.Window | null = null;


export default class EntryAbility extends UIAbility {
  showSubWindow() {
    // 1. Create an app sub-window.
    if (windowStage_ == null) {
      console.error('Failed to create the subwindow. Cause: windowStage_ is null');
    }
    else {
      windowStage_.createSubWindow("mySubWindow", (err: BusinessError, data) => {
        let errCode: number = err.code;
        if (errCode) {
          console.error('Failed to create the subwindow. Cause: ' + JSON.stringify(err));
          return;
        }
        sub_windowClass = data;
        console.info('Succeeded in creating the subwindow. Data: ' + JSON.stringify(data));
        // 2. Set the sub-window's position, size, and properties after creation.
        sub_windowClass.moveWindowTo(300, 300, (err: BusinessError) => {
          let errCode: number = err.code;
          if (errCode) {
            console.error('Failed to move the window. Cause:' + JSON.stringify(err));
            return;
          }
          console.info('Succeeded in moving the window.');
        });
        sub_windowClass.resize(500, 500, (err: BusinessError) => {
          let errCode: number = err.code;
          if (errCode) {
            console.error('Failed to change the window size. Cause:' + JSON.stringify(err));
            return;
          }
          console.info('Succeeded in changing the window size.');
        });
        // 3. Load the target page for the sub-window.
        sub_windowClass.setUIContent("pages/page3", (err: BusinessError) => {
          let errCode: number = err.code;
          if (errCode) {
            console.error('Failed to load the content. Cause:' + JSON.stringify(err));
            return;
          }
          console.info('Succeeded in loading the content.');
          // 3. Show the sub-window.
          (sub_windowClass as window.Window).showWindow((err: BusinessError) => {
            let errCode: number = err.code;
            if (errCode) {
              console.error('Failed to show the window. Cause: ' + JSON.stringify(err));
              return;
            }
            console.info('Succeeded in showing the window.');
          });
        });
      })
    }
  }


  destroySubWindow() {
    // 4. Destroy the sub-window when no longer needed.
    (sub_windowClass as window.Window).destroyWindow((err: BusinessError) => {
      let errCode: number = err.code;
      if (errCode) {
        console.error('Failed to destroy the window. Cause: ' + JSON.stringify(err));
        return;
      }
      console.info('Succeeded in destroying the window.');
    });
  }


  onWindowStageCreate(windowStage: window.WindowStage) {
    windowStage_ = windowStage;
    // Create the sub-window at an appropriate time (e.g., on a main window button click).
    // Calling it in onWindowStageCreate is for demonstration only.
    this.showSubWindow();
  }


  onWindowStageDestroy() {
    // Destroy the sub-window at an appropriate time (e.g., on a sub-window close button click).
    // Calling it in onWindowStageDestroy is for demonstration only.
    this.destroySubWindow();
  }
};

DEV Community