Skip to content

Commit 57bad3f

Browse files
author
Alexander Vakrilov
authored
Merge pull request NativeScript#3804 from NativeScript/borders-clip
Borders clip
2 parents 957a648 + 4196b9e commit 57bad3f

File tree

3 files changed

+39
-18
lines changed

3 files changed

+39
-18
lines changed

‎apps/app/ui-tests-app/css/layouts-border-overlap.xml‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
<Page>
22
<GridLayout rows="*,*,*,*,*" columns="*,*,*" id="root">
33

4-
<StackLayout class="s0" row="0" col="0"><Label textWrap="true" text="border-width: 5;"/></StackLayout>
5-
<StackLayout class="s1" row="0" col="1"><Label textWrap="true" text="padding: 5;"/></StackLayout>
6-
<StackLayout class="s2" row="0" col="2"><Label textWrap="true" text="border-width: 20 5 5 20;"/></StackLayout>
4+
<StackLayout class="s0" row="0" col="0"><Label textWrap="true" text="border-width: 20;"/></StackLayout>
5+
<StackLayout class="s1" row="0" col="1"><Label textWrap="true" text="padding: 20;"/></StackLayout>
6+
<StackLayout class="s2" row="0" col="2"><Label textWrap="true" text="border-width: 20 0 0 20;"/></StackLayout>
77

8-
<AbsoluteLayout class="s0" row="1" col="0"><Label textWrap="true" text="border-width: 5;"/></AbsoluteLayout>
9-
<AbsoluteLayout class="s1" row="1" col="1"><Label textWrap="true" text="padding: 5;"/></AbsoluteLayout>
10-
<AbsoluteLayout class="s2" row="1" col="2"><Label textWrap="true" text="border-width: 20 5 5 20;"/></AbsoluteLayout>
8+
<AbsoluteLayout class="s0" row="1" col="0"><Label textWrap="true" text="border-width: 20;"/></AbsoluteLayout>
9+
<AbsoluteLayout class="s1" row="1" col="1"><Label textWrap="true" text="padding: 20;"/></AbsoluteLayout>
10+
<AbsoluteLayout class="s2" row="1" col="2"><Label textWrap="true" text="border-width: 20 0 0 20;"/></AbsoluteLayout>
1111

12-
<DockLayout class="s0" row="2" col="0"><Label textWrap="true" text="border-width: 5;"/></DockLayout>
13-
<DockLayout class="s1" row="2" col="1"><Label textWrap="true" text="padding: 5;"/></DockLayout>
14-
<DockLayout class="s2" row="2" col="2"><Label textWrap="true" text="border-width: 20 5 5 20;"/></DockLayout>
12+
<DockLayout class="s0" row="2" col="0"><Label textWrap="true" text="border-width: 20;"/></DockLayout>
13+
<DockLayout class="s1" row="2" col="1"><Label textWrap="true" text="padding: 20;"/></DockLayout>
14+
<DockLayout class="s2" row="2" col="2"><Label textWrap="true" text="border-width: 20 0 0 20;"/></DockLayout>
1515

16-
<GridLayout class="s0" row="3" col="0"><Label textWrap="true" text="border-width: 5;"/></GridLayout>
17-
<GridLayout class="s1" row="3" col="1"><Label textWrap="true" text="padding: 5;"/></GridLayout>
18-
<GridLayout class="s2" row="3" col="2"><Label textWrap="true" text="border-width: 20 5 5 20;"/></GridLayout>
16+
<GridLayout class="s0" row="3" col="0"><Label textWrap="true" text="border-width: 20;"/></GridLayout>
17+
<GridLayout class="s1" row="3" col="1"><Label textWrap="true" text="padding: 20;"/></GridLayout>
18+
<GridLayout class="s2" row="3" col="2"><Label textWrap="true" text="border-width: 20 0 0 20;"/></GridLayout>
1919

20-
<WrapLayout class="s0" row="4" col="0"><Label textWrap="true" text="border-width: 5;"/></WrapLayout>
21-
<WrapLayout class="s1" row="4" col="1"><Label textWrap="true" text="padding: 5;"/></WrapLayout>
22-
<WrapLayout class="s2" row="4" col="2"><Label textWrap="true" text="border-width: 20 5 5 20;"/></WrapLayout>
20+
<WrapLayout class="s0" row="4" col="0"><Label textWrap="true" text="border-width: 20;"/></WrapLayout>
21+
<WrapLayout class="s1" row="4" col="1"><Label textWrap="true" text="padding: 20;"/></WrapLayout>
22+
<WrapLayout class="s2" row="4" col="2"><Label textWrap="true" text="border-width: 20 0 0 20;"/></WrapLayout>
2323

2424
</GridLayout>
2525
</Page>

‎apps/app/ui-tests-app/css/margins-paddings-with-percentage.ts‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,29 @@ import * as pages from "tns-core-modules/ui/page";
33
import { EventData } from "tns-core-modules/data/observable";
44
import * as button from "tns-core-modules/ui/button";
55

6-
var cssPercentage = " Page { margin:5% 10% 15% 8%; background-color: orange; font-size:8; } GridLayout { margin:3%; background-color: lightgreen; font-size:8; } StackLayout { border-color:red; border-width:1px; } StackLayout * { border-color:blue; border-width:1px; } GridLayout { border-color:green;border-width:1px; } .test1 { padding:10%; } .test2 { padding:10%; background-color:lightblue; } .test3 { margin:1% 2% 3% 4%; } WrapLayout { orientation:vertical; width:75%; height:45% } Button { color:black }"
7-
var cssWithouPercentage = " Page { margin:15 10 15 30; background-color: orange; font-size:8; } GridLayout { margin:3; background-color: lightgreen; font-size:8; } StackLayout { border-color:red; border-width:1px; } StackLayout * { border-color:blue; border-width:1px; } GridLayout { border-color:green;border-width:1px; } .test1 { padding:10; } .test2 { padding:10; background-color:lightblue; } .test3 { margin:10 20 30 40; } WrapLayout { orientation:vertical; width:100; height:120 } Button { color:black }"
6+
const cssPercentage = `
7+
Page { margin: 5% 10% 15% 8%; background-color: orange; font-size: 8; }
8+
GridLayout { margin: 3%; background-color: lightgreen; font-size: 8; }
9+
StackLayout { border-color: red; border-width: 1; }
10+
StackLayout * { border-color: blue; border-width: 1; }
11+
GridLayout { border-color: green; border-width: 1; }
12+
.test1 { padding: 10%; }
13+
.test2 { padding: 10%; background-color: lightblue; }
14+
.test3 { margin: 1% 2% 3% 4%; }
15+
WrapLayout { orientation: vertical; width: 75%; height: 45% }
16+
Button { color: black }`;
17+
18+
const cssWithouPercentage = `
19+
Page { margin:15 10 15 30; background-color: orange; font-size: 8; }
20+
GridLayout { margin:3; background-color: lightgreen; font-size: 8; }
21+
StackLayout { border-color: red; border-width: 1; }
22+
StackLayout * { border-color: blue; border-width: 1; }
23+
GridLayout { border-color: green; border-width: 1; }
24+
.test1 { padding: 10; }
25+
.test2 { padding: 10; background-color: lightblue; }
26+
.test3 { margin: 10 20 30 40; }
27+
WrapLayout { orientation: vertical; width: 100; height: 120; }
28+
Button { color: black }`;
829

930
var isSCCWithPercentage = true;
1031

‎tns-core-modules/ui/core/view/view.ios.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -414,7 +414,7 @@ export class View extends ViewCommon {
414414

415415
_setNativeClipToBounds() {
416416
let backgroundInternal = this.style.backgroundInternal;
417-
this.nativeView.clipsToBounds = backgroundInternal.hasUniformBorder() || backgroundInternal.getUniformBorderRadius() > 0;
417+
this.nativeView.clipsToBounds = backgroundInternal.hasBorderWidth() || backgroundInternal.hasBorderRadius();
418418
}
419419
}
420420

0 commit comments

Comments
 (0)