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

add test cases

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