diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj index 8fe407600..59019d963 100644 --- a/CrossPlatformModules.csproj +++ b/CrossPlatformModules.csproj @@ -151,6 +151,9 @@ + + + time-picker-tests-native.d.ts diff --git a/apps/tests/ui/border/border-tests-native.android.ts b/apps/tests/ui/border/border-tests-native.android.ts new file mode 100644 index 000000000..6500c4b74 --- /dev/null +++ b/apps/tests/ui/border/border-tests-native.android.ts @@ -0,0 +1,34 @@ +import borderModule = require("ui/border"); +import utils = require("utils/utils"); + +var density = utils.layout.getDisplayDensity(); + +export function getNativeBorderWidth(border: borderModule.Border): number { + var bkg = (border.android).getBackground(); + + return bkg && bkg.getStroke ? bkg.getStroke() / density : -1; +} + +export function getNativeCornerRadius(border: borderModule.Border): number { + var bkg = (border.android).getBackground(); + + return bkg && bkg.getCornerRadius ? bkg.getCornerRadius() / density : -1; +} + +export function checkNativeBorderColor(border: borderModule.Border): boolean { + var bkg = (border.android).getBackground(); + + return border.borderColor && bkg && bkg.getBorderColor && bkg.getBorderColor() === border.borderColor.android; +} + +export function checkNativeBackgroundColor(border: borderModule.Border): boolean { + var bkg = (border.android).getBackground(); + + return border.backgroundColor && bkg && bkg.getBackgroundColor && bkg.getBackgroundColor() === border.backgroundColor.android; +} + +export function checkNativeBackgroundImage(border: borderModule.Border): boolean { + var bkg = (border.android).getBackground(); + + return bkg && bkg.getBitmap && bkg.getBitmap() !== undefined; +} \ No newline at end of file diff --git a/apps/tests/ui/border/border-tests-native.d.ts b/apps/tests/ui/border/border-tests-native.d.ts new file mode 100644 index 000000000..867230193 --- /dev/null +++ b/apps/tests/ui/border/border-tests-native.d.ts @@ -0,0 +1,12 @@ +//@private +import borderModule = require("ui/border"); + +export declare function getNativeBorderWidth(border: borderModule.Border): number; + +export declare function getNativeCornerRadius(border: borderModule.Border): number; + +export declare function checkNativeBorderColor(border: borderModule.Border): boolean + +export declare function checkNativeBackgroundColor(border: borderModule.Border): boolean; + +export declare function checkNativeBackgroundImage(border: borderModule.Border): boolean \ No newline at end of file diff --git a/apps/tests/ui/border/border-tests-native.ios.ts b/apps/tests/ui/border/border-tests-native.ios.ts new file mode 100644 index 000000000..ecd54ae0c --- /dev/null +++ b/apps/tests/ui/border/border-tests-native.ios.ts @@ -0,0 +1,21 @@ +import borderModule = require("ui/border"); + +export function getNativeBorderWidth(border: borderModule.Border): number { + return (border.ios).layer.borderWidth; +} + +export function getNativeCornerRadius(border: borderModule.Border): number { + return (border.ios).layer.cornerRadius; +} + +export function checkNativeBorderColor(border: borderModule.Border): boolean { + return border.borderColor && (border.ios).layer.borderColor === border.borderColor.ios.CGColor; +} + +export function checkNativeBackgroundColor(border: borderModule.Border): boolean { + return border.backgroundColor && (border.ios).backgroundColor.isEqual(border.backgroundColor.ios); +} + +export function checkNativeBackgroundImage(border: borderModule.Border): boolean { + return (border.ios).backgroundColor !== undefined; +} \ No newline at end of file diff --git a/apps/tests/ui/border/border-tests.ts b/apps/tests/ui/border/border-tests.ts index 9aeb0fc9f..1302ac755 100644 --- a/apps/tests/ui/border/border-tests.ts +++ b/apps/tests/ui/border/border-tests.ts @@ -1,5 +1,10 @@ import buttonModule = require("ui/button"); import colorModule = require("color"); +import TKUnit = require("../../TKUnit"); +import helper = require("../helper"); +import viewModule = require("ui/core/view"); +import borderTestsNative = require("./border-tests-native"); +import pageModule = require("ui/page"); //  // # Border @@ -18,7 +23,7 @@ import borderModule = require("ui/border"); //``` //  -export function test_DummyTestForCodeSnippet() { +function _createBorder(): borderModule.Border { // // ### Creating a Border programmatically // ``` JavaScript @@ -27,10 +32,56 @@ export function test_DummyTestForCodeSnippet() { var border = new borderModule.Border(); border.cornerRadius = 10; - border.borderWidth = 1; + border.borderWidth = 2; border.borderColor = new colorModule.Color("#FF0000"); + border.backgroundColor = new colorModule.Color("#FFFF00"); border.content = button; // ``` // + + return border; +} + +export var testBorderWidth = function () { + helper.buildUIAndRunTest(_createBorder(), function (views: Array) { + var border = views[0]; + var expectedValue = border.borderWidth; + var actualValue = borderTestsNative.getNativeBorderWidth(border); + TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue); + }); +} + +export var testCornerRadius = function () { + helper.buildUIAndRunTest(_createBorder(), function (views: Array) { + var border = views[0]; + var expectedValue = border.cornerRadius; + var actualValue = borderTestsNative.getNativeCornerRadius(border); + TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue); + }); +} + +export var testBorderColor = function () { + helper.buildUIAndRunTest(_createBorder(), function (views: Array) { + var border = views[0]; + TKUnit.assert(borderTestsNative.checkNativeBorderColor(border), "BorderColor not applied correctly!"); + }); +} + +export var testBackgroundColor = function () { + helper.buildUIAndRunTest(_createBorder(), function (views: Array) { + var border = views[0]; + TKUnit.assert(borderTestsNative.checkNativeBackgroundColor(border), "BackgroundColor not applied correctly!"); + }); +} + +export var testBackgroundImage = function () { + var border = _createBorder(); + + helper.buildUIAndRunTest(border, function (views: Array) { + var page = views[1]; + page.css = "Border { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC;') }"; + + TKUnit.assert(borderTestsNative.checkNativeBackgroundImage(border), "Style background-image not loaded correctly from data URI."); + }); } \ No newline at end of file diff --git a/ui/border/border.android.ts b/ui/border/border.android.ts index bbb4cd244..576be53f8 100644 --- a/ui/border/border.android.ts +++ b/ui/border/border.android.ts @@ -33,6 +33,9 @@ export class Border extends borderCommon.Border { class BorderGradientDrawable extends android.graphics.drawable.GradientDrawable { private paint: android.graphics.Paint; private stroke: number; + private cornerRadius: number; + private backgroundColor: number; + private borderColor: number; private bitmap: android.graphics.Bitmap constructor(borderWidth: number, borderColor: number, backgroundColor: number, cornerRadius: number, bitmap?: android.graphics.Bitmap) { @@ -43,19 +46,42 @@ class BorderGradientDrawable extends android.graphics.drawable.GradientDrawable if (bitmap) { this.paint = new android.graphics.Paint(); } else { + this.backgroundColor = backgroundColor; this.setColor(backgroundColor); } var density = utils.layout.getDisplayDensity(); this.stroke = borderWidth * density; - this.setStroke(this.stroke, borderColor); + this.borderColor = borderColor; + this.setStroke(this.stroke, this.borderColor); - this.setCornerRadius(cornerRadius * density); + this.cornerRadius = cornerRadius * density; + this.setCornerRadius(this.cornerRadius); return global.__native(this); } + public getStroke(): number { + return this.stroke; + } + + public getCornerRadius(): number { + return this.cornerRadius; + } + + public getBackgroundColor(): number { + return this.backgroundColor; + } + + public getBorderColor(): number { + return this.borderColor; + } + + public getBitmap(): android.graphics.Bitmap { + return this.bitmap; + } + public draw(canvas: android.graphics.Canvas): void { if (this.paint) { canvas.drawBitmap(this.bitmap, this.stroke, this.stroke, this.paint);