diff --git a/tns-core-modules/ui/styling/background-common.ts b/tns-core-modules/ui/styling/background-common.ts index c20d95244..991e9d3f9 100644 --- a/tns-core-modules/ui/styling/background-common.ts +++ b/tns-core-modules/ui/styling/background-common.ts @@ -4,8 +4,9 @@ import enums = require("ui/enums"); import definition = require("ui/styling/background"); import cssValue = require("css-value"); import utils = require("utils/utils"); -import * as typesModule from "utils/types"; +import { isAndroid } from "platform"; +import * as typesModule from "utils/types"; var types: typeof typesModule; function ensureTypes() { if (!types) { @@ -28,6 +29,7 @@ export class Background implements definition.Background { repeat: string; position: string; size: string; + // The ones below are used on Android only borderWidth: number = 0; borderColor: colorModule.Color; borderRadius: number = 0; @@ -250,11 +252,17 @@ export class Background implements definition.Background { public isEmpty(): boolean { ensureTypes(); - return types.isNullOrUndefined(this.image) - && types.isNullOrUndefined(this.color) - && !this.borderWidth - && !this.borderRadius - && !this.clipPath; + if (isAndroid){ + return types.isNullOrUndefined(this.image) + && types.isNullOrUndefined(this.color) + && !this.borderWidth + && !this.borderRadius + && !this.clipPath; + } + else { + return types.isNullOrUndefined(this.image) + && types.isNullOrUndefined(this.color); + } } public static equals(value1: Background, value2: Background): boolean { @@ -268,15 +276,29 @@ export class Background implements definition.Background { return false; } - return value1.image === value2.image - && value1.position === value2.position - && value1.repeat === value2.repeat - && value1.size === value2.size - && colorModule.Color.equals(value1.color, value2.color) - && value1.borderWidth === value2.borderWidth - && colorModule.Color.equals(value1.borderColor, value2.borderColor) - && value1.borderRadius === value2.borderRadius - && value1.clipPath === value2.clipPath; + if (isAndroid){ + return value1.image === value2.image + && value1.position === value2.position + && value1.repeat === value2.repeat + && value1.size === value2.size + && colorModule.Color.equals(value1.color, value2.color) + && value1.borderWidth === value2.borderWidth + && colorModule.Color.equals(value1.borderColor, value2.borderColor) + && value1.borderRadius === value2.borderRadius + && value1.clipPath === value2.clipPath; + } + else { + return value1.image === value2.image + && value1.position === value2.position + && value1.repeat === value2.repeat + && value1.size === value2.size + && colorModule.Color.equals(value1.color, value2.color); + } + + } + + public toString(): string { + return `isEmpty: ${this.isEmpty()}; color: ${this.color}; image: ${this.image}; repeat: ${this.repeat}; position: ${this.position}; size: ${this.size}; borderWidth: ${this.borderWidth}; borderColor: ${this.borderColor}; borderRadius: ${this.borderRadius}; clipPath: ${this.clipPath};`; } } diff --git a/tns-core-modules/ui/styling/background.android.ts b/tns-core-modules/ui/styling/background.android.ts index ab2858d03..7fb798968 100644 --- a/tns-core-modules/ui/styling/background.android.ts +++ b/tns-core-modules/ui/styling/background.android.ts @@ -44,21 +44,23 @@ export module ad { ensureLazyRequires(); - let clipPath = v.style._getValue(style.clipPathProperty); - let background = v.style._getValue(style.backgroundInternalProperty); - let borderWidth = v.borderWidth; + let background = v.style._getValue(style.backgroundInternalProperty); let backgroundDrawable = nativeView.getBackground(); let density = utils.layout.getDisplayDensity(); let cache = v._nativeView; - if (v instanceof button.Button && !types.isNullOrUndefined(backgroundDrawable) && types.isFunction(backgroundDrawable.setColorFilter) && - v.borderWidth === 0 && v.borderRadius === 0 && !clipPath && - types.isNullOrUndefined(v.style._getValue(style.backgroundImageProperty)) && - !types.isNullOrUndefined(v.style._getValue(style.backgroundColorProperty))) { - let backgroundColor = (backgroundDrawable).backgroundColor = v.style._getValue(style.backgroundColorProperty).android; + if (v instanceof button.Button + && !types.isNullOrUndefined(backgroundDrawable) + && types.isFunction(backgroundDrawable.setColorFilter) + && background.borderWidth === 0 + && background.borderRadius === 0 + && !background.clipPath + && types.isNullOrUndefined(background.image) + && !types.isNullOrUndefined(background.color)) { + let backgroundColor = (backgroundDrawable).backgroundColor = background.color.android; backgroundDrawable.setColorFilter(backgroundColor, android.graphics.PorterDuff.Mode.SRC_IN); (backgroundDrawable).backgroundColor = backgroundColor; } - else if (v.borderWidth || v.borderRadius || clipPath || !background.isEmpty()) { + else if (!background.isEmpty()) { if (!(backgroundDrawable instanceof org.nativescript.widgets.BorderDrawable)) { let viewClass = types.getClass(v); if (!(v instanceof button.Button) && !_defaultBackgrounds.has(viewClass)) { @@ -73,7 +75,7 @@ export module ad { refreshBorderDrawable(v, backgroundDrawable); } - if ((v.borderWidth || v.borderRadius || clipPath) && getSDK() < 18) { + if ((background.borderWidth || background.borderRadius || background.clipPath) && getSDK() < 18) { // Switch to software because of unsupported canvas methods if hardware acceleration is on: // http://developer.android.com/guide/topics/graphics/hardware-accel.html cache.layerType = cache.getLayerType(); @@ -100,10 +102,10 @@ export module ad { } nativeView.setPadding( - Math.round((borderWidth + v.style.paddingLeft) * density), - Math.round((borderWidth + v.style.paddingTop) * density), - Math.round((borderWidth + v.style.paddingRight) * density), - Math.round((borderWidth + v.style.paddingBottom) * density) + Math.round((background.borderWidth + v.style.paddingLeft) * density), + Math.round((background.borderWidth + v.style.paddingTop) * density), + Math.round((background.borderWidth + v.style.paddingRight) * density), + Math.round((background.borderWidth + v.style.paddingBottom) * density) ); } } diff --git a/tns-core-modules/ui/styling/style.ts b/tns-core-modules/ui/styling/style.ts index 1bee04e98..44ccc1376 100644 --- a/tns-core-modules/ui/styling/style.ts +++ b/tns-core-modules/ui/styling/style.ts @@ -351,34 +351,42 @@ function onBackgroundSizePropertyChanged(data: PropertyChangeData) { } function onBorderWidthPropertyChanged(data: PropertyChangeData) { - var style =