FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

feat(GridLayout): Add synonym property column for col in GridLayout by vakrilov · Pull Request #7641 · NativeScript/NativeScript · GitHub

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension .ts  (6) .xml  (1) All 2 file types selected
Viewed files
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Unified
Split
Hide whitespace
Diff view
Unified
Split
Hide whitespace
45 changes: 45 additions & 0 deletions e2e/ui-tests-app/app/layouts/grid-7295-page.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import * as model from "./myview";
import { Button } from "tns-core-modules/ui/button";
import { Page } from "tns-core-modules/ui/page";
import { GridLayout, ItemSpec } from "tns-core-modules/ui/layouts/grid-layout";

export function onLoaded(args: { eventName: string, object: any }) {
var page = <Page>args.object;
page.bindingContext = new model.ViewModel();
}

export function onAddRowColumn(args: { eventName: string, object: any }) {

var layout = <GridLayout>args.object.parent.parent;
var row = new ItemSpec(1, "auto");
var column = new ItemSpec(1, "auto");

layout.addRow(row);
layout.addColumn(column);

var btn0 = new Button();
var btn1 = new Button();
btn0.id = "b0";
btn1.id = "b1";
btn0.text = "b0";
btn1.text = "b1";
layout.addChild(btn0);
layout.addChild(btn1);
GridLayout.setRow(btn0, 0);
GridLayout.setColumn(btn0, 4);
GridLayout.setRow(btn1, 4);
GridLayout.setColumn(btn1, 0);
GridLayout.setColumnSpan(btn1, 2);
GridLayout.setRowSpan(btn0, 3);
}

export function onRemoveRowColumn(args: { eventName: string, object: any }) {
var layout = <GridLayout>args.object.parent.parent;
var itemSpecs, count;
itemSpecs = layout.getRows();
count = itemSpecs.length;
layout.removeRow(itemSpecs[count - 1]);
itemSpecs = layout.getColumns();
count = itemSpecs.length;
layout.removeColumn(itemSpecs[count - 1]);
}
18 changes: 18 additions & 0 deletions e2e/ui-tests-app/app/layouts/grid-7295-page.xml
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<Page loaded="onLoaded">
<GridLayout rows="auto, 100, *, 50" columns="auto, 60, *, 40">
<!-- View Properties -->
<Button text="wh" tap="{{ onWidthHeight }}" id="widthHeight" automationText="widthHeight" style="background-color: lightblue;" />
<Button text="n" tap="{{ onMinWidthMinHeight }}" column="1" id="minWidthMinHeight" automationText="minWidthMinHeight" style="background-color: lightblue;" />
<Button text="m" tap="{{ onMargins }}" column="2" id="margins" automationText="margins" style="background-color: lightblue;" />
<Button text="a" tap="{{ onAlignments }}" row="1" id="alignments" automationText="alignments" style="background-color: lightblue;" />
<Button text="c" tap="{{ onCollapse }}" row="1" column="1" id="collapse" automationText="collapse" style="background-color: lightblue;" />
<Button text="v" tap="{{ onVisibile }}" row="1" column="2" id="visible" automationText="visible" style="background-color: lightblue;" />
<!-- Layout Properties -->
<Button text="p" tap="{{ onPaddings }}" row="2" id="paddings" automationText="paddings" style="background-color: lightgray;" />
<Button text="all" tap="{{ onAllProperties }}" row="2" column="1" id="allProperties" automationText="allProperties" style="background-color: aquamarine;" />
<StackLayout row="2" column="2">
<Button text="1" tap="onAddRowColumn" id="addRowColumn" automationText="addRowColumn" style="background-color: lightgreen;" />
<Button text="0" tap="onRemoveRowColumn" id="removeRowColumn" automationText="removeRowColumn" style="background-color: lightgreen;" />
</StackLayout>
</GridLayout>
</Page>
1 change: 1 addition & 0 deletions e2e/ui-tests-app/app/layouts/main-page.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export function loadExamples() {
examples.set("pwrap", "layouts-percent/wrap-page");
examples.set("passThroughParent", "layouts/passThroughParent-page");
examples.set("stacklayout-6059", "layouts/stacklayout-6059-page");
examples.set("grid-7295", "layouts/grid-7295-page");
examples.set("safe-area", "layouts/safe-area-page");

return examples;
Expand Down
60 changes: 57 additions & 3 deletions tests/app/ui/layouts/grid-layout-tests.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,60 @@ export class GridLayoutTest extends testModule.UITest<RemovalTrackingGridLayout>
TKUnit.assertEqual(this.colSpan(test), 1, "'columnSpan' property default value should be 1.");
}

public test_synonym_property_setting_column_changes_col() {
const test = new Button();

test.column = 3;

TKUnit.assertEqual(test.column, 3, "Setting column should work.");
TKUnit.assertEqual(test.col, 3, "Setting column property should affect col property.");
}

public test_synonym_property_setting_col_changes_column() {
const test = new Button();

test.col = 3;

TKUnit.assertEqual(test.col, 3, "Setting col should work.");
TKUnit.assertEqual(test.column, 3, "Setting col property should affect column property.");
}

public test_synonym_property_setColumn_should_set_col_and_column() {
const test = new Button();

GridLayout.setColumn(test, 3);

TKUnit.assertEqual(test.col, 3, "setColumn should set col");
TKUnit.assertEqual(test.column, 3, "setColumn should set column");
}

public test_synonym_property_setting_columnSpan_changes_colSpan() {
const test = new Button();

test.columnSpan = 3;

TKUnit.assertEqual(test.columnSpan, 3, "Setting columnSpan should work.");
TKUnit.assertEqual(test.colSpan, 3, "Setting columnSpan property should affect colSpan property.");
}

public test_synonym_property_setting_colSpan_changes_columnSpan() {
const test = new Button();

test.colSpan = 3;

TKUnit.assertEqual(test.colSpan, 3, "Setting colSpan should work.");
TKUnit.assertEqual(test.columnSpan, 3, "Setting colSpan property should affect columnSpan property.");
}

public test_synonym_property_setColumnSpan_should_set_colSpan_and_columnSpan() {
const test = new Button();

GridLayout.setColumnSpan(test, 3);

TKUnit.assertEqual(test.colSpan, 3, "setColumnSpan should set colSpan");
TKUnit.assertEqual(test.columnSpan, 3, "setColumnSpan should set columnSpan");
}

public test_getRow_shouldThrow_onNullValues() {
TKUnit.assertThrows(() => {
GridLayout.getRow(null);
Expand Down Expand Up @@ -250,17 +304,17 @@ export class GridLayoutTest extends testModule.UITest<RemovalTrackingGridLayout>
TKUnit.assertEqual(
this.row(btn),
row,
"'row' property not applied For GridLayout addChildAtCell without rowspan."
"'row' property not applied For GridLayout addChildAtCell without rowSpan."
);
TKUnit.assertEqual(
this.col(btn),
column,
"'column' property not applied For GridLayout addChildAtCell without rowspan."
"'column' property not applied For GridLayout addChildAtCell without rowSpan."
);
TKUnit.assertEqual(
this.rowSpan(btn),
defaultSpanValue,
"'rowSpan' property not applied For GridLayout addChildAtCell without rowspan."
"'rowSpan' property not applied For GridLayout addChildAtCell without rowSpan."
);
TKUnit.assertEqual(
this.colSpan(btn),
Expand Down
8 changes: 8 additions & 0 deletions tns-core-modules/ui/core/view-base/view-base.d.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,16 @@ export abstract class ViewBase extends Observable {
dock: "left" | "top" | "right" | "bottom";
row: number;
col: number;
/**
* Setting `column` property is the same as `col`
*/
column: number;
rowSpan: number;
colSpan: number;
/**
* Setting `columnSpan` property is the same as `colSpan`
*/
columnSpan: number;
domNode: DOMNode;

order: Order;
Expand Down
2 changes: 2 additions & 0 deletions tns-core-modules/ui/core/view-base/view-base.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -210,8 +210,10 @@ export abstract class ViewBase extends Observable implements ViewBaseDefinition
dock: "left" | "top" | "right" | "bottom";
row: number;
col: number;
column: number; // synonym for "col"
rowSpan: number;
colSpan: number;
columnSpan: number; // synonym for "columnSpan"

order: Order;
flexGrow: FlexGrow;
Expand Down
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,20 @@ View.prototype.col = 0;
View.prototype.rowSpan = 1;
View.prototype.colSpan = 1;

Object.defineProperty(View.prototype, "column", {
get(this: View): number { return this.col; },
set(this: View, value: number) { this.col = value; },
enumerable: true,
configurable: true
});

Object.defineProperty(View.prototype, "columnSpan", {
get(this: View): number { return this.colSpan; },
set(this: View, value: number) { this.colSpan = value; },
enumerable: true,
configurable: true
});

function validateItemSpec(itemSpec: ItemSpec): void {
if (!itemSpec) {
throw new Error("Value cannot be undefined.");
Expand Down

Back | FazBrowse Home | New Git URL