Skip to content

X
Xts Acts

OpenHarmony / Xts Acts
大约 1 年 前同步成功

通知 9
Star 22
Fork 0
X
Xts Acts

体验新版 GitCode，发现更多精彩内容 >>

提交 6eb4ccd6 编写于 作者: B bayanxing
浏览文件
操作

add test cases 

Signed-off-by: Nbayanxing <bayanxing@kaihongdigi.com>
上级 8b2ca69f
展开全部 隐藏空白更改
内联 并排
Showing with 1922 addition and 16 deletion
ace/ace_standard/src/main/config.json
浏览文件 @ 6eb4ccd6
......@@ -76,7 +76,7 @@
"pages/progress/index",
"pages/qrcode/index",
"pages/select/index",
"pages/div/index",
"pages/div/router/index",
"pages/badge/index",
"pages/dialog/index",
"pages/form/index",
......@@ -120,7 +120,9 @@
"pages/animateMotion/index",
"pages/animateTransform/index",
"pages/textPath/index",
"pages/tspan/index"
"pages/tspan/index",
"pages/div/prop/index",
"pages/div/style/index"
],
"name": "default",
"window": {
......
ace/ace_standard/src/main/js/default/pages/div/prop/index.css 0 → 100644
浏览文件 @ 6eb4ccd6
/**
* 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:row;
width:100%;
height:100%;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.prop-container{
flex-direction: column;
flex-weight: 1;
}
#idProp {
flex-weight: 1;
background-color:#f00000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
.classProp {
flex-weight: 1;
background-color:#0f0000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#classPropNone {
flex-weight: 1;
background-color:#0000e0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#refProp {
flex-weight: 1;
background-color:#00f000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#refPropNone {
flex-weight: 1;
background-color:#00000e;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#disabledPropTrue {
flex-weight: 1;
background-color:#000f00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#disabledPropFalse {
flex-weight: 1;
background-color:#0000f0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#disabledPropNone {
flex-weight: 1;
background-color:#d00000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#focusablePropTrue {
flex-weight: 1;
background-color:#00000f;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#focusablePropFalse {
flex-weight: 1;
background-color:#ff0000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#focusablePropNone {
flex-weight: 1;
background-color:#0d0000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dataProp {
flex-weight: 1;
background-color:#0ff000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dataPropNone {
flex-weight: 1;
background-color:#00d000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#clickEffectPropSmall {
height: 15px;
background-color:#00ff00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#clickEffectPropMedium {
height: 15px;
background-color:#000ff0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#clickEffectPropLarge {
height: 15px;
background-color:#fff000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#clickEffectPropNone{
height: 15px;
background-color:#000d00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dirPropRtl {
flex-weight: 1;
background-color:#0fff00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dirPropAuto {
flex-weight: 1;
background-color:#00fff0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dirPropLtr {
flex-weight: 1;
background-color:#000fff;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#dirPropNone {
flex-weight: 1;
background-color:#0000d0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#forPropNull {
flex-weight: 1;
background-color:#ffff00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#forPropOne {
flex-weight: 1;
background-color:#00e000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#forPropThree {
flex-weight: 1;
background-color:#000e00;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#ifPropTrue {
flex-weight: 1;
background-color:#0ffff0;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#ifPropFalse {
flex-weight: 1;
background-color:#00ffff;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#ifPropNone {
flex-weight: 1;
background-color:#00000d;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#showPropTrue {
flex-weight: 1;
background-color:#e00000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#showPropFalse {
flex-weight: 1;
background-color:#0e0000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
#showPropNone {
flex-weight: 1;
background-color:#c00000;
width: 100%;
margin-left: 10px;
margin-right: 10px;
padding-start: 10px;
padding-end: 10px;
}
.specific-container{
flex-direction: column;
flex-weight: 1;
}
\ No newline at end of file
ace/ace_standard/src/main/js/default/pages/div/prop/index.hml 0 → 100644
浏览文件 @ 6eb4ccd6
<!--/**
* 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="prop-container">
<text class="title">
div通用属性
</text>
<text class="sub-title">
通用属性 -- id
</text>
<div id="idProp">
</div>
<text class="sub-title">
通用属性 -- class
</text>
<div id="classProp"
class="classProp">
</div>
<div id="classPropNone"
class="">
</div>
<text class="sub-title">
通用属性 -- style
</text>
<div id="styleProp"
style="width:10%;height:20px;background-color:red">
</div>
<text class="sub-title">
通用属性 -- ref
</text>
<div id="refProp"
ref="refProp">
</div>
<div id="refPropNone"
ref="">
</div>
<text class="sub-title">
通用属性 -- disabled
</text>
<div id="disabledPropTrue"
disabled="true">
</div>
<div id="disabledPropFalse"
disabled="false">
</div>
<div id="disabledPropNone"
disabled="">
</div>
<text class="sub-title">
通用属性 -- focusable
</text>
<div id="focusablePropTrue"
focusable="true">
</div>
<div id="focusablePropFalse"
focusable="false">
</div>
<div id="focusablePropNone"
focusable="">
</div>
<text class="sub-title">
通用属性 -- data-*
</text>
<div id="dataProp"
data-div="通用属性 -- data-*">
</div>
<div id="dataPropNone"
data-div="">
</div>
<text class="sub-title">
通用属性 -- click-effect
</text>
<div id="clickEffectPropSmall"
click-effect="spring-small">
</div>
<div id="clickEffectPropMedium"
click-effect="spring-medium">
</div>
<div id="clickEffectPropLarge"
click-effect="spring-large">
</div>
<div id="clickEffectPropNone"
click-effect="">
</div>
<text class="sub-title">
通用属性 -- dir
</text>
<div id="dirPropRtl"
dir="rtl">
</div>
<div id="dirPropAuto"
dir="auto">
</div>
<div id="dirPropLtr"
dir="ltr">
</div>
<div id="dirPropNone"
dir="">
</div>
<text class="sub-title">
渲染属性 -- for
</text>
<div id="forPropNull"
for="">
</div>
<div id="forPropOne"
for="{{listOne}}">
</div>
<div id="forPropThree"
for="{{listThree}}">
</div>
<text class="sub-title">
渲染属性 -- if
</text>
<div id="ifPropTrue"
if="true">
</div>
<text class="sub-title">
渲染属性 -- show
</text>
<div id="showPropTrue"
show="true">
</div>
<div id="showPropFalse"
show="false">
</div>
<div id="showPropNone"
show="">
</div>
</div>
<div style="background-color: #000000; width: 2px; height: 100%;">
</div>
<div class="specific-container">
<text class="title">
div特有属性
</text>
</div>
</div>
ace/ace_standard/src/main/js/default/pages/div/prop/index.js 0 → 100644
浏览文件 @ 6eb4ccd6
/**
* 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 {
data:{
listOne:[{}],
listThree:[{},{},{}],
idProp : null,
classProp : null,
classPropNone : null,
styleProp : null,
refProp : null,
refPropNone : null,
disabledPropTrue : null,
disabledPropFalse : null,
disabledPropNone : null,
focusablePropTrue : null,
focusablePropFalse : null,
focusablePropNone : null,
dataProp : null,
dataPropNone : null,
clickEffectPropSmall : null,
clickEffectPropMedium : null,
clickEffectPropLarge : null,
clickEffectPropNone : null,
dirPropRtl : null,
dirPropAuto : null,
dirPropLtr : null,
dirPropNone : null,
forPropNull : null,
forPropOne : null,
forPropThree : null,
ifPropTrue : null,
ifPropFalse : null,
ifPropNone : null,
showPropTrue : null,
showPropFalse : null,
showPropNone : null
},
onShow(){
this.getCommonPropValues();
globalThis.value = {
idProp : this.idProp,
classProp : this.classProp,
classPropNone : this.classPropNone,
styleProp : this.styleProp,
refProp : this.refProp,
refPropNone : this.refPropNone,
disabledPropTrue : this.disabledPropTrue,
disabledPropFalse : this.disabledPropFalse,
disabledPropNone : this.disabledPropNone,
focusablePropTrue : this.focusablePropTrue,
focusablePropFalse : this.focusablePropFalse,
focusablePropNone : this.focusablePropNone,
dataProp : this.dataProp,
dataPropNone : this.dataPropNone,
clickEffectPropSmall : this.clickEffectPropSmall,
clickEffectPropMedium : this.clickEffectPropMedium,
clickEffectPropLarge : this.clickEffectPropLarge,
clickEffectPropNone : this.clickEffectPropNone,
dirPropRtl : this.dirPropRtl,
dirPropAuto : this.dirPropAuto,
dirPropLtr : this.dirPropLtr,
dirPropNone : this.dirPropNone,
forPropNull : this.forPropNull,
forPropOne : this.forPropOne,
forPropThree : this.forPropThree,
ifPropTrue : this.ifPropTrue,
showPropTrue : this.showPropTrue,
showPropFalse : this.showPropFalse,
showPropNone : this.showPropNone
}
},
getCommonPropValues(){
this.idProp = this.$element("idProp").getInspector()
this.classProp = this.$element("classProp").getInspector()
this.classPropNone = this.$element("classPropNone").getInspector()
this.styleProp = this.$element("styleProp").getInspector()
this.refProp = this.$element("refProp").getInspector()
this.refPropNone = this.$element("refPropNone").getInspector()
this.disabledPropTrue = this.$element("disabledPropTrue").getInspector()
this.disabledPropFalse = this.$element("disabledPropFalse").getInspector()
this.disabledPropNone = this.$element("disabledPropNone").getInspector()
this.focusablePropTrue = this.$element("focusablePropTrue").getInspector()
this.focusablePropFalse = this.$element("focusablePropFalse").getInspector()
this.focusablePropNone = this.$element("focusablePropNone").getInspector()
this.dataProp = this.$element("dataProp").getInspector()
this.dataPropNone = this.$element("dataPropNone").getInspector()
this.clickEffectPropSmall = this.$element("clickEffectPropSmall").getInspector()
this.clickEffectPropMedium = this.$element("clickEffectPropMedium").getInspector()
this.clickEffectPropLarge = this.$element("clickEffectPropLarge").getInspector()
this.clickEffectPropNone = this.$element("clickEffectPropNone").getInspector()
this.dirPropRtl = this.$element("dirPropRtl").getInspector()
this.dirPropAuto = this.$element("dirPropAuto").getInspector()
this.dirPropLtr = this.$element("dirPropLtr").getInspector()
this.dirPropNone = this.$element("dirPropNone").getInspector()
this.forPropNull = this.$element("forPropNull").getInspector()
this.forPropOne = this.$element("forPropOne").getInspector()
this.forPropThree = this.$element("forPropThree").getInspector()
this.ifPropTrue = this.$element("ifPropTrue").getInspector()
this.showPropTrue = this.$element("showPropTrue").getInspector()
this.showPropFalse = this.$element("showPropFalse").getInspector()
this.showPropNone = this.$element("showPropNone").getInspector()
},
}
ace/ace_standard/src/main/js/default/pages/div/index.hml → ace/ace_standard/src/main/js/default/pages/div/router/index.hml
浏览文件 @ 6eb4ccd6
<!--/**
* Copyright (c) 2022 Shenzhen kaiHong Digital Industry Development Co., Ltd.
* 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
......@@ -22,36 +22,36 @@
<text class="sub-title">
div通用样式1
</text>
<div class="style1">
<div class="style1" id="style1">
</div>
<text class="sub-title">
div通用样式2
</text>
<div class="style2">
<div class="style2" id="style2">
</div>
<text class="sub-title">
div通用样式3
</text>
<div class="style3">
<div class="style3" id="style3">
</div>
<text class="sub-title">
div通用样式4
</text>
<div class="style4">
<div class="style4" id="style4">
</div>
<text class="sub-title">
div通用样式5
</text>
<div class="contain1">
<div class="style5">
<div class="style5" id="style5">
</div>
<div class="style6">
<div class="style6" id="style6">
</div>
</div>
<text class="sub-title">
div特有样式
</text>
<div class="style7">
<div class="style7" id="style7">
<div class="flex-item color-primary">
</div>
<div class="flex-item color-warning">
......@@ -62,7 +62,7 @@
<text class="sub-title">
div特有样式1
</text>
<div class="style8">
<div class="style8" id="style8">
<div class="flex-item color-primary">
</div>
<div class="flex-item color-warning">
......@@ -85,7 +85,7 @@
<text class="sub-title">
div特有样式2
</text>
<div class="style9">
<div class="style9" id="style9">
<div class="grid-child grid-left-top"></div>
<div class="grid-child grid-left-bottom"></div>
<div class="grid-child grid-right-top"></div>
......@@ -130,7 +130,7 @@
<text class="sub-title">
div通用属性2
</text>
<div class="prop2" ref ="prop2"
<div class="prop2" ref ="prop2" id="prop2"
disabled = "false" focusable ="false"
data-name ="prop2" click-effect="spring-large"
dir ="ltr">
......@@ -138,7 +138,7 @@
<text class="sub-title">
div通用属性3
</text>
<div style="color: #679855; margin: 5px;" class="prop3">
<div style="color: #679855; margin: 5px;" class="prop3" id="prop3">
</div>
</div>
<div style="background-color: #000000; width: 100%; height: 2px;">
......
ace/ace_standard/src/main/js/default/pages/div/style/index.css 0 → 100644
浏览文件 @ 6eb4ccd6
/**
* 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:row;
width:100%;
height:100%;
padding: 1px;
}
.title{
width: 100%;
font-size: 18px;
margin: 2px;
padding: 2px;
font-weight: bold;
text-align: center;
}
.sub-title{
width: 100%;
font-size: 14px;
text-align: left;
margin: 2px;
padding: 2px;
}
.style-container{
flex-direction: column;
width: 50%;
}
#styleOne{
width: 150px;
height: 20px;
padding-top: 1px;
padding-left: 2px;
padding-right: 3px;
padding-bottom: 0.5px;
margin-left: 1px;
margin-top: 2px;
margin-right: 3px;
margin-bottom: 0.5px;
border-left-style: solid;
border-right-style: dashed;
border-top-style: dotted;
border-bottom-style: solid;
border-left-width: 1px;
border-right-width: 1.5px;
border-top-width: 2px;
border-bottom-width: 0.5px;
border-left-color: #ff0000;
border-right-color: #00ff00;
border-top-color: #0000ff;
border-bottom-color: #fff000;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 15px;
border-top-left-radius: 10px;
border-top-right-radius: 0px;
opacity: 0.5;
align-self:flex-end;
}
#styleTwo{
width: 150px;
height: 20px;
padding-start: 1px;
padding-end: 2px;
margin-start: 1px;
margin-end: 2px;
border-style: dotted;
border-width: 2px;
border-color:#0f00f0;
border-radius:5px;
opacity: 1.5;
align-self:flex-start;
}
#styleThree{
width: 50px;
height: 20px;
padding: 2px;
margin:1px;
border-left: 1px solid #ff0000;
border-right: 2px dashed #00ff00;
border-top: 1.5px dotted #0000ff;
border-bottom: 2.5px dotted #fff000;
opacity: 1;
align-self:baseline;
}
#styleFour{
width: 50px;
height: 20px;
align-self:center;
border: 2px solid #00ff00;
}
#styleFive{
width: 150px;
height: 40px;
border: 5px;
border-image-source: url('/common/images/image.png');
border-image-slice: 5px 10px 10px 5px;
border-image-width: 10px 5px 5px 10px;
border-image-outset: 10px 5px 10px 5px;
border-image-repeat: repeat;
}
#styleSix{
width: 100%;
height: 2%;
background-color: #ff0000;
padding-top: 1%;
padding-left: 2%;
padding-right: 3%;
padding-bottom: 0.5%;
margin-left: 1%;
margin-top: 2%;
margin-right: 1.5%;
margin-bottom: 0.5%;
}
#styleSeven{
width: 70%;
height: 1%;
padding-start: 1%;
padding-end: 2%;
margin-start: 1%;
margin-end: 2%;
background-color: #00ff00;
}
#styleEight{
width: 60%;
height: 1%;
margin: 1%;
padding: 2%;
background-color: #0000ff;
}
#styleNine{
width: 100%;
height: 40px;
display:flex;
}
#styleFive{
width: 100%;
height: 40px;
border: 5px;
border-image-source: url('/common/images/image.png');
border-image-slice: 5px 10px 10px 5px;
border-image-width: 10px 5px 5px 10px;
border-image-outset: 10px 5px 10px 5px;
border-image-repeat: repeat;
}
#styleTen{
width: 100%;
height: 400%;
display: none;
background-color: #ff0000;
}
#styleEleven{
height: 40%;
background-color: #00ff00;
flex:1 1 20px;
z-index:10;
}
#styleTwelve{
height: 50%;
background-color: #ff00ff;
flex-grow:2;
flex-shrink: 3;
flex-basis: 30px;
z-index:13;
}
#styleThirteen{
position: absolute;
left: 10px;
top: 20px;
width: 10px;
height: 10px;
background-color: #00ff00;
z-index:12;
}
#styleFourteen{
position: absolute;
right: 10px;
bottom: 20px;
width: 10px;
height: 10px;
background-color: #0000ff;
z-index:3;
}
#styleFifteen{
position: absolute;
left: 10%;
top: 20%;
width: 10px;
height: 10px;
background-color: #fff000;
z-index:5;
}
#styleSixteen{
position: absolute;
right: 10%;
bottom: 20%;
width: 10px;
height: 10px;
background-color: #00ffff;
z-index:15;
}
#styleSeventeen{
position: absolute;
start: 50px;
width: 10px;
height: 10px;
background-color: #ffff00;
z-index:7;
}
#styleEighteen{
position: absolute;
end: 20px;
width: 10px;
height: 10px;
background-color: #00ffff;
z-index:4;
}
#styleNineteen{
position: absolute;
start: 20%;
width: 10px;
height: 10px;
background-color: #ffff00;
z-index:1;
}
#styleTwenty{
position: absolute;
end: 20%;
width: 10px;
height: 10px;
background-color: #00ffff;
z-index:17;
}
#styleTwentyOne{
height: 20px;
box-shadow: 2px 4px;
flex-weight: 1;
margin:5px;
}
#styleTwentyTwo{
flex-weight: 1;
height: 20px;
box-shadow: 2px 4px 6px 8px;
margin:5px;
}
#styleTwentyThree{
flex-weight: 1;
height: 20px;
box-shadow: 1px 2px 3px 4px #ff0000;
margin:5px;
}
#styleTwentyFour{
width: 150px;
height: 20px;
background-color: #00ffff;
clip-path:inset(2 23);
visibility: visible;
}
#styleTwentyFive{
width: 150px;
height: 20px;
background-color: #00ffff;
visibility: hidden;
}
#styleTwentySix{
width: 150px;
height: 20px;
background-color: #999999;
}
#styleTwentySeven{
width: 150px;
height: 20px;
background: linear-gradient(pink,#fff000);
}
#styleTwentyNine{
width: 150px;
height: 20px;
background-image:url('common/images/image.png');
background-size:contain;
background-repeat: repeat-x;
background-position: center;
}
#styleThirty{
width: 150px;
height: 20px;
background-image:url('common/images/image.png');
background-size:50px 10px;
background-repeat: no-repeat;
background-position: 10px 10px;
}
#styleThirtyOne{
width: 150px;
height: 20px;
background-image:url('common/images/image.png');
background-size:10% 20%;
background-repeat: repeat;
background-position: 30% 40%;
}
#styleThirtyTwo{
width: 150px;
height: 20px;
background: linear-gradient(pink,#fff000);
clip-path: margin-box;
image-fill: #000fff;
mask-image: url('common/images/icon.png');
mask-size: cover;
mask-position: center;
}
\ No newline at end of file
ace/ace_standard/src/main/js/default/pages/div/style/index.hml 0 → 100644
浏览文件 @ 6eb4ccd6
<!--/**
* 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="style-container">
<text class="title">
div通用样式
</text>
<text class="sub-title">
通用样式 1-8 \n width height padding margin border opacity align-self
</text>
<div id="styleOne">
</div>
<div id="styleTwo">
</div>
<div id="styleThree">
</div>
<div id="styleFour">
</div>
<div id="styleFive">
</div>
<div id="styleSix">
</div>
<div id="styleSeven">
</div>
<div id="styleEight">
</div>
<text class="sub-title">
通用样式9-20 \n display flex z-index position
</text>
<div id="styleNine">
<div id="styleTen">
</div>
<div id="styleEleven">
</div>
<div id="styleTwelve">
</div>
<div id="styleThirteen">
</div>
<div id="styleFourteen">
</div>
<div id="styleFifteen">
</div>
<div id="styleSixteen">
</div>
<div id="styleSeventeen">
</div>
<div id="styleEighteen">
</div>
<div id="styleNineteen">
</div>
<div id="styleTwenty">
</div>
</div>
<text class="sub-title">
通用样式21-23 box-shadow
</text>
<div style="width: 100%;flex-direction: row;">
<div id="styleTwentyOne">
</div>
<div id="styleTwentyTwo">
</div>
<div id="styleTwentyThree">
</div>
</div>
<text class="sub-title">
通用样式23-25 visibility clip-path
</text>
<div id="styleTwentyFour">
</div>
<div id="styleTwentyFive">
</div>
<text class="sub-title">
通用样式26-31 background
</text>
<div id="styleTwentySix">
</div>
<div id="styleTwentySeven">
</div>
<div id="styleTwentyNine">
</div>
<div id="styleThirty">
</div>
<div id="styleThirtyOne">
</div>
<text class="sub-title">
通用样式32 clip-path image-fill mask-image
</text>
<div id="styleThirtyTwo">
</div>
</div>
</div>
ace/ace_standard/src/main/js/default/pages/div/style/index.js 0 → 100644
浏览文件 @ 6eb4ccd6
/**
* 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:{
styleOne : null,
styleTwo : null,
styleThree : null,
styleFour : null,
styleFive : null,
styleSix : null,
styleSeven : null,
styleEight : null,
styleNine : null,
styleTen : null,
styleEleven : null,
styleTwelve : null,
styleThirteen : null,
styleFourteen : null,
styleFifteen : null,
styleSixteen : null,
styleSeventeen : null,
styleEighteen : null,
styleNineteen : null,
styleTwenty : null,
styleTwentyOne : null,
styleTwentyTwo : null,
styleTwentyThree : null,
styleTwentyFour : null,
styleTwentyFive : null,
styleTwentySix : null,
styleTwentySeven : null,
styleTwentyNine : null,
styleThirty : null,
styleThirtyOne : null,
styleThirtyTwo : null
},
onShow(){
this.getCommonStyleValues();
globalThis.value = {
styleOne : this.styleOne,
styleTwo : this.styleTwo,
styleThree : this.styleThree,
styleFour : this.styleFour,
styleFive : this.styleFive,
styleSix : this.styleSix,
styleSeven : this.styleSeven,
styleEight : this.styleEight,
styleNine : this.styleNine,
styleTen : this.styleTen,
styleEleven : this.styleEleven,
styleTwelve : this.styleTwelve,
styleThirteen : this.styleThirteen,
styleFourteen : this.styleFourteen,
styleFifteen : this.styleFifteen,
styleSixteen : this.styleSixteen,
styleSeventeen : this.styleSeventeen,
styleEighteen : this.styleEighteen,
styleNineteen : this.styleNineteen,
styleTwenty : this.styleTwenty,
styleTwentyOne : this.styleTwentyOne,
styleTwentyTwo : this.styleTwentyTwo,
styleTwentyThree : this.styleTwentyThree,
styleTwentyFour : this.styleTwentyFour,
styleTwentyFive : this.styleTwentyFive,
styleTwentySix : this.styleTwentySix,
styleThirty : this.styleThirty,
styleThirtyOne : this.styleThirtyOne,
styleThirtyTwo : this.styleThirtyTwo
}
},
getCommonStyleValues(){
this.styleOne = this.$element("styleOne").getInspector()
this.styleTwo = this.$element("styleTwo").getInspector()
this.styleThree = this.$element("styleThree").getInspector()
this.styleFour = this.$element("styleFour").getInspector()
this.styleFive = this.$element("styleFive").getInspector()
this.styleSix = this.$element("styleSix").getInspector()
this.styleSeven = this.$element("styleSeven").getInspector()
this.styleEight = this.$element("styleEight").getInspector()
this.styleNine = this.$element("styleNine").getInspector()
this.styleTen = this.$element("styleTen").getInspector()
this.styleEleven = this.$element("styleEleven").getInspector()
this.styleTwelve = this.$element("styleTwelve").getInspector()
this.styleThirteen = this.$element("styleThirteen").getInspector()
this.styleFourteen = this.$element("styleFourteen").getInspector()
this.styleFifteen = this.$element("styleFifteen").getInspector()
this.styleSixteen = this.$element("styleSixteen").getInspector()
this.styleSeventeen = this.$element("styleSeventeen").getInspector()
this.styleEighteen = this.$element("styleEighteen").getInspector()
this.styleNineteen = this.$element("styleNineteen").getInspector()
this.styleTwenty = this.$element("styleTwenty").getInspector()
this.styleTwentyOne = this.$element("styleTwentyOne").getInspector()
this.styleTwentyTwo = this.$element("styleTwentyTwo").getInspector()
this.styleTwentyThree = this.$element("styleTwentyThree").getInspector()
this.styleTwentyFour = this.$element("styleTwentyFour").getInspector()
this.styleTwentyFive = this.$element("styleTwentyFive").getInspector()
this.styleTwentySix = this.$element("styleTwentySix").getInspector()
this.styleThirty = this.$element("styleThirty").getInspector()
this.styleThirtyOne = this.$element("styleThirtyOne").getInspector()
this.styleThirtyTwo = this.$element("styleThirtyTwo").getInspector()
},
}
ace/ace_standard/src/main/js/default/test/List.test.js
浏览文件 @ 6eb4ccd6
......@@ -16,3 +16,4 @@
require('./basicabilityapi.test.js')
require('./mediaquery.test.js')
require('./commonComponentJsApi.test.js')
require('./divProps.test.js')
ace/ace_standard/src/main/js/default/test/commonComponentJsApi.test.js
浏览文件 @ 6eb4ccd6
......@@ -630,7 +630,7 @@ describe('aceJsTest', function () {
it('testDivComponent', 0, async function (done) {
let result;
let options = {
uri: 'pages/div/index'
uri: 'pages/div/router/index'
}
try {
result = router.push(options)
......@@ -641,7 +641,7 @@ describe('aceJsTest', function () {
await sleep(5000)
let pages = router.getState();
console.info("[router.div] getState" + JSON.stringify(pages));
expect("pages/div/").assertEqual(pages.path);
expect("pages/div/router/").assertEqual(pages.path);
done();
});
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或