javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: apply insets to dock layout

Browse Source
This commit is contained in:
Vasil Chimev
2018-08-23 13:23:25 +03:00
committed by Martin Yankov
parent d7dcc737f6
commit 12a9c5181e
4 changed files with 26 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
e2e/safe-area/app/app.css
View File

@@ -17,6 +17,10 @@ Page {
background-color: LightGreen;
}
.dock {
background-color: HoneyDew;
}
.grid {
background-color: LightBlue;
}

15
e2e/safe-area/app/docklayout/docklayout-page.xml Normal file
View File

@@ -0,0 +1,15 @@
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
<ActionBar>
<Label text="DockLayout Examples"></Label>
</ActionBar>
<DockLayout stretchLastChild="true" class="dock">
<Button dock="Left" text="left" backgroundColor="red" />
<Button dock="Top" text="top" backgroundColor="green" />
<Button dock="Right" text="right" backgroundColor="blue" />
<Button dock="Bottom" text="bottom" backgroundColor="yellow" />
<Button text="Fill"/>
</DockLayout>
</Page>

1
e2e/safe-area/app/home/home-page.xml
View File

@@ -7,6 +7,7 @@
<ScrollView>
<StackLayout>
<Button text="Component Examples" tap="onNavigate" route="component/component-page"></Button>
<Button text="DockLayout Examples" tap="onNavigate" route="docklayout/docklayout-page"></Button>
<Button text="GridLayout Examples" tap="onNavigate" route="gridlayout/gridlayout-page"></Button>
<Button text="ListView Examples" tap="onNavigate" route="listview/listview-page" />
<Button text="ScrollView Examples" tap="onNavigate" route="scrollview/scrollview-page"></Button>

11
tns-core-modules/ui/layouts/dock-layout/dock-layout.ios.ts
View File

@@ -22,7 +22,7 @@ export class DockLayout extends DockLayoutBase {
const horizontalPaddingsAndMargins = this.effectivePaddingLeft + this.effectivePaddingRight + this.effectiveBorderLeftWidth + this.effectiveBorderRightWidth;
const verticalPaddingsAndMargins = this.effectivePaddingTop + this.effectivePaddingBottom + this.effectiveBorderTopWidth + this.effectiveBorderBottomWidth;
let remainingWidth = widthMode === layout.UNSPECIFIED ? Number.MAX_VALUE : width - horizontalPaddingsAndMargins;
let remainingHeight = heightMode === layout.UNSPECIFIED ? Number.MAX_VALUE : height - verticalPaddingsAndMargins;
@@ -79,11 +79,12 @@ export class DockLayout extends DockLayoutBase {
public onLayout(left: number, top: number, right: number, bottom: number): void {
super.onLayout(left, top, right, bottom);
const horizontalPaddingsAndMargins = this.effectivePaddingLeft + this.effectivePaddingRight + this.effectiveBorderLeftWidth + this.effectiveBorderRightWidth;
const verticalPaddingsAndMargins = this.effectivePaddingTop + this.effectivePaddingBottom + this.effectiveBorderTopWidth + this.effectiveBorderBottomWidth;
const insets = this.getSafeAreaInsets();
const horizontalPaddingsAndMargins = this.effectivePaddingLeft + this.effectivePaddingRight + this.effectiveBorderLeftWidth + this.effectiveBorderRightWidth + insets.left + insets.right;
const verticalPaddingsAndMargins = this.effectivePaddingTop + this.effectivePaddingBottom + this.effectiveBorderTopWidth + this.effectiveBorderBottomWidth + insets.top + insets.bottom;
let childLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft;
let childTop = this.effectiveBorderTopWidth + this.effectivePaddingTop;
let childLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft + insets.left;
let childTop = this.effectiveBorderTopWidth + this.effectivePaddingTop + insets.top;
let x = childLeft;
let y = childTop;