提交 85f03314 编写于 作者: D dongwei 提交者: wanggang

add test cases

Signed-off-by: Ndongwei <dongwei@kaihongdigi.com>
上级 cd18e976
...@@ -140,6 +140,15 @@ ...@@ -140,6 +140,15 @@
<progress percent="10" id="ifPropTrue" <progress percent="10" id="ifPropTrue"
if="true"> if="true">
</progress> </progress>
<progress percent="10" id="ifPropTrue"
elif="true">
</progress>
<progress percent="10" id="ifPropTrue"
elif="false">
</progress>
<progress percent="10" id="ifPropTrue"
elif="">
</progress>
<text class="sub-title"> <text class="sub-title">
渲染属性 -- show 渲染属性 -- show
...@@ -170,6 +179,20 @@ ...@@ -170,6 +179,20 @@
<progress percent="10" secondarypercent="50" clockwise="true" id="typeScaleRing" type="scale-ring"></progress> <progress percent="10" secondarypercent="50" clockwise="true" id="typeScaleRing" type="scale-ring"></progress>
<progress percent="10" id="typeArc" type="arc"></progress> <progress percent="10" id="typeArc" type="arc"></progress>
<progress percent="10" id="typeEclipse" type="eclipse"></progress> <progress percent="10" id="typeEclipse" type="eclipse"></progress>
<text class="sub-title">
progress特有属性 -- progress
</text>
<progress progress="progress" percent="10" secondarypercent="40" class="progress"></progress>
<progress progress="" percent="10" secondarypercent="40" class="progress"></progress>
<!--<text class="sub-title">
progress特有属性 -- shareid
</text>
<progress percent="10" secondarypercent="40" class="progress" shareid="shareid"></progress>
<progress percent="10" secondarypercent="40" class="progress" shareid=""></progress>-->
<text class="sub-title">
progress特有属性 -- tid
</text>
<progress percent="10" secondarypercent="40" class="progress" tid="tid"></progress>
<progress percent="10" secondarypercent="40" class="progress" tid=""></progress>
</div> </div>
</div> </div>
...@@ -155,6 +155,7 @@ ...@@ -155,6 +155,7 @@
</text> </text>
<progress percent="10" id="event2" class="event2" onclick="click" ondoubleclick="doubleClick" <progress percent="10" id="event2" class="event2" onclick="click" ondoubleclick="doubleClick"
onlongpress="longPress" onfocus="focus" onblur="blur" onkey="key" onlongpress="longPress" onfocus="focus" onblur="blur" onkey="key"
onaccessibility="onAccessibility"
onswipe="swipe" onattached="attached" ondetached="detached"> onswipe="swipe" onattached="attached" ondetached="detached">
</progress> </progress>
......
...@@ -256,7 +256,11 @@ export default { ...@@ -256,7 +256,11 @@ export default {
message: 'key:\n' + message message: 'key:\n' + message
}); });
}, },
onAccessibility (event) {
if (event.eventType === 1) {
console.log("onAccessibility" + JSON.stringify(event));
}
},
swipe(event){ swipe(event){
var direction = event.direction; var direction = event.direction;
var distance = event.distance; var distance = event.distance;
......
...@@ -306,18 +306,21 @@ ...@@ -306,18 +306,21 @@
#styleTwentySix{ #styleTwentySix{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background-color: #999999; background-color: #999999;
} }
#styleTwentySeven{ #styleTwentySeven{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background: linear-gradient(pink,#fff000); background: linear-gradient(pink,#fff000);
} }
#styleTwentyNine{ #styleTwentyNine{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background-image:url('common/images/image.png'); background-image:url('common/images/image.png');
background-size:contain; background-size:contain;
background-repeat: repeat-x; background-repeat: repeat-x;
...@@ -327,6 +330,7 @@ ...@@ -327,6 +330,7 @@
#styleThirty{ #styleThirty{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background-image:url('common/images/image.png'); background-image:url('common/images/image.png');
background-size:50px 10px; background-size:50px 10px;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -336,6 +340,7 @@ ...@@ -336,6 +340,7 @@
#styleThirtyOne{ #styleThirtyOne{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background-image:url('common/images/image.png'); background-image:url('common/images/image.png');
background-size:10% 20%; background-size:10% 20%;
background-repeat: repeat; background-repeat: repeat;
...@@ -345,6 +350,7 @@ ...@@ -345,6 +350,7 @@
#styleThirtyTwo{ #styleThirtyTwo{
width: 150px; width: 150px;
height: 20px; height: 20px;
stroke-width: 20px;
background: linear-gradient(pink,#fff000); background: linear-gradient(pink,#fff000);
clip-path: margin-box; clip-path: margin-box;
image-fill: #000fff; image-fill: #000fff;
...@@ -362,41 +368,50 @@ label { ...@@ -362,41 +368,50 @@ label {
} }
#specificOne{ #specificOne{
color: pink; color: pink;
font-size: 16px; background-color: deeppink;
letter-spacing: 2px; stroke-width: 10px;
font-weight: 700; secondary-color: greenyellow;
line-height: 20px;
font-family: HYQiHei-65S;
} }
#specificTwo{ #specificTwo{
font-size: 12px; color: deeppink;
allow-scale: true; height: 20px;
}
#specificThree{
font-size: 12px;
allow-scale: false;
margin-bottom: 10px;
} }
#specificFour{ #specificFour{
font-style: normal; height: 80px;
color: deeppink;
background-color: green;
secondary-color: blue;
stroke-width: 10px;
} }
#specificFive{ #specificFive{
font-style: italic; height: 80px;
margin-bottom: 10px; color: deeppink;
background-color: green;
secondary-color: blue;
stroke-width: 10px;
scale-width: 1px;
scale-number: 100;
} }
#specificSix{ #specificSix{
text-decoration: underline; color: blue;
text-align: left; background-color: deeppink;
stroke-width: 5px;
start-angle: 240;
total-angle: 240;
center-x: 40px;
center-y: 40px;
radius: 30;
height: 80px;
} }
#specificSeven{ #specificSeven{
text-decoration: line-through; color: #ddd;
text-align: center; height: 80px;
background-color: yellow;
} }
#specificEight{ #specificEight{
......
...@@ -16,133 +16,128 @@ ...@@ -16,133 +16,128 @@
<div class="container"> <div class="container">
<div class="style-container"> <div class="style-container">
<text class="title"> <text class="title">
label通用样式 progress通用样式
</text> </text>
<text class="sub-title"> <text class="sub-title">
通用样式 1-8 \n width height padding margin border opacity align-self 通用样式 1-8 \n width height padding margin border opacity align-self
</text> </text>
<label id="styleOne"> <progress type="horizontal" percent="10" id="styleOne">
</label> </progress>
<label id="styleTwo"> <progress type="horizontal" percent="10" id="styleTwo">
</label> </progress>
<label id="styleThree"> <progress type="horizontal" percent="10" id="styleThree">
</label> </progress>
<label id="styleFour"> <progress type="horizontal" percent="10" id="styleFour">
</label> </progress>
<label id="styleFive"> <progress type="horizontal" percent="10" id="styleFive">
</label> </progress>
<label id="styleSix"> <progress type="horizontal" percent="10" id="styleSix">
</label> </progress>
<label id="styleSeven"> <progress type="horizontal" percent="10" id="styleSeven">
</label> </progress>
<label id="styleEight"> <progress type="horizontal" percent="10" id="styleEight">
</label> </progress>
<text class="sub-title"> <text class="sub-title">
通用样式9-20 \n display flex z-index position 通用样式9-20 \n display flex z-index position
</text> </text>
<div id="styleNine"> <div id="styleNine">
<label id="styleTen"> <progress type="horizontal" percent="10" id="styleTen">
</label> </progress>
<label id="styleEleven"> <progress type="horizontal" percent="10" id="styleEleven">
</label> </progress>
<label id="styleTwelve"> <progress type="horizontal" percent="10" id="styleTwelve">
</label> </progress>
<label id="styleThirteen"> <progress type="horizontal" percent="10" id="styleThirteen">
</label> </progress>
<label id="styleFourteen"> <progress type="horizontal" percent="10" id="styleFourteen">
</label> </progress>
<label id="styleFifteen"> <progress type="horizontal" percent="10" id="styleFifteen">
</label> </progress>
<label id="styleSixteen"> <progress type="horizontal" percent="10" id="styleSixteen">
</label> </progress>
<label id="styleSeventeen"> <progress type="horizontal" percent="10" id="styleSeventeen">
</label> </progress>
<label id="styleEighteen"> <progress type="horizontal" percent="10" id="styleEighteen">
</label> </progress>
<label id="styleNineteen"> <progress type="horizontal" percent="10" id="styleNineteen">
</label> </progress>
<label id="styleTwenty"> <progress type="horizontal" percent="10" id="styleTwenty">
</label> </progress>
</div> </div>
<text class="sub-title"> <text class="sub-title">
通用样式21-23 box-shadow 通用样式21-23 box-shadow
</text> </text>
<div style="width: 100%;flex-direction: row;"> <div style="width: 100%;flex-direction: row;">
<label id="styleTwentyOne"> <progress type="horizontal" percent="10" id="styleTwentyOne">
</label> </progress>
<label id="styleTwentyTwo"> <progress type="horizontal" percent="10" id="styleTwentyTwo">
</label> </progress>
<label id="styleTwentyThree"> <progress type="horizontal" percent="10" id="styleTwentyThree">
</label> </progress>
</div> </div>
<text class="sub-title"> <text class="sub-title">
通用样式23-25 visibility clip-path 通用样式23-25 visibility clip-path
</text> </text>
<label id="styleTwentyFour"> <progress type="horizontal" percent="10" id="styleTwentyFour">
</label> </progress>
<label id="styleTwentyFive"> <progress type="horizontal" percent="10" id="styleTwentyFive">
</label> </progress>
<text class="sub-title"> <text class="sub-title">
通用样式26-31 background 通用样式26-31 background
</text> </text>
<label id="styleTwentySix"> <progress type="horizontal" percent="10" id="styleTwentySix">
</label> </progress>
<label id="styleTwentySeven"> <progress type="horizontal" percent="10" id="styleTwentySeven">
</label> </progress>
<label id="styleTwentyNine"> <progress type="horizontal" percent="10" id="styleTwentyNine">
</label> </progress>
<label id="styleThirty"> <progress type="horizontal" percent="10" id="styleThirty">
</label> </progress>
<label id="styleThirtyOne"> <progress type="horizontal" percent="10" id="styleThirtyOne">
</label> </progress>
<text class="sub-title"> <text class="sub-title">
通用样式32 clip-path image-fill mask-image 通用样式32 clip-path image-fill mask-image
</text> </text>
<label id="styleThirtyTwo"> <progress type="horizontal" percent="10" id="styleThirtyTwo">
</label> </progress>
</div> </div>
<div style="background-color: #000000; width: 2px; height: 100%;"> <div style="background-color: #000000; width: 2px; height: 100%;">
</div> </div>
<div class="specific-container"> <div class="specific-container">
<text class="title"> <text class="title">
label特有样式 progress特有样式
</text> </text>
<text class="sub-title"> <text class="sub-title">
特有样式 \n color,font-size,letter-spacing,font-weight,line-height,font-family 特有样式 -- type=horizontal时
</text> </text>
<label id="specificOne">label1</label> <progress type="horizontal" percent="10" secondarypercent="50" id="specificOne"></progress>
<text class="sub-title"> <text class="sub-title">
特有样式 -- allow-scale 特有样式 -- type=circular时
</text> </text>
<label id="specificTwo" class="red-item">true</label> <progress type="circular" id="specificTwo" class="red-item"></progress>
<label id="specificThree" class="green-item">false</label>
<text class="sub-title"> <text class="sub-title">
特有样式 -- font-style 特有样式 -- type=ring
</text> </text>
<label id="specificFour" class="yellow-item">normal</label> <progress type="ring" id="specificFour" class="yellow-item"></progress>
<label id="specificFive" class="red-item">italic</label>
<text class="sub-title"> <text class="sub-title">
特有样式 -- text-decoration,text-align 特有样式 -- scale-ring
</text> </text>
<label id="specificSix" class="green-item">left,underline</label> <progress type="scale-ring" percent="10" id="specificFive"></progress>
<label id="specificSeven" class="yellow-item">center,line-through</label>
<label id="specificEight" class="blue-item">right,none</label>
<text class="sub-title"> <text class="sub-title">
特有样式 \n max-lines,text-overflow 特有样式 -- type=arc
</text> </text>
<label id="specificNine" class="green-item">clip方式裁剪文字</label> <progress type="arc" percent="10" id="specificSix" class="green-item">left,underline</progress>
<label id="specificTen" class="yellow-item">ellipsis方式裁剪文字</label>
<text class="sub-title"> <text class="sub-title">
特有样式 \n min-font-size,max-font-size,font-size-step,prefer-font-sizes 特有样式 -- type=eclipse
</text> </text>
<label id="specificEleven" class="green-item">font</label> <progress type="eclipse" percent="10" id="specificSeven" class="yellow-item">center,line-through</progress>
</div> </div>
</div> </div>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册