• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# Window Subsystem Changelog
2
3## cl.pipwindow.1 Default Size of the PiP Window Is Now Fixed at the Actual Size of the Large Window
4
5**Access Level**
6
7Public API
8
9**Reason for Change**
10
11
12The default size of the PiP window previously depends on the size of the window at launch, which can be small or large window size. Resizing the window by double-clicking does not change the actual size of the window, but it changes the scale factor of the window.
13
14For example, if an application renders a custom UI component based on a small window, and then the user double-clicks the window to scale up to a large window, the visual size of the custom UI component does not match the size when PiP is initiated with a large window. To address this, the PiP window size is now fixed to the actual size of the large window, with its size in the small window derived from the large window's actual size through scaling.
15
16**Change Impact**
17
18This change is a non-compatible change.
19
20Before change:
21
22The PiP window uses the actual size regardless of whether it is started in a small or large window. If an application renders a custom UI component based on a small or large window and then the user double-clicks to scale to the other mode, the visual size of the component is different from that in the scenario where PiP is directly started in that mode.
23
24After change:
25
26The PiP window's size is standardized to the default size of the large window, and its size in a small window is obtained by scaling the large window based on system rules. The custom UI component, after being adapted to the large window size, is scaled together with the PiP window when being displayed in the small window.
27
28| Before Change| After Change|
29|---------|---------|
30| ![](figures/pipbefore.jpg) | ![](figures/pipafter.jpg) |
31
32**Start API Level**
33
34API 12
35
36**Change Since**
37
38OpenHarmony SDK 5.0.0.42
39
40**Key API/Component Changes**
41
42Scenarios where **customUIController** in **PiPConfiguration** is used to add a custom component in a PiP window.
43
44**Adaptation Guide**
45
46If your application has adapted the size of custom UI components based on the small window, these components in the small window may be smaller than intended.
47
48Adapt the custom components based on the maximum level (actual size) of the PiP window. The components in other levels will automatically adjust in size along with the scaling of the PiP window.
49
50```ts
51@Builder
52function buildText(params: Params) {
53  Column() {
54    // Before the change, the font size is 20 if the application uses the small window as the baseline.
55    // Text(params.text)
56    //  .fontSize(20)
57    //  .fontColor(Color.Red)
58
59    // After the change, the font size is adapted based on the actual size of the large window and adjusted to a proper value.
60     Text(params.text)
61      .fontSize(38)
62      .fontColor(Color.Red)
63  }
64  .width('100%')
65  .height('100%')
66}
67// customUIController used by the custom UI component.
68class TextNodeController extends NodeController {
69  private message: string;
70  private textNode: BuilderNode<[Params]> | null = null;
71  constructor(message: string) {
72    super();
73    this.message = message;
74  }
75  makeNode(context: UIContext): FrameNode | null {
76    this.textNode = new BuilderNode(context);
77    this.textNode.build(wrapBuilder<[Params]>(buildText), new Params(this.message));
78    return this.textNode.getFrameNode();
79  }
80}
81```
82