1/* 2 * Copyright (c) 2021 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16exports.source = ` 17@Entry 18@Component 19struct CompA { 20 size: number = 100; 21 @State customPopupArrow: boolean = false 22 @Builder SquareText(label: string){ 23 Text(label) 24 .width(1 * this.size) 25 .height(1 * this.size) 26 } 27@Builder RowOfSquareTexts (label1: string, label2: string){ 28 Row(){ 29 this.SquareText(label1) 30 this.SquareText(label2) 31 } 32 .width(1 * this.size) 33 .height(1 * this.size) 34} 35 36@Builder popupBuilder() { 37 Flex({direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItem: ItemAlign.Center}){ 38 Text('Content of CustomPopup') 39 .fontSize(20) 40 } 41 .width(100) 42 .height(50) 43} 44 45 build(){ 46 Column(){ 47 Row(){ 48 this.SquareText("A") 49 this.SquareText("B") 50 } 51 .width(2 * this.size) 52 .height(1 * this.size) 53 .bindPopup(this.customPopupArrow, { 54 builder: this.popupBuilder, 55 placement: Placement.Bottom, 56 maskColor: 0x01000000, 57 popupColor: Color.Red, 58 enableArrow: true, 59 onStateChange: (e) => { 60 if(!e.isVisible){ 61 this.customPopupArrow = false 62 } 63 } 64 }) 65 this.RowOfSquareTexts("C", "D") 66 } 67 .width(2 * this.size) 68 .height(2 * this.size) 69 } 70}` 71 72exports.expectResult = 73`"use strict"; 74class CompA extends View { 75 constructor(compilerAssignedUniqueChildId, parent, params) { 76 super(compilerAssignedUniqueChildId, parent); 77 this.size = 100; 78 this.__customPopupArrow = new ObservedPropertySimple(false, this, "customPopupArrow"); 79 this.updateWithValueParams(params); 80 } 81 updateWithValueParams(params) { 82 if (params.size !== undefined) { 83 this.size = params.size; 84 } 85 if (params.customPopupArrow !== undefined) { 86 this.customPopupArrow = params.customPopupArrow; 87 } 88 } 89 aboutToBeDeleted() { 90 this.__customPopupArrow.aboutToBeDeleted(); 91 SubscriberManager.Get().delete(this.id()); 92 } 93 get customPopupArrow() { 94 return this.__customPopupArrow.get(); 95 } 96 set customPopupArrow(newValue) { 97 this.__customPopupArrow.set(newValue); 98 } 99 SquareText(label) { 100 Text.create(label); 101 Text.width(1 * this.size); 102 Text.height(1 * this.size); 103 Text.pop(); 104 } 105 RowOfSquareTexts(label1, label2) { 106 Row.create(); 107 Row.width(1 * this.size); 108 Row.height(1 * this.size); 109 this.SquareText(label1); 110 this.SquareText(label2); 111 Row.pop(); 112 } 113 popupBuilder() { 114 Flex.create({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItem: ItemAlign.Center }); 115 Flex.width(100); 116 Flex.height(50); 117 Text.create('Content of CustomPopup'); 118 Text.fontSize(20); 119 Text.pop(); 120 Flex.pop(); 121 } 122 render() { 123 Column.create(); 124 Column.width(2 * this.size); 125 Column.height(2 * this.size); 126 Row.create(); 127 Row.width(2 * this.size); 128 Row.height(1 * this.size); 129 Row.bindPopup(this.customPopupArrow, { 130 builder: { builder: this.popupBuilder.bind(this) }, 131 placement: Placement.Bottom, 132 maskColor: 0x01000000, 133 popupColor: Color.Red, 134 enableArrow: true, 135 onStateChange: (e) => { 136 if (!e.isVisible) { 137 this.customPopupArrow = false; 138 } 139 } 140 }); 141 this.SquareText("A"); 142 this.SquareText("B"); 143 Row.pop(); 144 this.RowOfSquareTexts("C", "D"); 145 Column.pop(); 146 } 147} 148loadDocument(new CompA("1", undefined, {})); 149` 150