diff --git a/api-reports/NativeScript.api.md b/api-reports/NativeScript.api.md
index d2d7d93604..3c1d17ad55 100644
--- a/api-reports/NativeScript.api.md
+++ b/api-reports/NativeScript.api.md
@@ -413,6 +413,7 @@ export class Color {
public b: number;
public equals(value: Color): boolean;
public static equals(value1: Color, value2: Color): boolean;
+ public static fromIosColor(value: any /* UIColor */): Color;
public g: number;
public hex: string;
ios: any /* UIColor */;
diff --git a/e2e/ui-tests-app/app/css/all-non-uniform-border-page.css b/e2e/ui-tests-app/app/css/all-non-uniform-border-page.css
index 3529e9d294..a0f54831f2 100644
--- a/e2e/ui-tests-app/app/css/all-non-uniform-border-page.css
+++ b/e2e/ui-tests-app/app/css/all-non-uniform-border-page.css
@@ -5,3 +5,10 @@
height: 80;
font-size: 6;
}
+
+.html-view {
+ font-size: 10;
+ link-color: red;
+ color: green;
+ font-family: 'Courier New', Courier, monospace;
+}
diff --git a/e2e/ui-tests-app/app/css/all-non-uniform-border-page.xml b/e2e/ui-tests-app/app/css/all-non-uniform-border-page.xml
index 64efc27d91..ed2837afdf 100644
--- a/e2e/ui-tests-app/app/css/all-non-uniform-border-page.xml
+++ b/e2e/ui-tests-app/app/css/all-non-uniform-border-page.xml
@@ -11,7 +11,7 @@
-
+
diff --git a/nativescript-core/color/color-common.ts b/nativescript-core/color/color-common.ts
index 0a8e12fb42..d929e50558 100644
--- a/nativescript-core/color/color-common.ts
+++ b/nativescript-core/color/color-common.ts
@@ -157,6 +157,10 @@ export class Color implements definition.Color {
public toString(): string {
return this.hex;
}
+
+ public static fromIosColor(value: UIColor): Color {
+ return undefined;
+ }
}
function isRgbOrRgba(value: string): boolean {
diff --git a/nativescript-core/color/color.d.ts b/nativescript-core/color/color.d.ts
index ee75d7941a..cb6712cf38 100644
--- a/nativescript-core/color/color.d.ts
+++ b/nativescript-core/color/color.d.ts
@@ -75,4 +75,9 @@ export class Color {
* @param value Input string.
*/
public static isValid(value: any): boolean;
+
+ /**
+ * Creates color from iOS-specific UIColor value representation.
+ */
+ public static fromIosColor(value: any /* UIColor */): Color;
}
diff --git a/nativescript-core/color/color.ios.ts b/nativescript-core/color/color.ios.ts
index a0aad04377..648a3759f9 100644
--- a/nativescript-core/color/color.ios.ts
+++ b/nativescript-core/color/color.ios.ts
@@ -11,4 +11,15 @@ export class Color extends common.Color {
return this._ios;
}
+
+ public static fromIosColor(value: UIColor): Color {
+ const rgba = CGColorGetComponents(value.CGColor);
+
+ return new Color(
+ Math.round(rgba[3] * 255),
+ Math.round(rgba[0] * 255),
+ Math.round(rgba[1] * 255),
+ Math.round(rgba[2] * 255),
+ );
+ }
}
diff --git a/nativescript-core/ui/html-view/html-view-common.ts b/nativescript-core/ui/html-view/html-view-common.ts
index e6c564e865..9c7df2d504 100644
--- a/nativescript-core/ui/html-view/html-view-common.ts
+++ b/nativescript-core/ui/html-view/html-view-common.ts
@@ -1,5 +1,7 @@
-import { HtmlView as HtmlViewDefinition } from ".";
+import { Color } from "../../color";
+import { Style, CssProperty } from "../core/properties";
import { View, Property, CSSType } from "../core/view";
+import { HtmlView as HtmlViewDefinition } from ".";
export * from "../core/view";
@@ -13,3 +15,11 @@ HtmlViewBase.prototype.recycleNativeView = "auto";
// TODO: Can we use Label.ios optimization for affectsLayout???
export const htmlProperty = new Property({ name: "html", defaultValue: "", affectsLayout: true });
htmlProperty.register(HtmlViewBase);
+
+export const linkColorProperty = new CssProperty`;
+ }
+ const htmlString = NSString.stringWithString(html + "");
const nsData = htmlString.dataUsingEncoding(NSUnicodeStringEncoding);
this.nativeViewProtected.attributedText = NSAttributedString.alloc().initWithDataOptionsDocumentAttributesError(
nsData,
@@ -63,4 +93,38 @@ export class HtmlView extends HtmlViewBase {
this.nativeViewProtected.textColor = UIColor.labelColor;
}
}
+
+ [htmlProperty.setNative](value: string) {
+ this.currentHtml = value;
+ this.renderWithStyles();
+ }
+
+ [colorProperty.getDefault](): UIColor {
+ return this.nativeViewProtected.textColor;
+ }
+ [colorProperty.setNative](value: Color | UIColor) {
+ const color = value instanceof Color ? value.ios : value;
+ this.nativeViewProtected.textColor = color;
+ this.renderWithStyles();
+ }
+
+ [linkColorProperty.getDefault](): UIColor {
+ return this.nativeViewProtected.linkTextAttributes[NSForegroundColorAttributeName];
+ }
+ [linkColorProperty.setNative](value: Color | UIColor) {
+ const color = value instanceof Color ? value.ios : value;
+ const linkTextAttributes = NSDictionary.dictionaryWithObjectForKey(
+ color,
+ NSForegroundColorAttributeName,
+ );
+ this.nativeViewProtected.linkTextAttributes = linkTextAttributes;
+ }
+ [fontInternalProperty.getDefault](): UIFont {
+ return this.nativeViewProtected.font;
+ }
+ [fontInternalProperty.setNative](value: Font | UIFont) {
+ const font = value instanceof Font ? value.getUIFont(this.nativeViewProtected.font) : value;
+ this.nativeViewProtected.font = font;
+ this.renderWithStyles();
+ }
}