From 1202cb7288935888fbc0db3ffda09761059ab09d Mon Sep 17 00:00:00 2001 From: Hristo Hristov Date: Tue, 6 Dec 2016 17:50:44 +0200 Subject: [PATCH] almost all without layouts --- .../ui/action-bar/action-bar-common.ts | 10 +- .../ui/action-bar/action-bar.android.ts | 15 +- .../ui/action-bar/action-bar.d.ts | 5 +- .../ui/action-bar/action-bar.ios.ts | 26 ++-- .../activity-indicator-common.ts | 7 +- .../activity-indicator.android.ts | 3 +- .../activity-indicator.ios.ts | 3 +- .../ui/animation/animation-common.ts | 22 +-- .../ui/animation/animation.android.ts | 35 ++--- tns-core-modules/ui/animation/animation.d.ts | 3 +- .../ui/animation/animation.ios.ts | 35 ++--- .../ui/animation/keyframe-animation.ts | 8 +- tns-core-modules/ui/border/border.ts | 7 +- tns-core-modules/ui/button/button-common.ts | 2 + tns-core-modules/ui/button/button.android.ts | 5 +- tns-core-modules/ui/button/button.d.ts | 4 +- tns-core-modules/ui/button/button.ios.ts | 142 ++++++++++++------ .../ui/content-view/content-view.d.ts | 6 +- .../ui/content-view/content-view.ts | 13 +- tns-core-modules/ui/core/properties.ts | 4 +- tns-core-modules/ui/core/view-base.ts | 12 +- tns-core-modules/ui/core/view-common.ts | 131 +++++++++------- tns-core-modules/ui/core/view.android.ts | 34 ++--- tns-core-modules/ui/core/view.d.ts | 50 ++++-- tns-core-modules/ui/core/view.ios.ts | 5 +- .../ui/date-picker/date-picker-common.ts | 19 ++- .../ui/date-picker/date-picker.d.ts | 17 +-- tns-core-modules/ui/definitions.d.ts | 37 +++-- tns-core-modules/ui/dialogs/dialogs-common.ts | 5 +- .../editable-text-base-common.ts | 11 +- .../editable-text-base.android.ts | 7 +- .../editable-text-base.d.ts | 6 +- .../editable-text-base.ios.ts | 4 +- tns-core-modules/ui/frame/frame.d.ts | 5 +- .../ui/gestures/gestures-common.ts | 3 +- .../ui/gestures/gestures.android.ts | 17 +-- tns-core-modules/ui/gestures/gestures.d.ts | 5 +- .../ui/html-view/html-view.android.ts | 3 +- tns-core-modules/ui/html-view/html-view.d.ts | 3 +- .../ui/html-view/html-view.ios.ts | 3 +- tns-core-modules/ui/image/image-common.ts | 11 +- tns-core-modules/ui/image/image.android.ts | 9 +- tns-core-modules/ui/image/image.d.ts | 7 +- tns-core-modules/ui/image/image.ios.ts | 4 +- tns-core-modules/ui/label/label.ios.ts | 80 +++++----- .../ui/list-picker/list-picker-common.ts | 12 +- .../ui/list-picker/list-picker.d.ts | 3 +- .../ui/list-view/list-view-common.ts | 23 +-- .../ui/list-view/list-view.android.ts | 10 +- tns-core-modules/ui/list-view/list-view.d.ts | 5 +- .../ui/list-view/list-view.ios.ts | 10 +- tns-core-modules/ui/page/page-common.ts | 28 ++-- tns-core-modules/ui/page/page.android.ts | 4 +- tns-core-modules/ui/page/page.d.ts | 6 +- tns-core-modules/ui/page/page.ios.ts | 7 +- .../ui/placeholder/placeholder.d.ts | 3 +- .../ui/progress/progress-common.ts | 4 +- .../ui/progress/progress.android.ts | 3 +- tns-core-modules/ui/progress/progress.d.ts | 3 +- tns-core-modules/ui/progress/progress.ios.ts | 3 +- .../proxy-view-container.ts | 3 +- tns-core-modules/ui/repeater/repeater.d.ts | 4 +- tns-core-modules/ui/repeater/repeater.ts | 17 +-- .../ui/scroll-view/scroll-view-common.ts | 14 +- .../ui/scroll-view/scroll-view.android.ts | 4 +- .../ui/scroll-view/scroll-view.d.ts | 4 +- .../ui/scroll-view/scroll-view.ios.ts | 4 +- .../ui/search-bar/search-bar-common.ts | 11 +- .../ui/search-bar/search-bar.android.ts | 8 +- .../ui/search-bar/search-bar.d.ts | 5 +- .../ui/search-bar/search-bar.ios.ts | 8 +- .../ui/segmented-bar/segmented-bar-common.ts | 16 +- .../ui/segmented-bar/segmented-bar.android.ts | 10 +- .../ui/segmented-bar/segmented-bar.d.ts | 11 +- .../ui/segmented-bar/segmented-bar.ios.ts | 9 +- tns-core-modules/ui/slider/slider-common.ts | 5 +- tns-core-modules/ui/slider/slider.android.ts | 9 +- tns-core-modules/ui/slider/slider.d.ts | 5 +- tns-core-modules/ui/slider/slider.ios.ts | 9 +- .../ui/styling/background-common.ts | 20 +-- .../ui/styling/background.android.ts | 3 +- tns-core-modules/ui/styling/background.d.ts | 3 +- tns-core-modules/ui/styling/background.ios.ts | 26 +++- tns-core-modules/ui/styling/style.d.ts | 11 +- tns-core-modules/ui/styling/style.ts | 11 +- tns-core-modules/ui/switch/switch.android.ts | 6 +- tns-core-modules/ui/switch/switch.d.ts | 3 +- tns-core-modules/ui/switch/switch.ios.ts | 6 +- .../ui/tab-view/tab-view-common.ts | 12 +- .../ui/tab-view/tab-view.android.ts | 16 +- tns-core-modules/ui/tab-view/tab-view.d.ts | 8 +- tns-core-modules/ui/tab-view/tab-view.ios.ts | 7 +- .../ui/text-base/text-base-common.ts | 28 ++-- .../ui/text-base/text-base.android.ts | 5 +- tns-core-modules/ui/text-base/text-base.d.ts | 6 +- .../ui/text-base/text-base.ios.ts | 5 +- .../ui/text-field/text-field-common.ts | 5 +- .../ui/text-field/text-field.d.ts | 3 +- .../ui/text-view/text-view.ios.ts | 4 +- .../ui/time-picker/time-picker-common.ts | 35 +++-- .../ui/time-picker/time-picker.android.ts | 1 + .../ui/time-picker/time-picker.d.ts | 3 +- .../ui/transition/fade-transition.ios.ts | 16 +- .../ui/transition/flip-transition.android.ts | 4 +- .../ui/transition/slide-transition.d.ts | 2 +- .../ui/transition/slide-transition.ios.ts | 16 +- .../ui/transition/transition.android.ts | 14 +- .../ui/web-view/web-view-common.ts | 25 +-- .../ui/web-view/web-view.android.ts | 8 +- tns-core-modules/ui/web-view/web-view.d.ts | 4 +- tns-core-modules/ui/web-view/web-view.ios.ts | 6 +- 111 files changed, 718 insertions(+), 727 deletions(-) diff --git a/tns-core-modules/ui/action-bar/action-bar-common.ts b/tns-core-modules/ui/action-bar/action-bar-common.ts index 5fd3af7d2..6eda5e9e5 100644 --- a/tns-core-modules/ui/action-bar/action-bar-common.ts +++ b/tns-core-modules/ui/action-bar/action-bar-common.ts @@ -6,13 +6,9 @@ NavigationButton } from "ui/action-bar"; import { Page } from "ui/page"; -import { Bindable } from "ui/core/bindable"; -import { View, horizontalAlignmentProperty, verticalAlignmentProperty } from "ui/core/view"; -import { Property } from "ui/core/properties"; -import { unsetValue } from "ui/core/dependency-observable"; -import { ViewBase } from "ui/core/view-base"; +import { View, ViewBase, Bindable, Property, unsetValue, horizontalAlignmentProperty, verticalAlignmentProperty } from "ui/core/view"; -let ACTION_ITEMS = "actionItems"; +export * from "ui/core/view"; export module knownCollections { export var actionItems = "actionItems"; @@ -119,7 +115,7 @@ export class ActionBarBase extends View implements ActionBarDefinition { } public _addArrayFromBuilder(name: string, value: Array) { - if (name === ACTION_ITEMS) { + if (name === "actionItems") { this.actionItems.setItems(value); } } diff --git a/tns-core-modules/ui/action-bar/action-bar.android.ts b/tns-core-modules/ui/action-bar/action-bar.android.ts index 33c654650..852291f88 100644 --- a/tns-core-modules/ui/action-bar/action-bar.android.ts +++ b/tns-core-modules/ui/action-bar/action-bar.android.ts @@ -1,10 +1,7 @@ import { AndroidActionBarSettings as AndroidActionBarSettingsDefinition, AndroidActionItemSettings } from "ui/action-bar"; -import { ActionItemBase, ActionBarBase, isVisible } from "./action-bar-common"; -import { isDefined, isNullOrUndefined, isString } from "utils/types"; -import { View, colorProperty } from "ui/core/view"; +import { ActionItemBase, ActionBarBase, isVisible, View, colorProperty, Color } from "./action-bar-common"; import { RESOURCE_PREFIX } from "utils/utils"; import { fromFileOrResource } from "image-source"; -import { Color } from "color"; import * as application from "application"; import * as trace from "trace"; @@ -203,7 +200,7 @@ export class ActionBar extends ActionBarBase { let visibility = getIconVisibility(this.android.iconVisibility); if (visibility) { let icon = this.android.icon; - if (isDefined(icon)) { + if (icon !== undefined) { let drawableOrId = getDrawableOrResourceId(icon, this._appResources); if (drawableOrId) { this.nativeView.setLogo(drawableOrId); @@ -223,7 +220,7 @@ export class ActionBar extends ActionBarBase { if (!this.titleView) { // No title view - show the title let title = this.title; - if (isDefined(title)) { + if (title !== undefined) { this.nativeView.setTitle(title); } else { let appContext = application.android.context; @@ -298,11 +295,11 @@ export class ActionBar extends ActionBarBase { this.nativeView = undefined; } - public _addViewToNativeVisualTree(child: View, atIndex?: number): boolean { + public _addViewToNativeVisualTree(child: View, atIndex: number = Number.MAX_VALUE): boolean { super._addViewToNativeVisualTree(child); if (this.nativeView && child._nativeView) { - if (isNullOrUndefined(atIndex) || atIndex >= this._nativeView.getChildCount()) { + if (atIndex >= this._nativeView.getChildCount()) { this.nativeView.addView(child._nativeView); } else { @@ -340,7 +337,7 @@ export class ActionBar extends ActionBarBase { let defaultTitleTextColor: number; function getDrawableOrResourceId(icon: string, resources: android.content.res.Resources): any { - if (!isString(icon)) { + if (typeof icon !== "string") { return undefined; } diff --git a/tns-core-modules/ui/action-bar/action-bar.d.ts b/tns-core-modules/ui/action-bar/action-bar.d.ts index 81a076dbb..5516899e0 100644 --- a/tns-core-modules/ui/action-bar/action-bar.d.ts +++ b/tns-core-modules/ui/action-bar/action-bar.d.ts @@ -2,11 +2,8 @@ * Contains the action bar related classes. */ declare module "ui/action-bar" { - import { EventData } from "data/observable"; - import { View, AddArrayFromBuilder, AddChildFromBuilder } from "ui/core/view"; - import { Property } from "ui/core/properties"; + import { EventData, ViewBase, View, AddArrayFromBuilder, AddChildFromBuilder, Property } from "ui/core/view"; import { Page } from "ui/page"; - import { ViewBase } from "ui/core/view-base"; /** * Provides an abstraction over the ActionBar (android) and NavigationBar (iOS). diff --git a/tns-core-modules/ui/action-bar/action-bar.ios.ts b/tns-core-modules/ui/action-bar/action-bar.ios.ts index b892f6651..009ca1f93 100644 --- a/tns-core-modules/ui/action-bar/action-bar.ios.ts +++ b/tns-core-modules/ui/action-bar/action-bar.ios.ts @@ -1,11 +1,7 @@ import { IOSActionItemSettings, ActionItem as ActionItemDefinition } from "ui/action-bar"; -import { ActionItemBase, ActionBarBase, isVisible } from "./action-bar-common"; -import utils = require("utils/utils"); +import { ActionItemBase, ActionBarBase, isVisible, View, colorProperty, backgroundColorProperty, backgroundInternalProperty, Color, Background, layout } from "./action-bar-common"; import { Frame, topmost as topmostFrame } from "ui/frame"; -import { View, colorProperty, backgroundColorProperty, backgroundInternalProperty } from "ui/core/view"; import { ImageSource, fromFileOrResource } from "image-source"; -import { Color } from "color"; -import { Background } from "ui/styling/background"; export * from "./action-bar-common"; @@ -221,11 +217,11 @@ export class ActionBar extends ActionBarBase { private _navigationBarHeight: number = 0; public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) { - let width = utils.layout.getMeasureSpecSize(widthMeasureSpec); - let widthMode = utils.layout.getMeasureSpecMode(widthMeasureSpec); + let width = layout.getMeasureSpecSize(widthMeasureSpec); + let widthMode = layout.getMeasureSpecMode(widthMeasureSpec); - let height = utils.layout.getMeasureSpecSize(heightMeasureSpec); - let heightMode = utils.layout.getMeasureSpecMode(heightMeasureSpec); + let height = layout.getMeasureSpecSize(heightMeasureSpec); + let heightMode = layout.getMeasureSpecMode(heightMeasureSpec); let navBarWidth = 0; let navBarHeight = 0; @@ -235,8 +231,8 @@ export class ActionBar extends ActionBarBase { let navBar: UIView = frame.ios.controller.navigationBar; if (!navBar.hidden) { let navBarSize = navBar.sizeThatFits(CGSizeMake( - (widthMode === utils.layout.UNSPECIFIED) ? Number.POSITIVE_INFINITY : width, - (heightMode === utils.layout.UNSPECIFIED) ? Number.POSITIVE_INFINITY : height)); + (widthMode === layout.UNSPECIFIED) ? Number.POSITIVE_INFINITY : width, + (heightMode === layout.UNSPECIFIED) ? Number.POSITIVE_INFINITY : height)); navBarWidth = navBarSize.width; navBarHeight = navBarSize.height; } @@ -245,15 +241,15 @@ export class ActionBar extends ActionBarBase { this._navigationBarHeight = navBarHeight; if (this.titleView) { View.measureChild(this, this.titleView, - utils.layout.makeMeasureSpec(width, utils.layout.AT_MOST), - utils.layout.makeMeasureSpec(navBarHeight, utils.layout.AT_MOST)); + layout.makeMeasureSpec(width, layout.AT_MOST), + layout.makeMeasureSpec(navBarHeight, layout.AT_MOST)); } this.actionItems.getItems().forEach((actionItem) => { if (actionItem.actionView) { View.measureChild(this, actionItem.actionView, - utils.layout.makeMeasureSpec(width, utils.layout.AT_MOST), - utils.layout.makeMeasureSpec(navBarHeight, utils.layout.AT_MOST)); + layout.makeMeasureSpec(width, layout.AT_MOST), + layout.makeMeasureSpec(navBarHeight, layout.AT_MOST)); } }); diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator-common.ts b/tns-core-modules/ui/activity-indicator/activity-indicator-common.ts index 77fa0e8ea..3a66f366a 100644 --- a/tns-core-modules/ui/activity-indicator/activity-indicator-common.ts +++ b/tns-core-modules/ui/activity-indicator/activity-indicator-common.ts @@ -1,10 +1,11 @@ import { ActivityIndicator as ActivityIndicatorDefinition } from "ui/activity-indicator"; -import { View } from "ui/core/view"; -import { Property } from "ui/core/properties"; +import { View, Property, booleanConverter } from "ui/core/view"; + +export * from "ui/core/view"; export class ActivityIndicatorBase extends View implements ActivityIndicatorDefinition { public busy: boolean; } -export let busyProperty = new Property({ name: "busy", defaultValue: false }); +export let busyProperty = new Property({ name: "busy", defaultValue: false, valueConverter: booleanConverter }); busyProperty.register(ActivityIndicatorBase); \ No newline at end of file diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts index 5d0c080b5..5c8b7b1b8 100644 --- a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts +++ b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts @@ -1,5 +1,4 @@ -import { ActivityIndicatorBase, busyProperty } from "./activity-indicator-common"; -import { colorProperty, visibilityProperty } from "ui/core/view"; +import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty } from "./activity-indicator-common"; export * from "./activity-indicator-common"; diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts index 6dd98bdef..d96349ee9 100644 --- a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts +++ b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts @@ -1,5 +1,4 @@ -import { ActivityIndicatorBase, busyProperty } from "./activity-indicator-common"; -import { colorProperty, visibilityProperty } from "ui/core/view"; +import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty } from "./activity-indicator-common"; import { ios } from "utils/utils"; export * from "./activity-indicator-common"; diff --git a/tns-core-modules/ui/animation/animation-common.ts b/tns-core-modules/ui/animation/animation-common.ts index 8671b43f5..78a92d670 100644 --- a/tns-core-modules/ui/animation/animation-common.ts +++ b/tns-core-modules/ui/animation/animation-common.ts @@ -5,11 +5,13 @@ AnimationDefinition, Pair } from "ui/animation"; -import { View } from "ui/core/view"; -import { Color } from "color"; -import { isDefined, isNumber, isString } from "utils/types"; + +import { View, Color } from "ui/core/view"; import * as trace from "trace"; +export * from "ui/core/view"; +export { trace }; + export module Properties { export var opacity = "opacity"; export var backgroundColor = "backgroundColor"; @@ -149,7 +151,7 @@ export abstract class AnimationBase implements AnimationBaseDefinition { } for (let item in animationDefinition) { - if (!isDefined(animationDefinition[item])) { + if (typeof animationDefinition[item] === "undefined") { continue; } @@ -157,19 +159,17 @@ export abstract class AnimationBase implements AnimationBaseDefinition { item === Properties.rotate || item === "duration" || item === "delay" || - item === "iterations") && !isNumber(animationDefinition[item])) { + item === "iterations") && typeof animationDefinition[item] !== "number") { throw new Error(`Property ${item} must be valid number. Value: ${animationDefinition[item]}`); - } else if ((item === Properties.scale || - item === Properties.translate) && - (!isNumber((animationDefinition[item]).x) || - !isNumber((animationDefinition[item]).y))) { + } else if ((item === Properties.scale || item === Properties.translate) && + (typeof (animationDefinition[item]).x !== "number" || typeof (animationDefinition[item]).y !== "number")) { throw new Error(`Property ${item} must be valid Pair. Value: ${animationDefinition[item]}`); } else if (item === Properties.backgroundColor && !Color.isValid(animationDefinition.backgroundColor)) { throw new Error(`Property ${item} must be valid color. Value: ${animationDefinition[item]}`); } } - var propertyAnimations = new Array(); + const propertyAnimations = new Array(); // opacity if (animationDefinition.opacity !== undefined) { @@ -189,7 +189,7 @@ export abstract class AnimationBase implements AnimationBaseDefinition { propertyAnimations.push({ target: animationDefinition.target, property: Properties.backgroundColor, - value: isString(animationDefinition.backgroundColor) ? + value: typeof animationDefinition.backgroundColor === "string" ? new Color(animationDefinition.backgroundColor) : animationDefinition.backgroundColor, duration: animationDefinition.duration, delay: animationDefinition.delay, diff --git a/tns-core-modules/ui/animation/animation.android.ts b/tns-core-modules/ui/animation/animation.android.ts index 42e9430ab..f9ed0474a 100644 --- a/tns-core-modules/ui/animation/animation.android.ts +++ b/tns-core-modules/ui/animation/animation.android.ts @@ -1,16 +1,13 @@ import { AnimationDefinition } from "ui/animation"; -import { AnimationBase, Properties, PropertyAnimation, CubicBezierAnimationCurve, AnimationPromise } from "./animation-common"; -import { Color } from "color"; -import { isNullOrUndefined } from "utils/types"; -import { AnimationCurve } from "ui/enums"; -import lazy from "utils/lazy"; -import { CacheLayerType, layout } from "utils/utils"; import { + AnimationBase, Properties, PropertyAnimation, CubicBezierAnimationCurve, AnimationPromise, opacityProperty, backgroundColorProperty, rotateProperty, translateXProperty, translateYProperty, - scaleXProperty, scaleYProperty -} from "ui/core/view"; -import * as trace from "trace"; + scaleXProperty, scaleYProperty, Color, layout, trace +} from "./animation-common"; + +import { CacheLayerType } from "utils/utils"; +import lazy from "utils/lazy"; export * from "./animation-common"; @@ -41,32 +38,32 @@ propertyKeys[Properties.translate] = Symbol(keyPrefix + Properties.translate); export function _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | android.view.animation.Interpolator): android.view.animation.Interpolator { switch (curve) { - case AnimationCurve.easeIn: + case "easeIn": if (trace.enabled) { trace.write("Animation curve resolved to android.view.animation.AccelerateInterpolator(1).", trace.categories.Animation); } return easeIn(); - case AnimationCurve.easeOut: + case "easeOut": if (trace.enabled) { trace.write("Animation curve resolved to android.view.animation.DecelerateInterpolator(1).", trace.categories.Animation); } return easeOut(); - case AnimationCurve.easeInOut: + case "easeInOut": if (trace.enabled) { trace.write("Animation curve resolved to android.view.animation.AccelerateDecelerateInterpolator().", trace.categories.Animation); } return easeInOut(); - case AnimationCurve.linear: + case "linear": if (trace.enabled) { trace.write("Animation curve resolved to android.view.animation.LinearInterpolator().", trace.categories.Animation); } return linear(); - case AnimationCurve.spring: + case "spring": if (trace.enabled) { trace.write("Animation curve resolved to android.view.animation.BounceInterpolator().", trace.categories.Animation); } return bounce(); - case AnimationCurve.ease: + case "ease": return (android).support.v4.view.animation.PathInterpolatorCompat.create(0.25, 0.1, 0.25, 1.0); default: if (trace.enabled) { @@ -172,7 +169,7 @@ export class Animation extends AnimationBase { } public _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | android.view.animation.Interpolator): android.view.animation.Interpolator { - return _resolveAnimationCurve(curve); + return _resolveAnimationCurve(curve); } private _onAndroidAnimationEnd() { @@ -209,15 +206,15 @@ export class Animation extends AnimationBase { trace.write("Creating ObjectAnimator(s) for animation: " + Animation._getAnimationInfo(propertyAnimation) + "...", trace.categories.Animation); } - if (isNullOrUndefined(propertyAnimation.target)) { + if (!propertyAnimation.target) { throw new Error("Animation target cannot be null or undefined!"); } - if (isNullOrUndefined(propertyAnimation.property)) { + if (!propertyAnimation.property) { throw new Error("Animation property cannot be null or undefined!"); } - if (isNullOrUndefined(propertyAnimation.value)) { + if (!propertyAnimation.value) { throw new Error("Animation value cannot be null or undefined!"); } diff --git a/tns-core-modules/ui/animation/animation.d.ts b/tns-core-modules/ui/animation/animation.d.ts index 90361e6e5..c33b29142 100644 --- a/tns-core-modules/ui/animation/animation.d.ts +++ b/tns-core-modules/ui/animation/animation.d.ts @@ -1,6 +1,5 @@ declare module "ui/animation" { - import { View } from "ui/core/view"; - import { Color } from "color"; + import { View, Color } from "ui/core/view"; /** * Defines animation options for the View.animate method. diff --git a/tns-core-modules/ui/animation/animation.ios.ts b/tns-core-modules/ui/animation/animation.ios.ts index 3b41fc09d..1fdd83c3d 100644 --- a/tns-core-modules/ui/animation/animation.ios.ts +++ b/tns-core-modules/ui/animation/animation.ios.ts @@ -1,18 +1,15 @@ import { AnimationDefinition } from "ui/animation"; -import { AnimationBase, Properties, PropertyAnimation, CubicBezierAnimationCurve, AnimationPromise } from "./animation-common"; -import { View } from "ui/core/view"; -import { AnimationCurve } from "ui/enums"; -import * as utils from "utils/utils"; import { - opacityProperty, backgroundColorProperty, rotateProperty, + AnimationBase, Properties, PropertyAnimation, CubicBezierAnimationCurve, AnimationPromise, View, opacityProperty, backgroundColorProperty, rotateProperty, translateXProperty, translateYProperty, - scaleXProperty, scaleYProperty -} from "ui/core/view"; -import * as trace from "trace"; + scaleXProperty, scaleYProperty, trace +} from "./animation-common"; + +import { ios } from "utils/utils"; export * from "./animation-common"; -let getter = utils.ios.getter; +let getter = ios.getter; let _transform = "_transform"; let _skip = "_skip"; @@ -117,19 +114,19 @@ class AnimationDelegateImpl extends NSObject implements CAAnimationDelegate { } } -export function _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | CAMediaTimingFunction): CAMediaTimingFunction { +export function _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | CAMediaTimingFunction): CAMediaTimingFunction | string { switch (curve) { - case AnimationCurve.easeIn: + case "easeIn": return CAMediaTimingFunction.functionWithName(kCAMediaTimingFunctionEaseIn); - case AnimationCurve.easeOut: + case "easeOut": return CAMediaTimingFunction.functionWithName(kCAMediaTimingFunctionEaseOut); - case AnimationCurve.easeInOut: + case "easeInOut": return CAMediaTimingFunction.functionWithName(kCAMediaTimingFunctionEaseInEaseOut); - case AnimationCurve.linear: + case "linear": return CAMediaTimingFunction.functionWithName(kCAMediaTimingFunctionLinear); - case AnimationCurve.spring: - return curve; - case AnimationCurve.ease: + case "spring": + return curve; + case "ease": return CAMediaTimingFunction.functionWithControlPoints(0.25, 0.1, 0.25, 1.0); default: if (curve instanceof CAMediaTimingFunction) { @@ -230,7 +227,7 @@ export class Animation extends AnimationBase { } } - public _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | CAMediaTimingFunction): CAMediaTimingFunction { + public _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve | CAMediaTimingFunction): CAMediaTimingFunction | string { return _resolveAnimationCurve(curve); } @@ -248,7 +245,7 @@ export class Animation extends AnimationBase { let animation = propertyAnimations[index]; let args = Animation._getNativeAnimationArguments(animation, valueSource); - if (animation.curve === AnimationCurve.spring) { + if (animation.curve === "spring") { Animation._createNativeSpringAnimation(propertyAnimations, index, playSequentially, args, animation, valueSource, finishedCallback); } else { diff --git a/tns-core-modules/ui/animation/keyframe-animation.ts b/tns-core-modules/ui/animation/keyframe-animation.ts index 5d36591ce..b47d2a261 100644 --- a/tns-core-modules/ui/animation/keyframe-animation.ts +++ b/tns-core-modules/ui/animation/keyframe-animation.ts @@ -4,10 +4,8 @@ import { KeyframeAnimationInfo as KeyframeAnimationInfoDefinition, KeyframeAnimation as KeyframeAnimationDefinition } from "ui/animation/keyframe-animation"; -import { Animation } from "ui/animation"; -import { View } from "ui/core/view"; -import { AnimationCurve } from "ui/enums"; -import { unsetValue } from "ui/core/dependency-observable"; + +import { View, unsetValue, Animation } from "ui/core/view"; export class KeyframeDeclaration implements KeyframeDeclarationDefinition { public property: string; @@ -25,7 +23,7 @@ export class KeyframeAnimationInfo implements KeyframeAnimationInfoDefinition { public duration: number = 0.3; public delay: number = 0; public iterations: number = 1; - public curve: any = AnimationCurve.ease; + public curve: any = "ease"; public isForwards: boolean = false; public isReverse: boolean = false; public keyframes: Array; diff --git a/tns-core-modules/ui/border/border.ts b/tns-core-modules/ui/border/border.ts index f2f6e71a7..0ab66b882 100644 --- a/tns-core-modules/ui/border/border.ts +++ b/tns-core-modules/ui/border/border.ts @@ -1,13 +1,10 @@ import { Border as BorderDefinition } from "ui/border"; -import { View } from "ui/core/view"; -import { ContentView } from "ui/content-view"; -import { layout } from "utils/utils"; -import { isNumber } from "utils/types"; +import { ContentView, View, layout } from "ui/content-view"; @Deprecated export class Border extends ContentView implements BorderDefinition { get cornerRadius(): number { - if (isNumber(this.borderRadius)) { + if (typeof this.borderRadius === "number") { return this.borderRadius; } return 0; diff --git a/tns-core-modules/ui/button/button-common.ts b/tns-core-modules/ui/button/button-common.ts index e241a7689..0f0f1d8bc 100644 --- a/tns-core-modules/ui/button/button-common.ts +++ b/tns-core-modules/ui/button/button-common.ts @@ -1,6 +1,8 @@ import { Button as ButtonDefinition } from "ui/button"; import { TextBase } from "ui/text-base"; +export * from "ui/text-base"; + export abstract class ButtonBase extends TextBase implements ButtonDefinition { public static tapEvent = "tap"; diff --git a/tns-core-modules/ui/button/button.android.ts b/tns-core-modules/ui/button/button.android.ts index d469e270f..5f89ee573 100644 --- a/tns-core-modules/ui/button/button.android.ts +++ b/tns-core-modules/ui/button/button.android.ts @@ -1,6 +1,5 @@ -import { ButtonBase, textProperty, formattedTextProperty, FormattedString } from "./button-common"; -import { device } from "platform"; - +import { ButtonBase, textProperty, formattedTextProperty } from "./button-common"; +import { FormattedString } from "text/formatted-string"; export * from "./button-common"; diff --git a/tns-core-modules/ui/button/button.d.ts b/tns-core-modules/ui/button/button.d.ts index 2fb558525..b567ee76a 100644 --- a/tns-core-modules/ui/button/button.d.ts +++ b/tns-core-modules/ui/button/button.d.ts @@ -2,9 +2,7 @@ * Contains the Button class, which represents a standard button widget. */ declare module "ui/button" { - import { EventData } from "data/observable"; - import { Property } from "ui/core/properties"; - import { TextBase } from "ui/text-base"; + import { TextBase, Property, EventData } from "ui/text-base"; import { FormattedString, FormattedStringView } from "text/formatted-string"; /** diff --git a/tns-core-modules/ui/button/button.ios.ts b/tns-core-modules/ui/button/button.ios.ts index 6a03805cf..f09cb0b18 100644 --- a/tns-core-modules/ui/button/button.ios.ts +++ b/tns-core-modules/ui/button/button.ios.ts @@ -1,10 +1,9 @@ import { ControlStateChangeListener } from "ui/core/control-state-change"; -import { View, PseudoClassHandler, borderTopWidthProperty, borderRightWidthProperty, borderBottomWidthProperty, borderLeftWidthProperty, paddingProperty } from "ui/core/view"; - -import types = require("utils/types"); - -import { ButtonBase } from "./button-common"; -import { textProperty, formattedTextProperty, whiteSpaceProperty } from "../text-base/text-base-common"; +import { + View, ButtonBase, PseudoClassHandler, textProperty, formattedTextProperty, whiteSpaceProperty, + borderTopWidthProperty, borderRightWidthProperty, borderBottomWidthProperty, borderLeftWidthProperty, + paddingTopProperty, paddingRightProperty, paddingBottomProperty, paddingLeftProperty, Length +} from "./button-common"; export * from "./button-common"; @@ -58,58 +57,109 @@ export class Button extends ButtonBase { } } - get [borderTopWidthProperty.native](): number { - return 0; + get [borderTopWidthProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.top, + unit: "px" + }; } - set [borderTopWidthProperty.native](value: number) { - let nativeView = this.nativeView; - let insets = nativeView.contentEdgeInsets; - insets.top = this.style.effectivePaddingTop + value; - nativeView.contentEdgeInsets = insets; + set [borderTopWidthProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let top = style.effectivePaddingTop + style.effectiveBorderTopWidth; + this.nativeView.contentEdgeInsets = { top: top, left: inset.left, bottom: inset.bottom, right: inset.right }; } - get [borderRightWidthProperty.native](): number { - return 0; + get [borderRightWidthProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.right, + unit: "px" + }; } - set [borderRightWidthProperty.native](value: number) { - let nativeView = this.nativeView; - let insets = nativeView.contentEdgeInsets; - insets.right = this.style.effectivePaddingRight + value; - nativeView.contentEdgeInsets = insets; + set [borderRightWidthProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let right = style.effectivePaddingRight + style.effectiveBorderRightWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: inset.left, bottom: inset.bottom, right: right }; } - get [borderBottomWidthProperty.native](): number { - return 0; + get [borderBottomWidthProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.bottom, + unit: "px" + }; } - set [borderBottomWidthProperty.native](value: number) { - let nativeView = this.nativeView; - let insets = nativeView.contentEdgeInsets; - insets.bottom = this.style.effectivePaddingBottom + value; - nativeView.contentEdgeInsets = insets; + set [borderBottomWidthProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let bottom = style.effectivePaddingBottom + style.effectiveBorderBottomWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: inset.left, bottom: bottom, right: inset.right }; } - get [borderLeftWidthProperty.native](): number { - return 0; + get [borderLeftWidthProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.left, + unit: "px" + }; } - set [borderLeftWidthProperty.native](value: number) { - let nativeView = this.nativeView; - let insets = nativeView.contentEdgeInsets; - insets.left = this.style.effectivePaddingLeft + value; - nativeView.contentEdgeInsets = insets; + set [borderLeftWidthProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let left = style.effectivePaddingLeft + style.effectiveBorderLeftWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: left, bottom: inset.bottom, right: inset.right }; } - // get [paddingProperty.native](): UIEdgeInsets { - // return this.nativeView.contentEdgeInsets; - // } - // set [paddingProperty.native](value: UIEdgeInsets) { - // const nativeView = this.nativeView; - // const style = this.style; - // const top = value.top + style.effectiveBorderTopWidth; - // const left = value.left + style.effectiveBorderLeftWidth; - // const bottom = value.bottom + style.effectiveBorderBottomWidth; - // const right = value.right + style.effectiveBorderRightWidth; - // this.nativeView.contentEdgeInsets = { left, top, right, bottom }; - // } + get [paddingTopProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.top, + unit: "px" + }; + } + set [paddingTopProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let top = style.effectivePaddingTop + style.effectiveBorderTopWidth; + this.nativeView.contentEdgeInsets = { top: top, left: inset.left, bottom: inset.bottom, right: inset.right }; + } + + get [paddingRightProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.right, + unit: "px" + }; + } + set [paddingRightProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let right = style.effectivePaddingRight + style.effectiveBorderRightWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: inset.left, bottom: inset.bottom, right: right }; + } + + get [paddingBottomProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.bottom, + unit: "px" + }; + } + set [paddingBottomProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let bottom = style.effectivePaddingBottom + style.effectiveBorderBottomWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: inset.left, bottom: bottom, right: inset.right }; + } + + get [paddingLeftProperty.native](): Length { + return { + value: this.nativeView.contentEdgeInsets.left, + unit: "px" + }; + } + set [paddingLeftProperty.native](value: Length) { + let inset = this.nativeView.contentEdgeInsets; + let style = this.style; + let left = style.effectivePaddingLeft + style.effectiveBorderLeftWidth; + this.nativeView.contentEdgeInsets = { top: inset.top, left: left, bottom: inset.bottom, right: inset.right }; + } } class TapHandlerImpl extends NSObject { diff --git a/tns-core-modules/ui/content-view/content-view.d.ts b/tns-core-modules/ui/content-view/content-view.d.ts index a6b5b3c74..19fd1d6dd 100644 --- a/tns-core-modules/ui/content-view/content-view.d.ts +++ b/tns-core-modules/ui/content-view/content-view.d.ts @@ -3,12 +3,14 @@ */ declare module "ui/content-view" { import { View, AddChildFromBuilder } from "ui/core/view"; - + + export * from "ui/core/view"; + /** * Represents a View that has a single child - content. * The View itself does not have visual representation and serves as a placeholder for its content in the logical tree. */ - class ContentView extends View implements AddChildFromBuilder { + export class ContentView extends View implements AddChildFromBuilder { /** * Gets or sets the single child of the view. */ diff --git a/tns-core-modules/ui/content-view/content-view.ts b/tns-core-modules/ui/content-view/content-view.ts index d97494221..9f5daa1e3 100644 --- a/tns-core-modules/ui/content-view/content-view.ts +++ b/tns-core-modules/ui/content-view/content-view.ts @@ -1,6 +1,7 @@ import { ContentView as ContentViewDefinition } from "ui/content-view"; -import { View, CustomLayoutView, AddChildFromBuilder } from "ui/core/view"; -import * as utils from "utils/utils"; +import { View, CustomLayoutView, AddChildFromBuilder, layout } from "ui/core/view"; + +export * from "ui/core/view"; export class ContentView extends CustomLayoutView implements ContentViewDefinition, AddChildFromBuilder { private _content: View; @@ -69,11 +70,11 @@ export class ContentView extends CustomLayoutView implements ContentViewDefiniti public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void { let result = View.measureChild(this, this.layoutView, widthMeasureSpec, heightMeasureSpec); - let width = utils.layout.getMeasureSpecSize(widthMeasureSpec); - let widthMode = utils.layout.getMeasureSpecMode(widthMeasureSpec); + let width = layout.getMeasureSpecSize(widthMeasureSpec); + let widthMode = layout.getMeasureSpecMode(widthMeasureSpec); - let height = utils.layout.getMeasureSpecSize(heightMeasureSpec); - let heightMode = utils.layout.getMeasureSpecMode(heightMeasureSpec); + let height = layout.getMeasureSpecSize(heightMeasureSpec); + let heightMode = layout.getMeasureSpecMode(heightMeasureSpec); let style = this.style; let measureWidth = Math.max(result.measuredWidth, style.effectiveMinWidth); diff --git a/tns-core-modules/ui/core/properties.ts b/tns-core-modules/ui/core/properties.ts index 29ba18bb1..96ca18fb8 100644 --- a/tns-core-modules/ui/core/properties.ts +++ b/tns-core-modules/ui/core/properties.ts @@ -3,7 +3,7 @@ import { WrappedValue } from "data/observable"; import { ViewBase } from "./view-base"; import { Style } from "ui/styling/style"; -export { unsetValue }; +export { unsetValue, Style }; let symbolPropertyMap = {}; let cssSymbolPropertyMap = {}; @@ -23,7 +23,7 @@ export interface PropertyOptions { affectsLayout?: boolean, equalityComparer?: (x: U, y: U) => boolean, valueChanged?: (target: T, oldValue: U, newValue: U) => void, - valueConverter?: (value: any) => U + valueConverter?: (value: string) => U } export interface CoerciblePropertyOptions extends PropertyOptions { diff --git a/tns-core-modules/ui/core/view-base.ts b/tns-core-modules/ui/core/view-base.ts index ac9d19ed5..efebdb20c 100644 --- a/tns-core-modules/ui/core/view-base.ts +++ b/tns-core-modules/ui/core/view-base.ts @@ -1,11 +1,13 @@ -import { Observable, EventData } from "data/observable"; -import { propagateInheritedProperties, clearInheritedProperties, applyNativeSetters, Property, InheritedProperty, CssProperty } from "./properties"; -import { Binding, BindingOptions } from "ui/core/bindable"; -import { isIOS } from "platform"; import { ViewBase as ViewBaseDefinition } from "ui/core/view-base"; -import { Style } from "ui/styling/style"; +import { Observable, EventData } from "data/observable"; +import { Property, InheritedProperty, CssProperty, Style } from "./properties"; +import { Binding, BindingOptions, Bindable } from "ui/core/bindable"; +import { isIOS } from "platform"; import { fromString as gestureFromString } from "ui/gestures"; +export { Observable, EventData, Binding, BindingOptions, Bindable, isIOS, gestureFromString }; +export * from "./properties"; + let defaultBindingSource = {}; export function getAncestor(view: ViewBaseDefinition, criterion: string | Function): ViewBaseDefinition { diff --git a/tns-core-modules/ui/core/view-common.ts b/tns-core-modules/ui/core/view-common.ts index 335db496c..46f97bcfa 100644 --- a/tns-core-modules/ui/core/view-common.ts +++ b/tns-core-modules/ui/core/view-common.ts @@ -1,26 +1,32 @@ import { View as ViewDefinition, Point, Size } from "ui/core/view"; -import { Style } from "ui/styling/style"; import { CssState, StyleScope, applyInlineSyle } from "ui/styling/style-scope"; import { Color } from "color"; import { Animation, AnimationPromise } from "ui/animation"; import { KeyframeAnimation } from "ui/animation/keyframe-animation"; import { Source } from "utils/debug"; -import { Observable, EventData } from "data/observable"; import { Background } from "ui/styling/background"; -import { ViewBase, getEventOrGestureName } from "./view-base"; -import { propagateInheritedProperties, clearInheritedProperties, Property, InheritedProperty, CssProperty, ShorthandProperty, InheritedCssProperty } from "./properties"; -import { observe, fromString as gestureFromString, GesturesObserver, GestureTypes, GestureEventData } from "ui/gestures"; -import { isIOS } from "platform"; +import { + ViewBase, getEventOrGestureName, Observable, EventData, Style, propagateInheritedProperties, clearInheritedProperties, + Property, InheritedProperty, CssProperty, ShorthandProperty, InheritedCssProperty, + gestureFromString, isIOS +} from "./view-base"; +import { observe as gestureObserve, GesturesObserver, GestureTypes, GestureEventData } from "ui/gestures"; import { Font, parseFont } from "ui/styling/font"; import { fontSizeConverter } from "../styling/converters"; // TODO: Remove this and start using string as source (for android). import { fromFileOrResource, fromBase64, fromUrl } from "image-source"; -import { enabled as traceEnabled, write as traceWrite, categories as traceCategories } from "trace"; +import { enabled as traceEnabled, write as traceWrite, categories as traceCategories, notifyEvent as traceNotifyEvent } from "trace"; import { isDataURI, isFileOrResourcePath } from "utils/utils"; + export * from "./view-base"; +export { + Color, GestureTypes, GesturesObserver, GestureEventData, Animation, AnimationPromise, KeyframeAnimation, + Background, Font, traceEnabled, traceWrite, traceCategories, traceNotifyEvent +} + // registerSpecialProperty("class", (instance: ViewDefinition, propertyValue: string) => { // instance.className = propertyValue; // }); @@ -216,7 +222,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { this._gestureObservers[type] = []; } - this._gestureObservers[type].push(observe(this, type, callback, thisArg)); + this._gestureObservers[type].push(gestureObserve(this, type, callback, thisArg)); } public getGestureObservers(type: GestureTypes): Array { @@ -225,25 +231,25 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { public addEventListener(arg: string | GestureTypes, callback: (data: EventData) => void, thisArg?: any) { if (typeof arg === "string") { - arg = getEventOrGestureName(arg); + arg = getEventOrGestureName(arg); - let gesture = gestureFromString(arg); - if (gesture && !this._isEvent(arg)) { + let gesture = gestureFromString(arg); + if (gesture && !this._isEvent(arg)) { this.observe(gesture, callback, thisArg); } else { - let events = (arg).split(","); + let events = (arg).split(","); if (events.length > 0) { for (let i = 0; i < events.length; i++) { let evt = events[i].trim(); let gst = gestureFromString(evt); - if (gst && !this._isEvent(arg)) { + if (gst && !this._isEvent(arg)) { this.observe(gst, callback, thisArg); } else { super.addEventListener(evt, callback, thisArg); } } } else { - super.addEventListener(arg, callback, thisArg); + super.addEventListener(arg, callback, thisArg); } } } else if (typeof arg === "number") { @@ -253,23 +259,23 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { public removeEventListener(arg: string | GestureTypes, callback?: any, thisArg?: any) { if (typeof arg === "string") { - let gesture = gestureFromString(arg); - if (gesture && !this._isEvent(arg)) { + let gesture = gestureFromString(arg); + if (gesture && !this._isEvent(arg)) { this._disconnectGestureObservers(gesture); } else { - let events = (arg).split(","); + let events = arg.split(","); if (events.length > 0) { for (let i = 0; i < events.length; i++) { let evt = events[i].trim(); let gst = gestureFromString(evt); - if (gst && !this._isEvent(arg)) { + if (gst && !this._isEvent(arg)) { this._disconnectGestureObservers(gst); } else { super.removeEventListener(evt, callback, thisArg); } } } else { - super.removeEventListener(arg, callback, thisArg); + super.removeEventListener(arg, callback, thisArg); } } @@ -982,7 +988,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { if (typeof inlineStyle === "string") { try { // this.style._beginUpdate(); - applyInlineSyle(this, inlineStyle); + applyInlineSyle(this, inlineStyle); } finally { // this.style._endUpdate(); } @@ -1526,36 +1532,53 @@ function resetStyles(view: ViewCommon): void { return true; }); } -// let idProperty = new Property("id", "View", new PropertyMetadata(undefined, PropertyMetadataSettings.AffectsStyle)); + export const idProperty = new Property({ name: "id", valueChanged: (view, oldValue, newValue) => resetStyles(view) }); idProperty.register(ViewCommon); export const automationTextProperty = new Property({ name: "automationText" }); automationTextProperty.register(ViewCommon); -export const originXProperty = new Property({ name: "originX", defaultValue: 0.5 }); +export const originXProperty = new Property({ name: "originX", defaultValue: 0.5, valueConverter: (v) => parseFloat(v) }); originXProperty.register(ViewCommon); -export const originYProperty = new Property({ name: "originY", defaultValue: 0.5 }); +export const originYProperty = new Property({ name: "originY", defaultValue: 0.5, valueConverter: (v) => parseFloat(v) }); originYProperty.register(ViewCommon); -export const isEnabledProperty = new Property({ name: "isEnabled", defaultValue: true }); +export function booleanConverter(v: string): boolean { + let lowercase = (v + '').toLowerCase(); + if (lowercase === "true") { + return true; + } else if (lowercase === "false") { + return false; + } + + throw new Error(`Invalid boolean: ${v}`); +} + +export const isEnabledProperty = new Property({ name: "isEnabled", defaultValue: true, valueConverter: booleanConverter }); isEnabledProperty.register(ViewCommon); -export const isUserInteractionEnabledProperty = new Property({ name: "isUserInteractionEnabled", defaultValue: true }); +export const isUserInteractionEnabledProperty = new Property({ name: "isUserInteractionEnabled", defaultValue: true, valueConverter: booleanConverter }); isUserInteractionEnabledProperty.register(ViewCommon); 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({ - name: "minWidth", cssName: "min-width", defaultValue: zeroLength, affectsLayout: isIOS, valueChanged: (target, newValue) => { + name: "minWidth", cssName: "min-width", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, + valueChanged: (target, newValue) => { target.effectiveMinWidth = getLengthEffectiveValue(layout.getDisplayDensity(), newValue); }, valueConverter: Length.parse }); minWidthProperty.register(Style); export const minHeightProperty = new CssProperty({ - name: "minHeight", cssName: "min-height", defaultValue: zeroLength, affectsLayout: isIOS, valueChanged: (target, newValue) => { + name: "minHeight", cssName: "min-height", defaultValue: zeroLength, affectsLayout: isIOS, equalityComparer: lengthComparer, + valueChanged: (target, newValue) => { target.effectiveMinHeight = getLengthEffectiveValue(layout.getDisplayDensity(), newValue); }, valueConverter: Length.parse }); @@ -1563,10 +1586,10 @@ minHeightProperty.register(Style); const matchParent: Length = { value: -1, unit: "px" }; -export const widthProperty = new CssProperty({ name: "width", cssName: "width", defaultValue: matchParent, affectsLayout: isIOS, valueConverter: PercentLength.parse }); +export const widthProperty = new CssProperty({ name: "width", cssName: "width", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse }); widthProperty.register(Style); -export const heightProperty = new CssProperty({ name: "height", cssName: "height", defaultValue: matchParent, affectsLayout: isIOS, valueConverter: PercentLength.parse }); +export const heightProperty = new CssProperty({ name: "height", cssName: "height", defaultValue: matchParent, affectsLayout: isIOS, equalityComparer: lengthComparer, valueConverter: PercentLength.parse }); heightProperty.register(Style); export const marginProperty = new ShorthandProperty