!1783 [XTS子系统]js测试用例申请提交合入

Merge pull request !1783 from bayanxing/master

OAT.xml

@@ -53,6 +53,12 @@ Note:If the text contains special characters, please escape them according to th
 -->
 <configuration>
     <oatconfig>
+        <licensefile></licensefile>
+        <policylist>
+            <policy name="projectPolicy" desc="">
+                <policyitem type="copyright" name="Copyright (c) 2022 Shenzhen Kaihong Digital" path=".*" rule="may" group="defaultGroup" filefilter="copyrightPolicyFilter" desc=""/>
+            </policy>
+        </policylist>
         <filefilterlist>
             <filefilter name="binaryFileTypePolicyFilter" desc="Filters for binaryFile" >
                 <filteritem type="filename" name="*.jpg" desc="all jpg file have check "/>

ace/ace_standard/Test.json

@@ -2,9 +2,9 @@
     "description": "Configuration for aceceshi Tests",
     "driver": {
         "type": "JSUnitTest",
-        "test-timeout": "60000",
+        "test-timeout": "80000",
         "package": "com.example.aceceshi",
-        "shell-timeout": "60000"
+        "shell-timeout": "80000"
     },
     "kits": [
         {

ace/ace_standard/src/main/config.json

@@ -55,7 +55,17 @@
           "pages/button/index",
           "pages/chart/index",
           "pages/input/index",
-          "pages/slider/index"
+          "pages/slider/index",
+          "pages/text/index",
+          "pages/divider/index",
+          "pages/image/index",
+          "pages/label/index",
+          "pages/rating/index",
+          "pages/search/index",
+          "pages/toolbar/index",
+          "pages/textarea/index",
+          "pages/menu/index",
+          "pages/search/index"
         ],
         "name": "default",
         "window": {

ace/ace_standard/src/main/js/default/pages/divider/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+/* xxx.css */
+.container {
+    margin: 20px;
+    flex-direction:column;
+    width:100%;
+    height:100%;
+}
+
+.title{
+    font-size: 16px;
+    margin: 2px;
+    padding: 2px;
+    color: grey;
+    font-weight: bold;
+    text-align: center;
+}
+
+.divider1{
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 10px;
+    padding-top: 20px;
+    padding-right: 15px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 5px;
+    border-right-width: 10px;
+    border-top-width: 15px;
+    border-bottom-width: 20px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(pink,#fff000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+}
+
+.divider2{
+    width: 50px;
+    height: 100px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+.divider3{
+    width: 100px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+.divider4{
+    width: 150px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 2px solid #000000;
+}
+
+.contain1{
+    width: 150px;
+    height: 70px;
+    flex-direction: column;
+}
+
+.divider5{
+    width: 120px;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+.divider6{
+    width: 120px;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+.divider7 {
+    margin-bottom: 50px;
+    margin-top: 10px;
+    color: green;
+    stroke-width: 30px;
+    line-cap: round;
+}

ace/ace_standard/src/main/js/default/pages/divider/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <text  class="title">
+        divider通用样式1
+    </text>
+    <divider class="divider1" vertical="false">
+    </divider>
+    <text  class="title">
+        divider通用样式2
+    </text>
+    <divider class="divider2" vertical="true">
+    </divider>
+    <text  class="title">
+        divider通用样式3
+    </text>
+    <divider class="divider3" vertical="false">
+    </divider>
+    <text  class="title">
+        divider通用样式4
+    </text>
+    <divider class="divider4" vertical="false">
+    </divider>
+    <text  class="title">
+        divider通用样式5
+    </text>
+    <div class="contain1">
+        <divider class="divider5" vertical="false">
+        </divider>
+        <divider class="divider6" vertical="false">
+        </divider>
+    </div>
+    <text  class="title">
+        divider特有样式
+    </text>
+    <divider class="divider7" vertical="false">
+    </divider>
+</div>

ace/ace_standard/src/main/js/default/pages/divider/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+  data: {
+    title: 'World'
+  }
+}

ace/ace_standard/src/main/js/default/pages/image/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+.container {
+    flex-direction: column; /* 设置容器内的项目纵向排列 */
+    justify-content: center; /* 设置项目位于容器主轴的中心 */
+    align-items: center; /* 项目在交叉轴居中 */
+    width:100%;
+    height:100%;
+}
+
+
+#one {
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 10px;
+    padding-top: 20px;
+    padding-right: 15px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 5px;
+    border-right-width: 10px;
+    border-top-width: 15px;
+    border-bottom-width: 20px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(pink,#fff000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+}
+
+#two{
+    width: 100px;
+    height: 150px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+#three{
+    width: 100px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+#four{
+    width: 150px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 1px solid #000000;
+}
+
+.contain1{
+    width: 150px;
+    height: 70px;
+    flex-direction: column;
+}
+
+#five {
+    width: 120px;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+#six{
+    width: 120px;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+#seven{
+    object-fit:cover;
+    match-text-direction:true;
+    fit-original-size:true;
+    object-position:left;
+    margin-top: 15px;
+    margin-bottom: 15px;
+}

ace/ace_standard/src/main/js/default/pages/image/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <!--  通用样式1  -->
+    <image  id="one"
+            class="pic"
+            ref="img1"
+            focusable="true"
+            disabled="false"
+            src="common/images/image.png"
+            alt="common/images/image.png"
+            >
+    </image>
+    <!--  通用样式2  -->
+    <image  id="two"
+            class="pic"
+            ref="img2"
+            focusable="true"
+            disabled="false"
+            src="common/images/image.png"
+            alt="common/images/image.png"
+            >
+    </image>
+    <!--  通用样式3  -->
+    <image  id="three"
+            class="pic"
+            focusable="true"
+            disabled="false"
+            src="common/images/image.png"
+            alt="common/images/image.png"
+            >
+    </image>
+    <!--  通用样式4  -->
+    <image  id="four"
+            class="pic"
+            focusable="true"
+            disabled="false"
+            src="common/images/image.png"
+            alt="common/images/image.png"
+            >
+    </image>
+    <!--  通用样式5\6  -->
+    <div class="contain1">
+        <image  id="five"
+                class="pic"
+                focusable="true"
+                disabled="false"
+                src="common/images/image.png"
+                alt="common/images/image.png"
+                >
+        </image>
+        <image  id="six"
+                class="pic"
+                focusable="true"
+                disabled="false"
+                src="common/images/image.png"
+                alt="common/images/image.png"
+                >
+        </image>
+    </div>
+    <!--  特有样式  -->
+    <image  id="seven"
+            class="pic"
+            focusable="true"
+            disabled="false"
+            src="common/images/image.png"
+            alt="common/images/image.png"
+            >
+    </image>
+</div>

ace/ace_standard/src/main/js/default/pages/image/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+
+}
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/label/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+/*xxx.css */
+.container {
+    flex-direction: column;
+    align-items: center;
+}
+
+.row {
+    flex-direction: row;
+    justify-content: space-between;
+    width: 100%;
+}
+
+.label {
+    width: 200px;
+    margin-top: 50px;
+    margin-left: 10px;
+}
+
+.input {
+    margin-top: 50px;
+    margin-right: 20px;
+}

ace/ace_standard/src/main/js/default/pages/label/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <div class="row">
+        <label id="label" class="label" target="textId">input</label>
+        <input class="input" id="textId" type="text"></input>
+    </div>
+    <div class="row">
+        <label class="label" target="radioId">radio</label>
+        <input class="input" id="radioId" type="radio" name="group" value="group"></input>
+    </div>
+    <div class="row">
+        <label class="label" target="checkboxId">checkbox</label>
+        <input class="input" id="checkboxId" type="checkbox"></input>
+    </div>
+</div>

ace/ace_standard/src/main/js/default/pages/label/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+  data: {
+    title: 'World'
+  }
+}

ace/ace_standard/src/main/js/default/pages/menu/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+.container {
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: center;
+}
+
+.menu1{
+    text-color:red;
+    font-size:20px;
+    allow-scale:true;
+    letter-spacing:5px;
+    font-style:normal;
+    font-weight:200;
+    font-family:sans-serif;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 10px;
+    padding-top: 20px;
+    padding-right: 15px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+}
+
+.menu2{
+    text-color:yellow;
+    font-size:20px;
+    allow-scale:false;
+    letter-spacing:5px;
+    font-style:italic;
+    font-weight:300;
+    font-family:sans-serif;
+    margin: 20px;
+}
+
+.menu3{
+    text-color:beige;
+    font-size:20px;
+    allow-scale:true;
+    letter-spacing:5px;
+    font-style:normal;
+    font-weight:200;
+    font-family:sans-serif;
+    margin: 20px;
+}
+
+.menu4{
+    text-color:aqua;
+    font-size:20px;
+    allow-scale:false;
+    letter-spacing:5px;
+    font-style:italic;
+    font-weight:200;
+    font-family:sans-serif;
+    margin: 20px;
+}
+
+.contain1{
+    width: 150px;
+    height: 150px;
+    flex-direction: column;
+}
+
+.menu5{
+    text-color:saddlebrown;
+    font-size:30px;
+    allow-scale:true;
+    letter-spacing:5px;
+    font-style:normal;
+    font-weight:300;
+    font-family:sans-serif;
+    margin: 20px;
+}
+
+.menu6{
+    text-color:darkcyan;
+    font-size:40px;
+    allow-scale:false;
+    letter-spacing:5px;
+    font-style:italic;
+    font-weight:200;
+    font-family:sans-serif;
+    margin: 20px;
+}
+
+.menu7 {
+    text-color:navajowhite;
+    font-size:60px;
+    allow-scale:true;
+    letter-spacing:10px;
+    font-style:normal;
+    font-weight:500;
+    font-family:sans-serif;
+    margin: 20px;
+}

ace/ace_standard/src/main/js/default/pages/menu/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <!--  通用样式1  -->
+    <text onclick="onTextClick1" class="title-text" style="background-color: blue;">menu1</text>
+    <menu id="apiMenu1" class="menu1" target="" type="click" title="menu1" onselected="onMenuSelected">
+        <option value="Item 1">Item 1</option>
+        <option value="Item 2">Item 2</option>
+        <option value="Item 3">Item 3</option>
+    </menu>
+<!--  通用样式2  -->
+    <text onclick="onTextClick2" class="title-text" style="background-color: antiquewhite;">menu2</text>
+    <menu id="apiMenu2" class="menu2" target="" type="click" title="menu2" onselected="onMenuSelected"
+          style=" allow-scale:false; font-style:italic; ">
+        <option value="Item 1">Item 1</option>
+        <option value="Item 2">Item 2</option>
+        <option value="Item 3">Item 3</option>
+    </menu>
+    <!--  特有样式  -->
+    <text onclick="onTextClick3" class="title-text" style="background-color: lavender;">menu3</text>
+    <menu id="apiMenu3" class="menu3" target="" type="click" title="menu3" onselected="onMenuSelected">
+        <option value="Item 1">Item 1</option>
+        <option value="Item 2">Item 2</option>
+        <option value="Item 3">Item 3</option>
+    </menu>
+    <!--  特有样式  -->
+    <text onclick="onTextClick4" class="title-text" style="background-color: pink;">menu4</text>
+    <menu id="apiMenu4" class="menu4" target="" type="click" title="menu4" onselected="onMenuSelected">
+        <option value="Item 1">Item 1</option>
+        <option value="Item 2">Item 2</option>
+        <option value="Item 3">Item 3</option>
+    </menu>
+    <!--  特有样式  -->
+    <div class="contain1">
+        <text onclick="onTextClick5" class="title-text" style="background-color: yellow;">menu5</text>
+        <menu id="apiMenu5" class="menu5" target="" type="click" title="menu5" onselected="onMenuSelected">
+            <option value="Item 1">Item 1</option>
+            <option value="Item 2">Item 2</option>
+            <option value="Item 3">Item 3</option>
+        </menu>
+    <!--  特有样式  -->
+        <text onclick="onTextClick6" class="title-text" style="background-color: gray;">menu6</text>
+        <menu id="apiMenu6" class="menu6" target="" type="click" title="menu6" onselected="onMenuSelected">
+            <option value="Item 1">Item 1</option>
+            <option value="Item 2">Item 2</option>
+            <option value="Item 3">Item 3</option>
+        </menu>
+    </div>
+
+    <text onclick="onTextClick7" class="title-text" style="text-color: red;">menu7</text>
+    <menu id="apiMenu7" class="menu7" target="" type="click" title="menu7" onselected="onMenuSelected">
+        <option value="Item 1">Item 1</option>
+        <option value="Item 2">Item 2</option>
+        <option value="Item 3">Item 3</option>
+    </menu>
+
+</div>
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/menu/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+import prompt from '@system.prompt';
+export default {
+  onMenuSelected(e) {
+    prompt.showToast({
+      message: e.value
+    })
+  },
+  onTextClick1() {
+    this.$element('apiMenu1').show({x:120,y:10});
+  },
+  onTextClick2() {
+    this.$element('apiMenu2').show({x:120,y:80});
+  },
+  onTextClick3() {
+    this.$element('apiMenu3').show({x:120,y:150});
+  },
+  onTextClick4() {
+    this.$element('apiMenu4').show({x:120,y:220});
+  },
+  onTextClick5() {
+    this.$element('apiMenu5').show({x:120,y:290});
+  },
+  onTextClick6() {
+    this.$element('apiMenu6').show({x:120,y:360});
+  },
+  onTextClick7() {
+    this.$element('apiMenu7').show({x:120,y:650});
+  }
+}
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/rating/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+/* xxx.css */
+.container {
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+}
+
+.title{
+    font-size: 16px;
+    margin: 2px;
+    padding: 2px;
+    color: grey;
+    font-weight: bold;
+    text-align: center;
+}
+
+.rating1{
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 10px;
+    padding-top: 20px;
+    padding-right: 15px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 2px;
+    border-right-width: 3px;
+    border-top-width:4px;
+    border-bottom-width: 5px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(darkgreen,#000000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+}
+
+.rating2{
+    width: 80%;
+    height: 100px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+.rating3{
+    width: 300px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+.rating4{
+    width: 150px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 2px solid #000000;
+}
+
+.contain1{
+    width: 150px;
+    height: 70px;
+    flex-direction: column;
+}
+
+.rating5{
+    width: 120px;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+.rating6{
+    width: 120px;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+.rating7 {
+    width: 90%;
+    height: 40px;
+    star-background: url('common/images/star-1-1.png');
+    star-foreground: url('common/images/star-1-3.png');
+    star-secondary: url('common/images/star-1-2.png');
+    rtl-flip:false
+}
+
+.rating8 {
+    width: 100%;
+    margin: 10px;
+    rtl-flip:true
+}
+

ace/ace_standard/src/main/js/default/pages/rating/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <text  class="title">
+        rating通用样式1
+    </text>
+    <rating class ="rating1" numstars="5" rating="2" stepsize= "0.5" indicator="false" @change="changeRating" id="rating1">
+    </rating>
+    <text  class="title">
+        rating通用样式2
+    </text>
+    <rating class ="rating2" numstars="5" rating="4" stepsize= "0.5" indicator="true" @change="changeRating" id="rating2">
+    </rating>
+    <text  class="title">
+        rating通用样式3
+    </text>
+    <rating  class ="rating3" numstars="10" rating="7" stepsize= "1" indicator="false" @change="changeRating" id="rating3">
+    </rating>
+    <text  class="title">
+        rating通用样式4
+    </text>
+    <rating  class ="rating4" numstars="10" rating="7" stepsize= "1" indicator="false" @change="changeRating" id="rating4">
+    </rating>
+    <text  class="title">
+        rating通用样式5
+    </text>
+    <div class="contain1">
+        <rating class="rating5" id="rating5">
+        </rating>
+        <rating class="rating6" id="rating6">
+        </rating>
+    </div>
+    <text  class="title">
+        rating特有样式
+    </text>
+    <rating  class ="rating7" numstars="10" rating="7" stepsize= "1" indicator="false" @change="changeRating" id="rating7">
+    </rating>
+    <rating  class ="rating8" numstars="15" rating="3" stepsize= "0.2" indicator="false" @change="changeRating" id="rating8">
+    </rating>
+</div>
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/rating/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+import prompt from '@system.prompt';
+export default {
+  changeRating(e){
+    prompt.showToast({
+      message: e.rating
+    });
+  }
+}

ace/ace_standard/src/main/js/default/pages/search/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+.container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+}
+
+.search1{
+    font-weight: 400;
+    font-size: 15px;
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 10px;
+    padding-top: 20px;
+    padding-right: 15px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 5px;
+    border-right-width: 10px;
+    border-top-width: 15px;
+    border-bottom-width: 20px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(pink,#fff000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+}
+
+.search2{
+    width: 300px;
+    height: 100px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+.search3{
+    width: 400px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+.search4{
+    width: 450px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 1px solid #000000;
+}
+
+.contain1{
+    width: 450px;
+    height: 70px;
+    flex-direction: column;
+}
+
+.search5{
+    width: 400px;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+.search6{
+    width: 400px;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+.search7 {
+    width: 100%;
+    margin: 20px;
+    color: pink;
+    placeholder-color: cornflowerblue;
+    caret-color: darkorange;
+}

ace/ace_standard/src/main/js/default/pages/search/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <!--  通用样式1  -->
+    <search class = "search1" hint="请输入搜索内容" searchbutton="搜索" @search="search">
+    </search>
+    <!--  通用样式2  -->
+    <search class = "search2" hint="请输入搜索内容" searchbutton="搜索" @search="search">
+    </search>
+    <!--  通用样式3  -->
+    <search class = "search3" hint="请输入您需要的东西" searchbutton="search" @search="search" icon="common/images/icon.png">
+    </search>
+    <!--  通用样式4  -->
+    <search class = "search4" hint="请输入您需要的东西" searchbutton="search" @search="search" icon="common/images/icon.png">
+    </search>
+    <!--  通用样式5\6  -->
+    <div class="contain1">
+        <search class = "search5" hint="请输入搜索内容" @search="search" icon="common/images/image.png">
+        </search>
+
+        <search class = "search6" hint="请输入搜索内容" @search="search" icon="common/images/image.png">
+        </search>
+    </div>
+    <!--  特有样式  -->
+    <search class = "search7" hint="请输入搜索内容" searchbutton="搜索" @search="search">
+    </search>
+
+</div>
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/search/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+  data: {
+    title: 'World'
+  }
+}

ace/ace_standard/src/main/js/default/pages/text/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+/* xxx.css */
+.container {
+    flex-direction: column;
+    align-items: center;
+    background-color: #F1F3F5;
+    justify-content: center;
+}
+
+.text1 {
+    word-spacing: 10px;
+    adapt-height: true;
+}
+
+.text2 {
+    width: 200px;
+    max-lines: 1;
+    text-overflow: ellipsis;
+    text-valign: middle;
+    line-height: 40px;
+    text-decoration: underline;
+    text-decoration-color: red;
+    text-indent: 20px;
+    white-space: pre;
+}
+
+.common {
+    color: #ff4400;
+    text-decoration: line-through;
+}

ace/ace_standard/src/main/js/default/pages/text/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<!-- xxx.hml -->
+<div class="container">
+    <text class="common">
+        common style
+    </text>
+    <text class="text1">
+        This is a passage
+    </text>
+    <text class="text2">
+        This is a passage
+    </text>
+</div>
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/text/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+  data: {
+    title: ''
+  }
+}
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/textarea/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+/* xxx.css */
+.container {
+    margin: 20px;
+    flex-direction:column;
+    width:100%;
+    height:100%;
+}
+
+.textarea1{
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-width: 300px;
+    max-height: 50px;
+    padding-left: 1px;
+    padding-top: 2px;
+    padding-right: 5px;
+    padding-bottom: 5px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 5px;
+    border-right-width: 1px;
+    border-top-width: 2px;
+    border-bottom-width: 3px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(pink,#000000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+    font-weight:700;
+}
+
+.textarea2{
+    width: 80%;
+    height: 100px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+.textarea3{
+    width: 100px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+.textarea4{
+    width: 150px;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 1px solid #000000;
+}
+
+.contain1{
+    width: 150px;
+    height: 70px;
+    flex-direction: column;
+}
+
+.textarea5{
+    width: 120px;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+.textarea6{
+    width: 120px;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+.textarea7 {
+    margin-top: 10px;
+    font-size:20px;
+    color: green;
+    allow-scale:true;
+    placeholder-color:saddlebrown;
+    font-weight:bold;
+    font-family:sans-serif;
+    caret-color:red;
+}
+
+.textarea7 {
+    margin-top: 10px;
+    font-size:20px;
+    color: green;
+    allow-scale:true;
+    placeholder-color:saddlebrown;
+    font-weight:bold;
+    font-family:sans-serif;
+    caret-color:red;
+}
+
+.textarea8 {
+    margin: 30px;
+    font-size:12px;
+    color: pink;
+    allow-scale:false;
+    font-weight:bold;
+    font-family:sans-serif;
+    caret-color:yellow;
+}

ace/ace_standard/src/main/js/default/pages/textarea/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <text>textarea通用样式1</text>
+    <textarea class="textarea1"  extend="false" maxlength="20"
+              headericon="/common/images/icon.png"
+              placeholder="textarea 1"
+              value="textarea通用样式1"
+              showcounter = "false"
+              autofocus="false"
+              onchange="change"
+              selectedstart="2"
+              selectedend="3"
+              menuoptions="{}">
+    </textarea>
+    <text>textarea通用样式2</text>
+    <textarea class="textarea2"  extend="true" maxlength="40"
+              headericon="/common/images/image.png"
+              placeholder="textarea 2"
+              value="textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2"
+              showcounter = "true"
+              autofocus="false"
+              onchange="change"
+              selectedstart="6"
+              selectedend="7"
+              softkeyboardenabled = "false"
+              menuoptions="{}">
+    </textarea>
+    <text>textarea通用样式3</text>
+    <textarea class="textarea3"  extend="false" maxlength="40"
+              headericon="/common/images/icon.png"
+              placeholder="textarea 3">
+    </textarea>
+    <text>textarea通用样式4</text>
+    <textarea class="textarea4"  extend="true" maxlength="40"
+              headericon="/common/images/icon.png"
+              placeholder="textarea 4">
+    </textarea>
+    <text>textarea通用样式5</text>
+    <div class="contain1">
+        <textarea class="textarea5"  extend="false" maxlength="40"
+                  headericon="/common/images/icon.png"
+                  placeholder="textarea 5">
+        </textarea>
+        <textarea class="textarea6"  extend="false" maxlength="40"
+                  headericon="/common/images/icon.png"
+                  placeholder="textarea 6">
+        </textarea>
+    </div>
+    <text>textarea特有样式</text>
+    <textarea class="textarea7"  extend="false" maxlength="20"
+              headericon="/common/images/icon.png"
+              placeholder="textarea 7">
+    </textarea>
+    <textarea class="textarea8"  extend="true" maxlength="40"
+              headericon="/common/images/image.png"
+              placeholder="textarea 2"
+              value="textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2 textarea通用样式2"
+              showcounter = "true"
+              autofocus="false"
+              onchange="change"
+              selectedstart="6"
+              selectedend="7"
+              menuoptions="{}">
+    </textarea>
+</div>

ace/ace_standard/src/main/js/default/pages/textarea/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+import prompt from '@system.prompt';
+export default {
+  change(e){
+    prompt.showToast({
+      message: 'value: ' + e.text + ', lines: ' + e.lines + ', height: ' + e.height,
+      duration: 3000,
+    });
+  }
+}
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/toolbar/index.css

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+.container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+}
+
+.toolbar1{
+    width: 100%;
+    height: 100%;
+    min-width: 25px;
+    min-height: 10px;
+    max-height: 50px;
+    padding-left: 1px;
+    padding-top: 2px;
+    padding-right: 5px;
+    padding-bottom: 3px;
+    margin-left: 10px;
+    margin-top: 20px;
+    margin-right: 15px;
+    margin-bottom: 5px;
+    border-left-style: solid;
+    border-right-style: dashed;
+    border-top-style: dashed;
+    border-bottom-style: dotted;
+    border-left-width: 2px;
+    border-right-width: 3px;
+    border-top-width: 1px;
+    border-bottom-width: 1.5px;
+    border-left-color: #ff0000;
+    border-right-color: #00ff00;
+    border-top-color: #0000ff;
+    border-bottom-color: #fff000;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 15px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 12px;
+    background: linear-gradient(pink,#fff000);
+    box-shadow: 2px 4px 6px 8px #888888;
+    opacity: 0.5;
+    display: flex;
+    visibility: visible;
+    align-self: center;
+    image-fill: #000fff;
+    clip-path: margin-box;
+}
+
+.toolbar2{
+    width: 70%;
+    height:100px;
+    padding-start: 10px;
+    padding-end: 15px;
+    margin-start: 5px;
+    margin-end: 10px;
+    border-style: dotted;
+    border-width: 2px;
+    border-color:#000000;
+    border-radius:5px;
+    background-color:#ffaa00;
+    mask-image: url('common/images/icon.png');
+    mask-size: cover;
+    mask-position: center;
+    flex:1;
+    flex-grow: 2;
+    flex-basis: 10px;
+    flex-shrink: 1;
+}
+
+.toolbar3{
+    width: 100%;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border-left: 1px solid #000000;
+    border-right:  2px dashed #00ff00;
+    border-top:  1.5px dotted #0000ff;
+    border-bottom:  2.5px dotted #fff000;
+    background-image:url('common/images/image.png');
+    background-size:contain;
+    background-repeat: repeat-x;
+    background-position: center;
+}
+
+.toolbar4{
+    width: 100%;
+    height: 50px;
+    padding: 10px;
+    margin: 5px;
+    border: 1px solid #000000;
+}
+
+.contain1{
+    flex-direction: column;
+    height: 100px;
+}
+
+.toolbar5{
+    width: 100%;
+    height: 30px;
+    background-color: yellow;
+    border-image-source: url('/common/images/image.png');
+    border-image-slice: 1px 2px 3px 4px;
+    border-image-width: 2px 3px 4px 5px;
+    border-image-outset: 3px 4px 5px 6px;
+    border-image-repeat: repeat;
+}
+
+.toolbar6{
+    width: 100%;
+    height: 30px;
+    position: absolute;
+    left: 10px;
+    top: 35px;
+    bottom: 5px;
+    right: 10px;
+    background-color: pink;
+    border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round;
+}
+
+.item1{
+    color: darkorange;
+    font-size:10px;
+    background-color: cornflowerblue;
+    allow-scale: true;
+    font-style: italic;
+    font-weight: 700;
+    text-decoration: line-through;
+    font-family: sans-serif;
+    opacity: 0.5;
+    display:flex;
+    visibility: visible;
+}
+
+.item2{
+    color: pink;
+    font-size:20px;
+    font-style: italic;
+    background-color: darkgoldenrod;
+    allow-scale: false;
+    font-style: italic;
+    font-weight: 400;
+    text-decoration: line-through;
+    font-family: sans-serif;
+    opacity:0.7;
+    display:flex;
+    visibility: hidden;
+}
+
+.item3{
+    color: violet;
+    font-size:16px;
+    background-color: yellow;
+    font-weight: 700;
+    text-decoration: line-through;
+    opacity: 1;
+    display: none;
+}

ace/ace_standard/src/main/js/default/pages/toolbar/index.hml

+<!--/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */-->
+
+<div class="container">
+    <toolbar class="toolbar1">
+        <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+        <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+        <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+        <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+        <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+        <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+    </toolbar>
+    <toolbar class="toolbar2" style="margin-bottom: 20px;">
+        <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+        <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+        <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+        <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+        <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+        <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+    </toolbar>
+    <toolbar class="toolbar3" style="margin-bottom: 20px;">
+        <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+        <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+        <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+        <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+        <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+        <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+    </toolbar>
+    <toolbar class="toolbar4" style="margin-bottom: 20px;">
+        <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+        <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+        <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+        <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+        <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+        <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+    </toolbar>
+    <div class="contain1">
+        <toolbar class="toolbar5" style="margin-bottom: 20px;">
+            <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+            <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+            <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+            <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+            <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+            <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+        </toolbar>
+        <toolbar class="toolbar6" style="margin-bottom: 20px;">
+            <toolbar-item class ="item1" icon='common/images/icon.png' value='Option 1' >   </toolbar-item>
+            <toolbar-item class ="item2" icon='common/images/image.png' value='Option 2'>   </toolbar-item>
+            <toolbar-item class ="item3" icon='common/images/star-1-1.png' value='Option 3'  >   </toolbar-item>
+            <toolbar-item icon='common/images/star-1-2.png' value='Option 4' >   </toolbar-item>
+            <toolbar-item class ="item5" icon='common/images/star-1-3.png' value='Option 5' >   </toolbar-item>
+            <toolbar-item class ="item6" icon='common/images/icon.png' value='Option 6'>   </toolbar-item>
+        </toolbar>
+    </div>
+</div>
\ No newline at end of file

ace/ace_standard/src/main/js/default/pages/toolbar/index.js

+/**
+ * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development 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.
+ */
+
+export default {
+  data: {
+    title: 'World'
+  }
+}

ace/ace_standard/src/main/js/default/test/basicabilityapi.test.js

@@ -476,4 +476,4 @@ describe('basicabilityapi', function () {
             done();
         }, 1000);
     });
-});
\ No newline at end of file
+});

ace/ace_standard/src/main/js/default/test/commonComponentJsApi.test.js

@@ -28,13 +28,32 @@ describe('aceJsTest', function () {
             console.info(`sleep ${time} over...`)
         })
     }
+    async function backToIndex() {
+        let backToIndexPromise = new Promise((resolve, reject) => {
+            setTimeout(() => {
+                router.back({
+                    uri: 'pages/index/index'
+                });
+                resolve();
+            }, 500);
+        });
+        let clearPromise = new Promise((resolve, reject) => {
+            setTimeout(() => {
+                router.clear();
+                resolve();
+            }, 500);
+        });
+        await backToIndexPromise.then(() => {
+            return clearPromise;
+        });
+    }
 
     /**
     * run after testcase
     */
     afterEach(async function () {
         console.info('[aceJsTest] after each called')
-        router.clear();
+        await backToIndex();
         await sleep(1000)
     });
 
@@ -133,4 +152,194 @@ describe('aceJsTest', function () {
         expect("pages/slider/").assertEqual(pages.path);
         done();
     });
-});
\ No newline at end of file
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0400
+     * @tc.name      testTextComponent
+     * @tc.desc      ACE
+     */
+    it('testTextComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/text/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/text/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0400
+     * @tc.name      testLabelComponent
+     * @tc.desc      ACE
+     */
+    it('testLabelComponent', 0, async function (done) {
+        console.info('testLabelComponent START');
+        let result;
+        let options = {
+            uri: 'pages/label/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/label/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testDividerComponent
+     * @tc.desc      ACE
+     */
+    it('testDividerComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/divider/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/divider/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testGetImageComponent
+     * @tc.desc      ACE
+     */
+    it('testGetImageComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/image/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/image/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testGetMenuComponent
+     * @tc.desc      ACE
+     */
+    it('testGetMenuComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/menu/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/menu/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testRatingComponent
+     * @tc.desc      ACE
+     */
+    it('testRatingComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/rating/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/rating/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testSearchComponent
+     * @tc.desc      ACE
+     */
+    it('testSearchComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/search/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/search/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testToolbarComponent
+     * @tc.desc      ACE
+     */
+    it('testToolbarComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/toolbar/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(1000)
+        let pages = router.getState();
+        expect("pages/toolbar/").assertEqual(pages.path);
+        done();
+    });
+
+    /**
+     * @tc.number    SUB_ACE_BASIC_COMPONENT_JS_API_0100
+     * @tc.name      testTextareaComponent
+     * @tc.desc      ACE
+     */
+    it('testTextareaComponent', 0, async function (done) {
+        let result;
+        let options = {
+            uri: 'pages/textarea/index'
+        }
+        try {
+            result = router.push(options)
+        } catch (err) {
+            result = err
+        }
+        await sleep(5000)
+        let pages = router.getState();
+        expect("pages/textarea/").assertEqual(pages.path);
+        done();
+    });
+});