ACEcommit

Signed-off-by: Nliu-xu01 <liuxu126@huawei.com>

ace/ace_ets_test/entry/src/main/config.json

@@ -75,7 +75,17 @@
           "pages/Prop",
           "pages/Link",
           "pages/AppStorage",
-          "pages/Video"
+          "pages/Video",
+		  "pages/components/Marquee",
+          "pages/components/Path",
+          "pages/components/PatternLock",
+          "pages/components/Polygon",
+          "pages/components/Polyline",
+          "pages/components/Rect",
+          "pages/components/RichText",
+          "pages/components/Select",
+          "pages/components/Shape",
+          "pages/components/Sidebar"
         ],
         "name": ".MainAbility",
         "window": {

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Marquee.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct MarqueeExample {
+  @State start: boolean = false
+  @State fromStart: boolean = true
+  @State step: number = 50
+  @State loop: number = 3
+  @State src: string = "Running Marquee starts rolling"
+
+  onPageShow() {
+    console.info('marquee page show called');
+  }
+
+  onBuildDone() {
+    console.info('marquee page build done called');
+  }
+
+  build() {
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+      Marquee({
+        start: this.start,
+        step: this.step,
+        loop: this.loop,
+        fromStart: this.fromStart,
+        src: this.src
+      })
+        .fontColor(Color.White)
+        .fontSize(50)
+        .fontSize(50)
+        .allowScale(false)
+        .fontWeight(FontWeight.Bold)
+        .fontFamily("sans-serif")
+        .backgroundColor(Color.Black)
+        .margin({bottom:40})
+        .key('marquee')
+        .onStart(() => {
+          console.log('Marquee animation complete onStart')
+        })
+        .onBounce(() => {
+          console.log('Marquee animation complete onBounce')
+        })
+        .onFinish(() => {
+          console.log('Marquee animation complete onFinish')
+        })
+      Button('start')
+        .onClick(() => {
+          this.start = true
+        })
+        .width(200)
+        .height(60)
+        .margin({bottom:20})
+    }
+    .width('100%')
+    .height('100%')
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Path.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct PathExample {
+  onPageShow() {
+    console.info('path page show called');
+  }
+
+  onBuildDone() {
+    console.info('path page build done called');
+  }
+  build() {
+    Column({ space: 5 }) {
+      Text('Straight line').fontSize(9).fontColor(0xCCCCCC).width('90%')
+      Path().width(300).height(10).commands('M0 0 L900 0').stroke(Color.Black).strokeWidth(3).key('path')
+
+      Text('Straight line graph').fontSize(9).fontColor(0xCCCCCC).width('90%')
+      Flex({ justifyContent: FlexAlign.SpaceAround }) {
+        Path().width(100).height(100).commands('M150 0 L300 300 L0 300 Z').key('path1')
+        Path().width(100).height(100).commands('M0 0 H300 V300 H0 Z').key('path2')
+        Path().width(100).height(100).commands('M150 0 L0 150 L60 300 L240 300 L300 150 Z').key('path3')
+      }.width('100%')
+
+      Text('Curve graphics').fontSize(9).fontColor(0xCCCCCC).width('90%')
+      Flex({ justifyContent: FlexAlign.SpaceAround }) {
+        Path().width(100).height(100).commands("M0 300 S150 0 300 300 Z").key('path4')
+        Path().width(100).height(100).commands('M0 150 C0 150 150 0 300 150 L150 300 Z').key('path5')
+      }
+    }.width('100%').margin({ top: 5 })
+  }
+}

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/PatternLock.ets

+// @ts-nocheck
+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct PatternLockTest {
+  @State passwords: Number[] = [];
+  @State length: number = 200;
+  @State redius: number = 10;
+  @State color1: string = '#DB7093';
+  @State color2: string = '#7B68EE';
+  @State color3: string = '#20B2AA';
+  @State color4: string = '#BDB76B';
+  @State color5: string = '#FF8C00';
+  @State stroke: number= 30;
+  @State isAutoReset: boolean= true;
+  private patternLockController: PatternLockController = new PatternLockController();
+  onPageShow() {
+    console.info('patternLock page show called');
+  }
+
+  onBuildDone() {
+    console.info('patternLock page build done called');
+  }
+  build() {
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+      PatternLock(this.patternLockController)
+        .sideLength(this.length)
+        .circleRadius(this.redius)
+        .backgroundColor(this.color1)
+        .regularColor(this.color2)
+        .selectedColor(this.color3)
+        .activeColor(this.color4)
+        .pathColor(this.color5)
+        .key('patternLock')
+        .pathStrokeWidth(this.stroke)
+        .autoReset(this.isAutoReset)
+        .onPatternComplete((input) => {
+          if (!input) {
+            return;
+          }
+          console.info(input.toString());
+          if (input.Length < 4) {
+            this.patternLockController.reset()
+            return
+          }
+          this.passwords = input;
+        })
+      Text(this.passwords.toString()).fontSize(18).fontColor(0x123A42).margin(15)
+      Flex({ wrap: FlexWrap.Wrap, justifyContent: FlexAlign.SpaceAround, alignItems: ItemAlign.Center, }) {
+        Button('Reset').onClick(() => {
+          this.patternLockController.reset()
+        }).margin(8)
+        Button('sideLength' + this.length).onClick(() => {
+          if (this.length > 500) {
+            this.length = -50
+          } else {
+            this.length += 50
+          }
+        }).margin(8)
+        Button('circleRadius' + this.redius).onClick(() => {
+          if (this.redius > 30) {
+            this.redius = -5
+          } else {
+            this.redius += 5
+          }
+        }).margin(8)
+        Button('pathStrokeWidth' + this.stroke).onClick(() => {
+          if (this.stroke > 30) {
+            this.stroke = -5
+          } else {
+            this.stroke += 5
+          }
+        }).margin(8)
+        Button('autoReset' + this.isAutoReset).onClick(() => {
+          this.isAutoReset = !this.isAutoReset
+        }).margin(8)
+        Button('backgroundColor').onClick(() => {
+          if (this.color1 == '#DB7093') {
+            this.color1 = '#4B0082'
+          } else {
+            this.color1 = '#DB7093'
+          }
+        }).margin(8)
+        Button('regularColor').onClick(() => {
+          if (this.color2 == '#7B68EE') {
+            this.color2 = '#4169E1'
+          } else {
+            this.color2 = '#7B68EE'
+          }
+        }).margin(8)
+        Button('selectedColor').onClick(() => {
+          if (this.color3 == '#20B2AA') {
+            this.color3 = '#32CD32'
+          } else {
+            this.color3 = '#20B2AA'
+          }
+        }).margin(8)
+        Button('activeColor').onClick(() => {
+          if (this.color4 == '#BDB76B') {
+            this.color4 = '#808000'
+          } else {
+            this.color4 = '#BDB76B'
+          }
+        }).margin(8)
+        Button('pathColor').onClick(() => {
+          if (this.color5 == '#FF8C00') {
+            this.color5 = '#FF6347'
+          } else {
+            this.color5 = '#FF8C00'
+          }
+        }).margin(8)
+      }
+    }.width('100%').height('100%')
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Polygon.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct PolygonExample {
+  onPageShow() {
+    console.info('polygon page show called');
+  }
+
+  onBuildDone() {
+    console.info('polygon page build done called');
+  }
+  build() {
+    Column({ space: 5 }) {
+      Flex({ justifyContent: FlexAlign.SpaceAround }) {
+        Polygon({ width: 100, height: 100 }).points([[0, 0], [50, 100], [100, 0]]).key('polygon')
+        Polygon().width(100).height(100).points([[0, 0], [0, 100], [100, 100], [100, 0]]).key('polygon1')
+        Polygon().width(100).height(100).points([[50, 0], [0, 50], [20, 100], [80, 100], [100, 50]]).key('polygon2')
+      }.width('100%')
+    }.margin({ top: 5 })
+  }
+}

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Polyline.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct PolylineExample {
+  onPageShow() {
+    console.info('polyline page show called');
+  }
+
+  onBuildDone() {
+    console.info('polyline page build done called');
+  }
+  build() {
+    Column({ space: 5 }) {
+      Flex({ justifyContent: FlexAlign.SpaceAround }) {
+        Polyline({ width: 100, height: 100 }).points([[0, 0], [20, 60], [100, 100]]).key('polyline')
+        Polyline().width(100).height(100).points([[0, 0], [0, 100], [100, 100]]).key('polyline1')
+      }.width('100%')
+    }.margin({ top: 5 })
+  }
+}

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Rect.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct RectExample {
+  onPageShow() {
+    console.info('rect page show called');
+  }
+
+  onBuildDone() {
+    console.info('rect page build done called');
+  }
+  build() {
+    Column({ space: 5 }) {
+      Text('normal').fontSize(9).fontColor(0xCCCCCC).width('90%')
+      Rect({ width: '90%', height: 50 })
+      Rect().width('90%').height(50)
+
+      Text('with rounded corners').fontSize(9).fontColor(0xCCCCCC).width('90%')
+      Rect({ width: '90%', height: 50 }).radiusHeight(20).radiusWidth(20)
+      Rect({ width: '90%', height: 50 }).radius(20)
+    }.width('100%').margin({ top: 5 })
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/RichText.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct richTextTest {
+  @State data: string= "<div class=\"item-title\"><h1>文本测试(h1测试)</h1></div>"
+  onPageShow() {
+    console.info('richText page show called');
+  }
+
+  onBuildDone() {
+    console.info('richText page build done called');
+  }
+  build() {
+    Column() {
+      RichText(this.data)
+        .key('richText')
+        .onStart(() => {
+          console.info("RichText onStart")
+        })
+        .onComplete(() => {
+          console.info("RichText onComplete")
+        })
+    }.width('100%').height('100%')
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Select.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct SlelectExample {
+
+  onPageShow() {
+    console.info('select page show called');
+  }
+
+  onBuildDone() {
+    console.info('select page build done called');
+  }
+
+  build() {
+    Column() {
+      Select([{value:'aaa',icon: "/common/1.png"},
+              {value:'bbb',icon: "/common/2.png"},
+              {value:'ccc',icon: "/common/3.png"},
+              {value:'ddd',icon: "/common/4.png"}])
+        .selected(2)
+        .value('TTT')
+        .font({size: 30, weight:400, family: 'serif', style: FontStyle.Normal })
+        .selectedOptionFont({size: 40, weight: 500, family: 'serif', style: FontStyle.Normal })
+        .optionFont({size: 30, weight: 400, family: 'serif', style: FontStyle.Normal })
+        .fontColor(0x317aff)
+        .optionBgColor(0xFFFFFF)
+        .optionFontColor(0x000000)
+        .selectedOptionBgColor(0xCCCCCC)
+        .selectedOptionFontColor(0x000000)
+        .key('select')
+        .onSelected((index:number)=>{
+          console.info("Select:" + index)
+        })
+    }
+
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Shape.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct ShapeExample {
+  onPageShow() {
+    console.info('shape page show called');
+  }
+
+  onBuildDone() {
+    console.info('shape page build done called');
+  }
+  build() {
+    Column({ space: 5 }) {
+      Text('basic').fontSize(30).fontColor(0xCCCCCC).width(320)
+      Shape() {
+        Rect().width(300).height(50)
+        Ellipse().width(300).height(50).offset({ x: 0, y: 60 })
+        Path().width(300).height(10).commands('M0 0 L900 0').offset({ x: 0, y: 120 })
+      }
+      .viewPort({ x: -2, y: -2, width: 304, height: 130 })
+      .fill(0x317Af7).stroke(Color.Black).strokeWidth(4)
+      .strokeDashArray([20]).strokeDashOffset(10).strokeLineCap(LineCapStyle.Round)
+      .strokeLineJoin(LineJoinStyle.Round).antiAlias(true)
+      Shape() {
+        Rect().width(300).height(50)
+      }.viewPort({ x: -1, y: -1, width: 302, height: 52 }).fill(0x317Af7).stroke(Color.Black).strokeWidth(2)
+
+      Text('border').fontSize(30).fontColor(0xCCCCCC).width(320).margin({top:30})
+      Shape() {
+        Path().width(300).height(10).commands('M0 0 L900 0')
+      }.viewPort({ x: 0, y: -5, width: 300, height: 20 }).stroke(0xEE8443).strokeWidth(10).strokeDashArray([20])
+      Shape() {
+        Path().width(300).height(10).commands('M0 0 L900 0')
+      }
+      .viewPort({ x: 0, y: -5, width: 300, height: 20 })
+      .stroke(0xEE8443).strokeWidth(10).strokeDashArray([20]).strokeDashOffset(10)
+      Shape() {
+        Path().width(300).height(10).commands('M0 0 L900 0')
+      }.viewPort({ x: 0, y: -5, width: 300, height: 20 }).stroke(0xEE8443).strokeWidth(10).strokeOpacity(0.5)
+      Shape() {
+        Path().width(300).height(10).commands('M0 0 L900 0')
+      }
+      .viewPort({ x: 0, y: -5, width: 300, height: 20 })
+      .stroke(0xEE8443).strokeWidth(10).strokeDashArray([20]).strokeLineCap(LineCapStyle.Round)
+      Shape() {
+        Rect().width(300).height(100)
+      }
+      .viewPort({ x: -5, y: -5, width: 310, height: 120 })
+      .fill(0x317Af7).stroke(0xEE8443).strokeWidth(10).strokeLineJoin(LineJoinStyle.Round)
+      Shape() {
+        Path().width(300).height(60).commands('M0 0 L400 0 L400 200 Z')
+      }
+      .viewPort({ x: -80, y: -5, width: 310, height: 100 })
+      .fill(0x317Af7).stroke(0xEE8443).strokeWidth(10).fillOpacity(1)
+      .strokeLineJoin(LineJoinStyle.Miter).strokeMiterLimit(5)
+    }.width('100%').margin({ top: 15 })
+  }
+}
\ No newline at end of file

ace/ace_ets_test/entry/src/main/ets/MainAbility/pages/components/Sidebar.ets

+// @ts-nocheck
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct SideBarContainerTest {
+  @State text: String = ''
+  onPageShow() {
+    console.info('sideBar page show called');
+  }
+
+  onBuildDone() {
+    console.info('sideBar page build done called');
+  }
+  build() {
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+      SideBarContainer({ showSideBarContainer: true, style: SideBarContainerStyle.Embed }) {
+        Column() {
+          Button('One')
+            .onClick(() => {
+              console.info('click one')
+              this.text = 'one click'
+            })
+          Button('Two')
+            .onClick(() => {
+              console.info('click two')
+              this.text = 'two click'
+            })
+          Button('Three')
+            .onClick(() => {
+              console.info('click three')
+              this.text = 'three click'
+            })
+          Button('Four')
+            .onClick(() => {
+              console.info('click four')
+              this.text = 'four click'
+            })
+          Text(this.text)
+        }
+
+        RowSplit() {
+          Column() {
+            Text('Split page one')
+          }
+
+          Column() {
+            Text('Split page two')
+          }
+        }
+      }
+      .showControlButton(true)
+      .sideBarWidth(240)
+      .minSideBarWidth(210)
+      .maxSideBarWidth(260)
+      .key('sidebar')
+      .onChange((value: boolean) => {
+        console.info('status' + value)
+      })
+
+      SideBarContainer({
+        showSideBarContainer: true,
+        style: SideBarContainerStyle.Overlay,
+        buttonAttr: ({
+          left: 12,
+          top: 12,
+          width: 12,
+          height: 12,
+          icon: "/common/1.png"
+        })
+      }) {
+        Column() {
+          Button('One')
+            .onClick(() => {
+              console.info('click one')
+              this.text = 'one click'
+            })
+          Button('Two')
+            .onClick(() => {
+              console.info('click two')
+              this.text = 'two click'
+            })
+          Button('Three')
+            .onClick(() => {
+              console.info('click three')
+              this.text = 'three click'
+            })
+          Button('Four')
+            .onClick(() => {
+              console.info('click four')
+              this.text = 'four click'
+            })
+          Text(this.text)
+        }
+
+        RowSplit() {
+          Column() {
+            Text('Split page one')
+          }
+
+          Column() {
+            Text('Split page two')
+          }
+        }
+      }
+      .showControlButton(true)
+      .sideBarWidth(240)
+      .minSideBarWidth(210)
+      .maxSideBarWidth(260)
+      .key('sidebar1')
+      .onChange((value: boolean) => {
+        console.info('status' + value)
+      })
+    }
+  }
+}