mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-16 03:31:45 +08:00
Add 'auto' and number to the PercentLength and Length types
This commit is contained in:
Panayot Cankov
2
tns-core-modules/lib.core.d.ts
vendored
2
tns-core-modules/lib.core.d.ts
vendored
@ -166,7 +166,7 @@ interface ObjectConstructor {
|
||||
* @param p The property name.
|
||||
* @param attributes Descriptor for the property. It can be for a data property or an accessor property.
|
||||
*/
|
||||
defineProperty(o: any, p: string, attributes: PropertyDescriptor): any;
|
||||
defineProperty(o: any, p: string | symbol, attributes: PropertyDescriptor): any;
|
||||
|
||||
/**
|
||||
* Adds one or more properties to an object, and/or modifies attributes of existing properties.
|
||||
|
||||
@ -960,31 +960,6 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
|
||||
}
|
||||
}
|
||||
|
||||
export function getLengthEffectiveValue(param: Length): number {
|
||||
switch (param.unit) {
|
||||
case "px":
|
||||
return Math.round(param.value);
|
||||
|
||||
default:
|
||||
case "dip":
|
||||
return Math.round(layout.getDisplayDensity() * param.value);
|
||||
}
|
||||
}
|
||||
|
||||
function getPercentLengthEffectiveValue(prentAvailableLength: number, param: PercentLength): number {
|
||||
switch (param.unit) {
|
||||
case "%":
|
||||
return Math.round(prentAvailableLength * param.value);
|
||||
|
||||
case "px":
|
||||
return Math.round(param.value);
|
||||
|
||||
default:
|
||||
case "dip":
|
||||
return Math.round(layout.getDisplayDensity() * param.value);
|
||||
}
|
||||
}
|
||||
|
||||
function updateChildLayoutParams(child: ViewCommon, parent: ViewCommon, density: number): void {
|
||||
let style = child.style;
|
||||
|
||||
@ -992,25 +967,64 @@ function updateChildLayoutParams(child: ViewCommon, parent: ViewCommon, density:
|
||||
let parentWidthMeasureSize = layout.getMeasureSpecSize(parentWidthMeasureSpec);
|
||||
let parentWidthMeasureMode = layout.getMeasureSpecMode(parentWidthMeasureSpec);
|
||||
let parentAvailableWidth = parentWidthMeasureMode === layout.UNSPECIFIED ? -1 : parentWidthMeasureSize;
|
||||
style.effectiveWidth = getPercentLengthEffectiveValue(parentAvailableWidth, style.width);
|
||||
style.effectiveMarginLeft = getPercentLengthEffectiveValue(parentAvailableWidth, style.marginLeft);
|
||||
style.effectiveMarginRight = getPercentLengthEffectiveValue(parentAvailableWidth, style.marginRight);
|
||||
style.effectiveWidth = PercentLength.toDevicePixels(style.width, parentAvailableWidth)
|
||||
style.effectiveMarginLeft = PercentLength.toDevicePixels(style.marginLeft, parentAvailableWidth);
|
||||
style.effectiveMarginRight = PercentLength.toDevicePixels(style.marginRight, parentAvailableWidth);
|
||||
|
||||
let parentHeightMeasureSpec = parent._currentHeightMeasureSpec;
|
||||
let parentHeightMeasureSize = layout.getMeasureSpecSize(parentHeightMeasureSpec);
|
||||
let parentHeightMeasureMode = layout.getMeasureSpecMode(parentHeightMeasureSpec);
|
||||
let parentAvailableHeight = parentHeightMeasureMode === layout.UNSPECIFIED ? -1 : parentHeightMeasureSize;
|
||||
style.effectiveHeight = getPercentLengthEffectiveValue(parentAvailableHeight, style.height);
|
||||
style.effectiveMarginTop = getPercentLengthEffectiveValue(parentAvailableHeight, style.marginTop);
|
||||
style.effectiveMarginBottom = getPercentLengthEffectiveValue(parentAvailableHeight, style.marginBottom);
|
||||
style.effectiveHeight = PercentLength.toDevicePixels(style.height, parentAvailableHeight);
|
||||
style.effectiveMarginTop = PercentLength.toDevicePixels(style.marginTop, parentAvailableHeight);
|
||||
style.effectiveMarginBottom = PercentLength.toDevicePixels(style.marginBottom, parentAvailableHeight);
|
||||
}
|
||||
|
||||
interface Length {
|
||||
readonly unit: "dip" | "px";
|
||||
readonly value: number;
|
||||
function equalsCommon(a: Length, b: Length): boolean;
|
||||
function equalsCommon(a: PercentLength, b: PercentLength): boolean;
|
||||
function equalsCommon(a: PercentLength, b: PercentLength): boolean {
|
||||
if (a == "auto") {
|
||||
return b == "auto";
|
||||
}
|
||||
if (typeof a === "number") {
|
||||
if (b == "auto") {
|
||||
return false;
|
||||
}
|
||||
if (typeof b === "number") {
|
||||
return a == b;
|
||||
}
|
||||
return b.unit == "dip" && a == b.value;
|
||||
}
|
||||
if (b == "auto") {
|
||||
return false;
|
||||
}
|
||||
if (typeof b === "number") {
|
||||
return a.unit == "dip" && a.value == b;
|
||||
}
|
||||
return a.value == b.value && a.unit == b.unit;
|
||||
}
|
||||
|
||||
interface PercentLength {
|
||||
function toDevicePixelsCommon(length: Length, auto: number): number;
|
||||
function toDevicePixelsCommon(length: PercentLength, auto: number, parentSize: number): number;
|
||||
function toDevicePixelsCommon(length: PercentLength, auto: number, parentAvailableWidth?: number): number {
|
||||
if (length == "auto") {
|
||||
return auto;
|
||||
}
|
||||
if (typeof length === "number") {
|
||||
return Math.round(layout.getDisplayDensity() * length);
|
||||
}
|
||||
switch (length.unit) {
|
||||
case "px":
|
||||
return Math.round(length.value);
|
||||
default:
|
||||
case "dip":
|
||||
return Math.round(layout.getDisplayDensity() * length.value);
|
||||
case "%":
|
||||
return Math.round(parentAvailableWidth * length.value);
|
||||
}
|
||||
}
|
||||
|
||||
export type PercentLength = "auto" | number | {
|
||||
readonly unit: "%" | "dip" | "px";
|
||||
readonly value: number;
|
||||
}
|
||||
@ -1053,14 +1067,20 @@ export namespace PercentLength {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
export function equals(a: PercentLength, b: PercentLength): boolean {
|
||||
return a.value == b.value && a.unit == b.unit;
|
||||
}
|
||||
export const equals: { (a: PercentLength, b: PercentLength): boolean } = equalsCommon;
|
||||
export const toDevicePixels: { (length: PercentLength, parentAvailableWidth: number): number } = toDevicePixelsCommon;
|
||||
}
|
||||
|
||||
export type Length = "auto" | number | {
|
||||
readonly unit: "dip" | "px";
|
||||
readonly value: number;
|
||||
};
|
||||
|
||||
export namespace Length {
|
||||
export function parse(value: string | Length): Length {
|
||||
if (typeof value === "string") {
|
||||
if (value == "auto") {
|
||||
return "auto";
|
||||
} else if (typeof value === "string") {
|
||||
let type: "dip" | "px";
|
||||
let numberValue = 0;
|
||||
let stringValue = value.trim();
|
||||
@ -1085,9 +1105,17 @@ export namespace Length {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
export const equals: { (a: Length, b: Length): boolean } = equalsCommon;
|
||||
export const toDevicePixels: { (length: Length, auto: number): number } = toDevicePixelsCommon;
|
||||
}
|
||||
|
||||
export function equals(a: Length, b: Length): boolean {
|
||||
return a.value == b.value && a.unit == b.unit;
|
||||
declare module "ui/core/view" {
|
||||
export namespace Length {
|
||||
export function toDevicePixels(length: Length, auto: number): number;
|
||||
}
|
||||
|
||||
export namespace PercentLength {
|
||||
export function toDevicePixels(length: PercentLength, auto: number, availableParentSize: number): number;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1119,32 +1147,28 @@ isUserInteractionEnabledProperty.register(ViewCommon);
|
||||
|
||||
export const zeroLength: Length = { value: 0, unit: "px" };
|
||||
|
||||
export function lengthComparer(x: Length, y: Length): boolean {
|
||||
return x.unit === y.unit && x.value === y.value;
|
||||
}
|
||||
|
||||
export const minWidthProperty = new CssProperty<Style, Length>({
|
||||
name: "minWidth", cssName: "min-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "minWidth", cssName: "min-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectiveMinWidth = getLengthEffectiveValue(newValue);
|
||||
target.effectiveMinWidth = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
minWidthProperty.register(Style);
|
||||
|
||||
export const minHeightProperty = new CssProperty<Style, Length>({
|
||||
name: "minHeight", cssName: "min-height", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "minHeight", cssName: "min-height", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectiveMinHeight = getLengthEffectiveValue(newValue);
|
||||
target.effectiveMinHeight = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
minHeightProperty.register(Style);
|
||||
|
||||
const matchParent: Length = { value: -1, unit: "px" };
|
||||
|
||||
export const widthProperty = new CssProperty<Style, PercentLength>({ name: "width", cssName: "width", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const widthProperty = new CssProperty<Style, PercentLength>({ name: "width", cssName: "width", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
widthProperty.register(Style);
|
||||
|
||||
export const heightProperty = new CssProperty<Style, PercentLength>({ name: "height", cssName: "height", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const heightProperty = new CssProperty<Style, PercentLength>({ name: "height", cssName: "height", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
heightProperty.register(Style);
|
||||
|
||||
const marginProperty = new ShorthandProperty<Style>({
|
||||
@ -1154,16 +1178,16 @@ const marginProperty = new ShorthandProperty<Style>({
|
||||
});
|
||||
marginProperty.register(Style);
|
||||
|
||||
export const marginLeftProperty = new CssProperty<Style, PercentLength>({ name: "marginLeft", cssName: "margin-left", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const marginLeftProperty = new CssProperty<Style, PercentLength>({ name: "marginLeft", cssName: "margin-left", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
marginLeftProperty.register(Style);
|
||||
|
||||
export const marginRightProperty = new CssProperty<Style, PercentLength>({ name: "marginRight", cssName: "margin-right", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const marginRightProperty = new CssProperty<Style, PercentLength>({ name: "marginRight", cssName: "margin-right", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
marginRightProperty.register(Style);
|
||||
|
||||
export const marginTopProperty = new CssProperty<Style, PercentLength>({ name: "marginTop", cssName: "margin-top", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const marginTopProperty = new CssProperty<Style, PercentLength>({ name: "marginTop", cssName: "margin-top", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
marginTopProperty.register(Style);
|
||||
|
||||
export const marginBottomProperty = new CssProperty<Style, PercentLength>({ name: "marginBottom", cssName: "margin-bottom", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse });
|
||||
export const marginBottomProperty = new CssProperty<Style, PercentLength>({ name: "marginBottom", cssName: "margin-bottom", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals, valueConverter: PercentLength.parse });
|
||||
marginBottomProperty.register(Style);
|
||||
|
||||
const paddingProperty = new ShorthandProperty<Style>({
|
||||
@ -1174,33 +1198,33 @@ const paddingProperty = new ShorthandProperty<Style>({
|
||||
paddingProperty.register(Style);
|
||||
|
||||
export const paddingLeftProperty = new CssProperty<Style, Length>({
|
||||
name: "paddingLeft", cssName: "padding-left", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "paddingLeft", cssName: "padding-left", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectivePaddingLeft = getLengthEffectiveValue(newValue);
|
||||
target.effectivePaddingLeft = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
paddingLeftProperty.register(Style);
|
||||
|
||||
export const paddingRightProperty = new CssProperty<Style, Length>({
|
||||
name: "paddingRight", cssName: "padding-right", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "paddingRight", cssName: "padding-right", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectivePaddingRight = getLengthEffectiveValue(newValue);
|
||||
target.effectivePaddingRight = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
paddingRightProperty.register(Style);
|
||||
|
||||
export const paddingTopProperty = new CssProperty<Style, Length>({
|
||||
name: "paddingTop", cssName: "padding-top", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "paddingTop", cssName: "padding-top", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectivePaddingTop = getLengthEffectiveValue(newValue);
|
||||
target.effectivePaddingTop = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
paddingTopProperty.register(Style);
|
||||
|
||||
export const paddingBottomProperty = new CssProperty<Style, Length>({
|
||||
name: "paddingBottom", cssName: "padding-bottom", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "paddingBottom", cssName: "padding-bottom", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
target.effectivePaddingBottom = getLengthEffectiveValue(newValue);
|
||||
target.effectivePaddingBottom = Length.toDevicePixels(newValue, 0);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
paddingBottomProperty.register(Style);
|
||||
@ -1639,9 +1663,9 @@ const borderWidthProperty = new ShorthandProperty<Style>({
|
||||
borderWidthProperty.register(Style);
|
||||
|
||||
export const borderTopWidthProperty = new CssProperty<Style, Length>({
|
||||
name: "borderTopWidth", cssName: "border-top-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "borderTopWidth", cssName: "border-top-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
let value = getLengthEffectiveValue(newValue);
|
||||
let value = Length.toDevicePixels(newValue, 0);
|
||||
if (!isNonNegativeFiniteNumber(value)) {
|
||||
throw new Error(`border-top-width should be Non-Negative Finite number. Value: ${value}`);
|
||||
}
|
||||
@ -1653,9 +1677,9 @@ export const borderTopWidthProperty = new CssProperty<Style, Length>({
|
||||
borderTopWidthProperty.register(Style);
|
||||
|
||||
export const borderRightWidthProperty = new CssProperty<Style, Length>({
|
||||
name: "borderRightWidth", cssName: "border-right-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "borderRightWidth", cssName: "border-right-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
let value = getLengthEffectiveValue(newValue);
|
||||
let value = Length.toDevicePixels(newValue, 0);
|
||||
if (!isNonNegativeFiniteNumber(value)) {
|
||||
throw new Error(`border-right-width should be Non-Negative Finite number. Value: ${value}`);
|
||||
}
|
||||
@ -1667,9 +1691,9 @@ export const borderRightWidthProperty = new CssProperty<Style, Length>({
|
||||
borderRightWidthProperty.register(Style);
|
||||
|
||||
export const borderBottomWidthProperty = new CssProperty<Style, Length>({
|
||||
name: "borderBottomWidth", cssName: "border-bottom-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "borderBottomWidth", cssName: "border-bottom-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
let value = getLengthEffectiveValue(newValue);
|
||||
let value = Length.toDevicePixels(newValue, 0);
|
||||
if (!isNonNegativeFiniteNumber(value)) {
|
||||
throw new Error(`border-bottom-width should be Non-Negative Finite number. Value: ${value}`);
|
||||
}
|
||||
@ -1681,9 +1705,9 @@ export const borderBottomWidthProperty = new CssProperty<Style, Length>({
|
||||
borderBottomWidthProperty.register(Style);
|
||||
|
||||
export const borderLeftWidthProperty = new CssProperty<Style, Length>({
|
||||
name: "borderLeftWidth", cssName: "border-left-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer,
|
||||
name: "borderLeftWidth", cssName: "border-left-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: Length.equals,
|
||||
valueChanged: (target, newValue) => {
|
||||
let value = getLengthEffectiveValue(newValue);
|
||||
let value = Length.toDevicePixels(newValue, 0);
|
||||
if (!isNonNegativeFiniteNumber(value)) {
|
||||
throw new Error(`border-left-width should be Non-Negative Finite number. Value: ${value}`);
|
||||
}
|
||||
|
||||
@ -456,106 +456,6 @@ export class View extends ViewCommon {
|
||||
this.nativeView.setAlpha(value);
|
||||
}
|
||||
|
||||
get [minWidthProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMinWidth(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [minWidthProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setMinWidth(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [minHeightProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMinHeight(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [minHeightProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setMinHeight(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [widthProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getWidth(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [widthProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setWidthPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setWidth(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setWidth(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [heightProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getHeight(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [heightProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setHeightPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setHeight(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setHeight(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [marginLeftProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMarginLeft(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [marginLeftProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginLeftPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginLeft(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setMarginLeft(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [marginTopProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMarginTop(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [marginTopProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginTopPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginTop(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setMarginTop(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [marginRightProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMarginRight(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [marginRightProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginRightPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginRight(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setMarginRight(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [marginBottomProperty.native](): PercentLength {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getMarginBottom(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [marginBottomProperty.native](value: PercentLength) {
|
||||
let type = value.unit;
|
||||
if (type === "%") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginBottomPercent(this.nativeView, value.value);
|
||||
} else if (type === "px") {
|
||||
org.nativescript.widgets.ViewHelper.setMarginBottom(this.nativeView, value.value);
|
||||
} else {
|
||||
org.nativescript.widgets.ViewHelper.setMarginBottom(this.nativeView, value.value * layout.getDisplayDensity());
|
||||
}
|
||||
}
|
||||
|
||||
get [horizontalAlignmentProperty.native](): string {
|
||||
return org.nativescript.widgets.ViewHelper.getHorizontalAlignment(this.nativeView);
|
||||
}
|
||||
@ -570,38 +470,6 @@ export class View extends ViewCommon {
|
||||
org.nativescript.widgets.ViewHelper.setVerticalAlignment(this.nativeView, value);
|
||||
}
|
||||
|
||||
get [paddingLeftProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getPaddingLeft(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [paddingLeftProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setPaddingLeft(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [paddingTopProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getPaddingTop(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [paddingTopProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setPaddingTop(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [paddingRightProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getPaddingRight(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [paddingRightProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setPaddingRight(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [paddingBottomProperty.native](): Length {
|
||||
return { value: org.nativescript.widgets.ViewHelper.getPaddingBottom(this.nativeView), unit: "px" };
|
||||
}
|
||||
set [paddingBottomProperty.native](value: Length) {
|
||||
let density = value.unit === "dip" ? layout.getDisplayDensity() : 1;
|
||||
org.nativescript.widgets.ViewHelper.setPaddingBottom(this.nativeView, value.value * density);
|
||||
}
|
||||
|
||||
get [rotateProperty.native](): number {
|
||||
return org.nativescript.widgets.ViewHelper.getRotate(this.nativeView);
|
||||
}
|
||||
@ -660,408 +528,122 @@ export class View extends ViewCommon {
|
||||
}
|
||||
}
|
||||
|
||||
// export class ViewStyler implements style.Styler {
|
||||
// // Background and borders methods
|
||||
// private static setBackgroundAndBorder(view: View, newValue: any, defaultValue?: any) {
|
||||
// background.ad.onBackgroundOrBorderPropertyChanged(view);
|
||||
// }
|
||||
|
||||
// private static resetBackgroundAndBorder(view: View, nativeValue: any) {
|
||||
// background.ad.onBackgroundOrBorderPropertyChanged(view);
|
||||
// }
|
||||
|
||||
// // Visibility methods
|
||||
// private static setVisibilityProperty(view: View, newValue: any) {
|
||||
// let androidValue = (newValue === enums.Visibility.visible) ? android.view.View.VISIBLE : android.view.View.GONE;
|
||||
// (<android.view.View>view._nativeView).setVisibility(androidValue);
|
||||
// }
|
||||
|
||||
// private static resetVisibilityProperty(view: View, nativeValue: any) {
|
||||
// (<android.view.View>view._nativeView).setVisibility(android.view.View.VISIBLE);
|
||||
// }
|
||||
|
||||
// // Opacity methods
|
||||
// private static setOpacityProperty(view: View, newValue: any) {
|
||||
// (<android.view.View>view._nativeView).setAlpha(float(newValue));
|
||||
// }
|
||||
|
||||
// private static resetOpacityProperty(view: View, nativeValue: any) {
|
||||
// (<android.view.View>view._nativeView).setAlpha(float(1.0));
|
||||
// }
|
||||
|
||||
// // minWidth methods
|
||||
// private static setMinWidthProperty(view: View, newValue: any) {
|
||||
// (<android.view.View>view._nativeView).setMinimumWidth(Math.round(newValue * layout.getDisplayDensity()));
|
||||
// }
|
||||
|
||||
// private static resetMinWidthProperty(view: View, nativeValue: any) {
|
||||
// (<android.view.View>view._nativeView).setMinimumWidth(0);
|
||||
// }
|
||||
|
||||
// // minHeight methods
|
||||
// private static setMinHeightProperty(view: View, newValue: any) {
|
||||
// (<android.view.View>view._nativeView).setMinimumHeight(Math.round(newValue * layout.getDisplayDensity()));
|
||||
// }
|
||||
|
||||
// private static resetMinHeightProperty(view: View, nativeValue: any) {
|
||||
// (<android.view.View>view._nativeView).setMinimumHeight(0);
|
||||
// }
|
||||
|
||||
// private static setNativeLayoutParamsProperty(view: View, params: CommonLayoutParams): void {
|
||||
// let nativeView: android.view.View = view._nativeView;
|
||||
|
||||
// let width = params.width * layout.getDisplayDensity();
|
||||
// let height = params.height * layout.getDisplayDensity();
|
||||
|
||||
// // If width is not specified set it as WRAP_CONTENT
|
||||
// if (width < 0) {
|
||||
// width = -2;
|
||||
// }
|
||||
|
||||
// // If height is not specified set it as WRAP_CONTENT
|
||||
// if (height < 0) {
|
||||
// height = -2;
|
||||
// }
|
||||
|
||||
// let gravity = 0;
|
||||
// switch (params.horizontalAlignment) {
|
||||
// case enums.HorizontalAlignment.left:
|
||||
// gravity |= android.view.Gravity.LEFT;
|
||||
// break;
|
||||
|
||||
// case enums.HorizontalAlignment.center:
|
||||
// gravity |= android.view.Gravity.CENTER_HORIZONTAL;
|
||||
// break;
|
||||
|
||||
// case enums.HorizontalAlignment.right:
|
||||
// gravity |= android.view.Gravity.RIGHT;
|
||||
// break;
|
||||
|
||||
// case enums.HorizontalAlignment.stretch:
|
||||
// gravity |= android.view.Gravity.FILL_HORIZONTAL;
|
||||
// // If width is not specified set it as MATCH_PARENT
|
||||
// if (width < 0) {
|
||||
// width = -1;
|
||||
// }
|
||||
// break;
|
||||
|
||||
// default:
|
||||
// throw new Error("Invalid horizontalAlignment value: " + params.horizontalAlignment);
|
||||
// }
|
||||
|
||||
// switch (params.verticalAlignment) {
|
||||
// case enums.VerticalAlignment.top:
|
||||
// gravity |= android.view.Gravity.TOP;
|
||||
// break;
|
||||
|
||||
// case enums.VerticalAlignment.center:
|
||||
// case enums.VerticalAlignment.middle:
|
||||
// gravity |= android.view.Gravity.CENTER_VERTICAL;
|
||||
// break;
|
||||
|
||||
// case enums.VerticalAlignment.bottom:
|
||||
// gravity |= android.view.Gravity.BOTTOM;
|
||||
// break;
|
||||
|
||||
// case enums.VerticalAlignment.stretch:
|
||||
// gravity |= android.view.Gravity.FILL_VERTICAL;
|
||||
// // If height is not specified set it as MATCH_PARENT
|
||||
// if (height < 0) {
|
||||
// height = -1;
|
||||
// }
|
||||
// break;
|
||||
|
||||
// default:
|
||||
// throw new Error("Invalid verticalAlignment value: " + params.verticalAlignment);
|
||||
// }
|
||||
|
||||
// let lp = nativeView.getLayoutParams();
|
||||
// lp.width = Math.round(width);
|
||||
// lp.height = Math.round(height);
|
||||
|
||||
// if (lp instanceof org.nativescript.widgets.CommonLayoutParams) {
|
||||
// lp.widthPercent = params.widthPercent;
|
||||
// lp.heightPercent = params.heightPercent;
|
||||
// lp.leftMarginPercent = params.leftMarginPercent;
|
||||
// lp.topMarginPercent = params.topMarginPercent;
|
||||
// lp.rightMarginPercent = params.rightMarginPercent;
|
||||
// lp.bottomMarginPercent = params.bottomMarginPercent;
|
||||
// lp.leftMargin = Math.round(params.leftMargin * layout.getDisplayDensity());
|
||||
// lp.topMargin = Math.round(params.topMargin * layout.getDisplayDensity());
|
||||
// lp.rightMargin = Math.round(params.rightMargin * layout.getDisplayDensity());
|
||||
// lp.bottomMargin = Math.round(params.bottomMargin * layout.getDisplayDensity());
|
||||
// lp.gravity = gravity;
|
||||
// if (lp instanceof org.nativescript.widgets.FlexboxLayout.LayoutParams) {
|
||||
// if (!flexbox) {
|
||||
// flexbox = require("ui/layouts/flexbox-layout");
|
||||
// }
|
||||
// flexbox._setAndroidLayoutParams(lp, view);
|
||||
// }
|
||||
// }
|
||||
// else {
|
||||
// let layoutParams: any = lp;
|
||||
// if (types.isDefined(layoutParams.widthPercent)) {
|
||||
// layoutParams.widthPercent = params.widthPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.heightPercent)) {
|
||||
// layoutParams.heightPercent = params.heightPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.leftMarginPercent)) {
|
||||
// layoutParams.leftMarginPercent = params.leftMarginPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.topMarginPercent)) {
|
||||
// layoutParams.topMarginPercent = params.topMarginPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.rightMarginPercent)) {
|
||||
// layoutParams.rightMarginPercent = params.rightMarginPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.bottomMarginPercent)) {
|
||||
// layoutParams.bottomMarginPercent = params.bottomMarginPercent;
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.leftMargin)) {
|
||||
// layoutParams.leftMargin = Math.round(params.leftMargin * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.topMargin)) {
|
||||
// layoutParams.topMargin = Math.round(params.topMargin * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.rightMargin)) {
|
||||
// layoutParams.rightMargin = Math.round(params.rightMargin * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.bottomMargin)) {
|
||||
// layoutParams.bottomMargin = Math.round(params.bottomMargin * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// if (types.isDefined(layoutParams.gravity)) {
|
||||
// layoutParams.gravity = gravity;
|
||||
// }
|
||||
// }
|
||||
|
||||
// nativeView.setLayoutParams(lp);
|
||||
// }
|
||||
|
||||
// private static resetNativeLayoutParamsProperty(view: View, nativeValue: any): void {
|
||||
// ViewStyler.setNativeLayoutParamsProperty(view, style.nativeLayoutParamsProperty.defaultValue)
|
||||
// }
|
||||
|
||||
// private static getNativePaddingLeft(view: View): number {
|
||||
// let density = layout.getDisplayDensity();
|
||||
// return view._nativeView.getPaddingLeft() / density;
|
||||
// }
|
||||
|
||||
// private static getNativePaddingTop(view: View): number {
|
||||
// let density = layout.getDisplayDensity();
|
||||
// return view._nativeView.getPaddingTop() / density;
|
||||
// }
|
||||
|
||||
// private static getNativePaddingRight(view: View): number {
|
||||
// let density = layout.getDisplayDensity();
|
||||
// return view._nativeView.getPaddingRight() / density;
|
||||
// }
|
||||
|
||||
// private static getNativePaddingBottom(view: View): number {
|
||||
// let density = layout.getDisplayDensity();
|
||||
// return view._nativeView.getPaddingBottom() / density;
|
||||
// }
|
||||
|
||||
// private static setNativePaddingLeft(view: View, value: number): void {
|
||||
// let nativeView = view._nativeView;
|
||||
// let density = layout.getDisplayDensity();
|
||||
// let left = (value + view.borderWidth) * density;
|
||||
// let top = nativeView.getPaddingTop();
|
||||
// let right = nativeView.getPaddingRight();
|
||||
// let bottom = nativeView.getPaddingBottom();
|
||||
// nativeView.setPadding(left, top, right, bottom);
|
||||
// }
|
||||
|
||||
// private static setNativePaddingTop(view: View, value: number): void {
|
||||
// let nativeView = view._nativeView;
|
||||
// let density = layout.getDisplayDensity();
|
||||
// let left = nativeView.getPaddingLeft();
|
||||
// let top = (value + view.borderWidth) * density;
|
||||
// let right = nativeView.getPaddingRight();
|
||||
// let bottom = nativeView.getPaddingBottom();
|
||||
// nativeView.setPadding(left, top, right, bottom);
|
||||
// }
|
||||
|
||||
// private static setNativePaddingRight(view: View, value: number): void {
|
||||
// let nativeView = view._nativeView;
|
||||
// let density = layout.getDisplayDensity();
|
||||
// let left = nativeView.getPaddingLeft();
|
||||
// let top = nativeView.getPaddingTop();
|
||||
// let right = (value + view.borderWidth) * density;
|
||||
// let bottom = nativeView.getPaddingBottom();
|
||||
// nativeView.setPadding(left, top, right, bottom);
|
||||
// }
|
||||
|
||||
// private static setNativePaddingBottom(view: View, value: number): void {
|
||||
// let nativeView = view._nativeView;
|
||||
// let density = layout.getDisplayDensity();
|
||||
// let left = nativeView.getPaddingLeft();
|
||||
// let top = nativeView.getPaddingTop();
|
||||
// let right = nativeView.getPaddingRight();
|
||||
// let bottom = (value + view.borderWidth) * density;
|
||||
// nativeView.setPadding(left, top, right, bottom);
|
||||
// }
|
||||
|
||||
// // Rotate
|
||||
// private static setRotateProperty(view: View, newValue: any) {
|
||||
// view._nativeView.setRotation(newValue);
|
||||
// }
|
||||
|
||||
// private static resetRotateProperty(view: View, nativeValue: any) {
|
||||
// view._nativeView.setRotation(float(0));
|
||||
// }
|
||||
|
||||
// // ScaleX
|
||||
// private static setScaleXProperty(view: View, newValue: any) {
|
||||
// view._nativeView.setScaleX(newValue);
|
||||
// }
|
||||
|
||||
// private static resetScaleXProperty(view: View, nativeValue: any) {
|
||||
// view._nativeView.setScaleX(float(1.0));
|
||||
// }
|
||||
|
||||
// // ScaleY
|
||||
// private static setScaleYProperty(view: View, newValue: any) {
|
||||
// view._nativeView.setScaleY(newValue);
|
||||
// }
|
||||
|
||||
// private static resetScaleYProperty(view: View, nativeValue: any) {
|
||||
// view._nativeView.setScaleY(float(1.0));
|
||||
// }
|
||||
|
||||
// // TranslateX
|
||||
// private static setTranslateXProperty(view: View, newValue: any) {
|
||||
// view._nativeView.setTranslationX(newValue * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// private static resetTranslateXProperty(view: View, nativeValue: any) {
|
||||
// view._nativeView.setTranslationX(float(0));
|
||||
// }
|
||||
|
||||
// // TranslateY
|
||||
// private static setTranslateYProperty(view: View, newValue: any) {
|
||||
// view._nativeView.setTranslationY(newValue * layout.getDisplayDensity());
|
||||
// }
|
||||
|
||||
// private static resetTranslateYProperty(view: View, nativeValue: any) {
|
||||
// view._nativeView.setTranslationY(float(0));
|
||||
// }
|
||||
|
||||
// // z-index
|
||||
// private static getZIndexProperty(view: View): any {
|
||||
// return view.android.getZ ? view.android.getZ() : 0;
|
||||
// }
|
||||
|
||||
// private static setZIndexProperty(view: View, newValue: any) {
|
||||
// if (view.android.setZ) {
|
||||
// view.android.setZ(newValue);
|
||||
|
||||
// if (view.android instanceof android.widget.Button) {
|
||||
// view.android.setStateListAnimator(null);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// private static resetZIndexProperty(view: View, nativeValue: any) {
|
||||
// if (view.android.setZ) {
|
||||
// view.android.setZ(nativeValue);
|
||||
// }
|
||||
// }
|
||||
|
||||
// public static registerHandlers() {
|
||||
// style.registerHandler(style.visibilityProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setVisibilityProperty,
|
||||
// ViewStyler.resetVisibilityProperty));
|
||||
|
||||
// style.registerHandler(style.opacityProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setOpacityProperty,
|
||||
// ViewStyler.resetOpacityProperty));
|
||||
|
||||
// style.registerHandler(style.minWidthProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setMinWidthProperty,
|
||||
// ViewStyler.resetMinWidthProperty));
|
||||
|
||||
// style.registerHandler(style.minHeightProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setMinHeightProperty,
|
||||
// ViewStyler.resetMinHeightProperty))
|
||||
|
||||
// // Use the same handler for all background/border properties
|
||||
// // Note: There is no default value getter - the default value is handled in background.ad.onBackgroundOrBorderPropertyChanged
|
||||
// let backgroundAndBorderHandler = new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setBackgroundAndBorder,
|
||||
// ViewStyler.resetBackgroundAndBorder);
|
||||
|
||||
// style.registerHandler(style.backgroundInternalProperty, backgroundAndBorderHandler);
|
||||
|
||||
// style.registerHandler(style.nativeLayoutParamsProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setNativeLayoutParamsProperty,
|
||||
// ViewStyler.resetNativeLayoutParamsProperty));
|
||||
|
||||
// style.registerHandler(style.paddingLeftProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingLeft, ViewStyler.setNativePaddingLeft, ViewStyler.getNativePaddingLeft), "TextBase");
|
||||
// style.registerHandler(style.paddingTopProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingTop, ViewStyler.setNativePaddingTop, ViewStyler.getNativePaddingTop), "TextBase");
|
||||
// style.registerHandler(style.paddingRightProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingRight, ViewStyler.setNativePaddingRight, ViewStyler.getNativePaddingRight), "TextBase");
|
||||
// style.registerHandler(style.paddingBottomProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingBottom, ViewStyler.setNativePaddingBottom, ViewStyler.getNativePaddingBottom), "TextBase");
|
||||
|
||||
// style.registerHandler(style.paddingLeftProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingLeft, ViewStyler.setNativePaddingLeft, ViewStyler.getNativePaddingLeft), "Button");
|
||||
// style.registerHandler(style.paddingTopProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingTop, ViewStyler.setNativePaddingTop, ViewStyler.getNativePaddingTop), "Button");
|
||||
// style.registerHandler(style.paddingRightProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingRight, ViewStyler.setNativePaddingRight, ViewStyler.getNativePaddingRight), "Button");
|
||||
// style.registerHandler(style.paddingBottomProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingBottom, ViewStyler.setNativePaddingBottom, ViewStyler.getNativePaddingBottom), "Button");
|
||||
|
||||
// style.registerHandler(style.paddingLeftProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingLeft, ViewStyler.setNativePaddingLeft, ViewStyler.getNativePaddingLeft), "LayoutBase");
|
||||
// style.registerHandler(style.paddingTopProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingTop, ViewStyler.setNativePaddingTop, ViewStyler.getNativePaddingTop), "LayoutBase");
|
||||
// style.registerHandler(style.paddingRightProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingRight, ViewStyler.setNativePaddingRight, ViewStyler.getNativePaddingRight), "LayoutBase");
|
||||
// style.registerHandler(style.paddingBottomProperty,
|
||||
// new style.StylePropertyChangedHandler(ViewStyler.setNativePaddingBottom, ViewStyler.setNativePaddingBottom, ViewStyler.getNativePaddingBottom), "LayoutBase");
|
||||
|
||||
// style.registerHandler(style.rotateProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setRotateProperty,
|
||||
// ViewStyler.resetRotateProperty));
|
||||
|
||||
// style.registerHandler(style.scaleXProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setScaleXProperty,
|
||||
// ViewStyler.resetScaleXProperty));
|
||||
|
||||
// style.registerHandler(style.scaleYProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setScaleYProperty,
|
||||
// ViewStyler.resetScaleYProperty));
|
||||
|
||||
// style.registerHandler(style.translateXProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setTranslateXProperty,
|
||||
// ViewStyler.resetTranslateXProperty));
|
||||
|
||||
// style.registerHandler(style.translateYProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setTranslateYProperty,
|
||||
// ViewStyler.resetTranslateYProperty));
|
||||
|
||||
// if (parseInt(device.sdkVersion, 10) >= 21) {
|
||||
// style.registerHandler(style.zIndexProperty, new style.StylePropertyChangedHandler(
|
||||
// ViewStyler.setZIndexProperty,
|
||||
// ViewStyler.resetZIndexProperty,
|
||||
// ViewStyler.getZIndexProperty));
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
type NativeSetter = { (view: android.view.View, value: number): void };
|
||||
type NativeGetter = { (view: android.view.View): number };
|
||||
const percentNotSupported = (view: android.view.View, value: number) => { throw new Error("PercentLength is not supported."); };
|
||||
interface NativePercentLengthPropertyOptions {
|
||||
key: string | symbol;
|
||||
auto?: number;
|
||||
getPixels: NativeGetter;
|
||||
setPixels: NativeSetter;
|
||||
setPercent?: NativeSetter
|
||||
}
|
||||
function createNativePercentLengthProperty({key, auto = 0, getPixels, setPixels, setPercent = percentNotSupported}: NativePercentLengthPropertyOptions) {
|
||||
Object.defineProperty(View, key, {
|
||||
get: function (this: View) { return { value: getPixels(this.nativeView), unit: "px" } },
|
||||
set: function (this: View, length: PercentLength) {
|
||||
if (length == "auto") {
|
||||
setPixels(this.nativeView, auto);
|
||||
} else if (typeof length === "number") {
|
||||
setPixels(this.nativeView, length * layout.getDisplayDensity());
|
||||
} else if (length.unit == "dip") {
|
||||
setPixels(this.nativeView, length.value * layout.getDisplayDensity());
|
||||
} else if (length.unit == "px") {
|
||||
setPixels(this.nativeView, length.value);
|
||||
} else if (length.unit == "%") {
|
||||
setPercent(this.nativeView, length.value);
|
||||
} else {
|
||||
throw new Error(`Unsupported PercentLength ${length}`);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const ViewHelper = org.nativescript.widgets.ViewHelper;
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: marginTopProperty.native,
|
||||
getPixels: ViewHelper.getMarginTop,
|
||||
setPixels: ViewHelper.setMarginTop,
|
||||
setPercent: ViewHelper.setMarginTopPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: marginRightProperty.native,
|
||||
getPixels: ViewHelper.getMarginRight,
|
||||
setPixels: ViewHelper.setMarginRight,
|
||||
setPercent: ViewHelper.setMarginRightPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: marginBottomProperty.native,
|
||||
getPixels: ViewHelper.getMarginBottom,
|
||||
setPixels: ViewHelper.setMarginBottom,
|
||||
setPercent: ViewHelper.setMarginBottomPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: marginLeftProperty.native,
|
||||
getPixels: ViewHelper.getMarginLeft,
|
||||
setPixels: ViewHelper.setMarginLeft,
|
||||
setPercent: ViewHelper.setMarginLeftPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: paddingTopProperty.native,
|
||||
getPixels: ViewHelper.getPaddingTop,
|
||||
setPixels: ViewHelper.setPaddingTop
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: paddingRightProperty.native,
|
||||
getPixels: ViewHelper.getPaddingRight,
|
||||
setPixels: ViewHelper.setPaddingRight
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: paddingBottomProperty.native,
|
||||
getPixels: ViewHelper.getPaddingBottom,
|
||||
setPixels: ViewHelper.setPaddingBottom
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: paddingLeftProperty.native,
|
||||
getPixels: ViewHelper.getPaddingLeft,
|
||||
setPixels: ViewHelper.setPaddingLeft
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: widthProperty.native,
|
||||
auto: android.view.ViewGroup.LayoutParams.MATCH_PARENT,
|
||||
getPixels: ViewHelper.getWidth,
|
||||
setPixels: ViewHelper.setWidth,
|
||||
setPercent: ViewHelper.setWidthPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: heightProperty.native,
|
||||
auto: android.view.ViewGroup.LayoutParams.MATCH_PARENT,
|
||||
getPixels: ViewHelper.getHeight,
|
||||
setPixels: ViewHelper.setHeight,
|
||||
setPercent: ViewHelper.setHeightPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: widthProperty.native,
|
||||
auto: android.view.ViewGroup.LayoutParams.MATCH_PARENT,
|
||||
getPixels: ViewHelper.getWidth,
|
||||
setPixels: ViewHelper.setWidth,
|
||||
setPercent: ViewHelper.setWidthPercent
|
||||
});
|
||||
|
||||
createNativePercentLengthProperty({
|
||||
key: heightProperty.native,
|
||||
auto: android.view.ViewGroup.LayoutParams.MATCH_PARENT,
|
||||
getPixels: ViewHelper.getHeight,
|
||||
setPixels: ViewHelper.setHeight,
|
||||
setPercent: ViewHelper.setHeightPercent
|
||||
});
|
||||
|
||||
export class CustomLayoutView extends View implements CustomLayoutViewDefinition {
|
||||
private _viewGroup: android.view.ViewGroup;
|
||||
|
||||
4
tns-core-modules/ui/core/view.d.ts
vendored
4
tns-core-modules/ui/core/view.d.ts
vendored
@ -95,7 +95,7 @@ declare module "ui/core/view" {
|
||||
height: number;
|
||||
}
|
||||
|
||||
export interface Length {
|
||||
export type Length = "auto" | number | {
|
||||
readonly unit: "dip" | "px";
|
||||
readonly value: number;
|
||||
}
|
||||
@ -104,7 +104,7 @@ declare module "ui/core/view" {
|
||||
export function equals(a: Length, b: Length): boolean;
|
||||
}
|
||||
|
||||
export interface PercentLength {
|
||||
export type PercentLength = "auto" | number | {
|
||||
readonly unit: "%" | "dip" | "px";
|
||||
readonly value: number;
|
||||
}
|
||||
|
||||
@ -16,16 +16,7 @@ export module knownMultiTemplates {
|
||||
export const itemTemplates = "itemTemplates";
|
||||
}
|
||||
|
||||
function getLengthEffectiveValue(param: Length): number {
|
||||
switch (param.unit) {
|
||||
case "px":
|
||||
return Math.round(param.value);
|
||||
|
||||
default:
|
||||
case "dip":
|
||||
return Math.round(layout.getDisplayDensity() * param.value);
|
||||
}
|
||||
}
|
||||
const autoEffectiveRowHeight = -1;
|
||||
|
||||
export abstract class ListViewBase extends View implements ListViewDefinition {
|
||||
public static itemLoadingEvent = "itemLoading";
|
||||
@ -34,6 +25,7 @@ export abstract class ListViewBase extends View implements ListViewDefinition {
|
||||
// TODO: get rid of such hacks.
|
||||
public static knownFunctions = ["itemTemplateSelector"]; //See component-builder.ts isKnownFunction
|
||||
|
||||
|
||||
private _itemTemplateSelector: (item: any, index: number, items: any) => string;
|
||||
private _itemTemplateSelectorBindable = new Bindable();
|
||||
public _defaultTemplate: KeyedTemplate = {
|
||||
@ -47,7 +39,7 @@ export abstract class ListViewBase extends View implements ListViewDefinition {
|
||||
}
|
||||
|
||||
public _itemTemplatesInternal = new Array<KeyedTemplate>(this._defaultTemplate);
|
||||
public _effectiveRowHeight: number = -1;
|
||||
public _effectiveRowHeight: number = autoEffectiveRowHeight;
|
||||
public rowHeight: Length;
|
||||
public separatorColor: Color;
|
||||
public items: any[] | ItemsSource;
|
||||
@ -175,7 +167,7 @@ export const itemTemplatesProperty = new Property<ListViewBase, string | Array<K
|
||||
})
|
||||
itemTemplatesProperty.register(ListViewBase);
|
||||
|
||||
const defaultRowHeight: Length = { value: -1, unit: "px" };
|
||||
const defaultRowHeight: Length = "auto";
|
||||
/**
|
||||
* Represents the observable property backing the rowHeight property of each ListView instance.
|
||||
*/
|
||||
@ -186,7 +178,7 @@ export const rowHeightProperty = new CoercibleProperty<ListViewBase, Length>({
|
||||
return target._nativeView ? value : defaultRowHeight;
|
||||
},
|
||||
valueChanged: (target, oldValue, newValue) => {
|
||||
target._effectiveRowHeight = getLengthEffectiveValue(newValue);
|
||||
target._effectiveRowHeight = Length.toDevicePixels(newValue, autoEffectiveRowHeight);
|
||||
target._onRowHeightPropertyChanged(oldValue, newValue);
|
||||
}, valueConverter: Length.parse
|
||||
});
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
import { Background as BackgroundDefinition, BackgroundDrawParams } from "ui/styling/background";
|
||||
import { Color, layout } from "ui/core/view";
|
||||
import { ImageSource } from "image-source";
|
||||
import * as cssValue from "css-value";
|
||||
import { CSSValue } from "css-value";
|
||||
import { CSSValue, parse as cssParse } from "css-value";
|
||||
export * from "ui/core/view";
|
||||
|
||||
export class Background implements BackgroundDefinition {
|
||||
@ -195,7 +194,7 @@ export class Background implements BackgroundDefinition {
|
||||
|
||||
// size
|
||||
if (this.size) {
|
||||
let values = cssValue.parse(this.size);
|
||||
let values = cssParse(this.size);
|
||||
|
||||
if (values.length === 2) {
|
||||
let vx = values[0];
|
||||
@ -274,7 +273,7 @@ export class Background implements BackgroundDefinition {
|
||||
}
|
||||
|
||||
private static parsePosition(pos: string): { x: CSSValue, y: CSSValue } {
|
||||
let values = cssValue.parse(pos);
|
||||
let values = cssParse(pos);
|
||||
|
||||
if (values.length === 2) {
|
||||
return {
|
||||
|
||||
Reference in New Issue
Block a user