javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-15 19:26:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixed text decoration tests, Color will now store just a single argb info in 32bit unsigned int internally and covert to a/r/g/b or hex when necessary

Browse Source
This commit is contained in:
PanayotCankov
2017-02-17 13:26:11 +02:00
committed by Panayot Cankov
parent ccde2a4083
commit b2cf286948
16 changed files with 340 additions and 370 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,10 @@
// Place your settings in this file to overwrite default and user settings.
{
"search.exclude": {
"**/node_modules": true,
"**/bower_components": true,
"**/platforms": true,
"**/*.js": true,
"**/*.js.map": true
}
}

19
apps/app/ui-tests-app/css/letter-spacing.xml
View File

@ -5,14 +5,17 @@
<Label text="labelLabel" style="letter-spacing: -0.1;" />
<Label text="labelLabel" style="letter-spacing: 0;" />
<Label text="labelLabel" style="letter-spacing: 0.1;" />
<Label>
<Span text="just bold" fontWeight="bold" />
</Label>
</WrapLayout>
<Label text="labelLabel" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
<Label style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
<Label.formattedText>
<FormattedString>
<FormattedString.spans>
<Span text="label" fontAttributes="Bold" foregroundColor="#0000ff" />
<Span text="Label" fontAttributes="Italic" foregroundColor="#00ff00" />
<Span text="label" fontWeight="bold" color="#0000ff" />
<Span text="Label" fontStyle="italic" color="#00ff00" />
</FormattedString.spans>
</FormattedString>
</Label.formattedText>
@ -28,8 +31,8 @@
<Button.formattedText>
<FormattedString>
<FormattedString.spans>
<Span text="button" fontAttributes="Bold" foregroundColor="#0000ff" />
<Span text="Button" fontAttributes="Italic" foregroundColor="#00ff00" />
<Span text="button" fontWeight="bold" color="#0000ff" />
<Span text="Button" fontStyle="italic" color="#00ff00" />
</FormattedString.spans>
</FormattedString>
</Button.formattedText>
@ -46,8 +49,8 @@
<TextField.formattedText>
<FormattedString>
<FormattedString.spans>
<Span text="text" fontAttributes="Bold" foregroundColor="#0000ff" />
<Span text="Field" fontAttributes="Italic" foregroundColor="#00ff00" />
<Span text="text" fontWeight="bold" color="#0000ff" />
<Span text="Field" fontStyle="italic" color="#00ff00" />
</FormattedString.spans>
</FormattedString>
</TextField.formattedText>
@ -64,8 +67,8 @@
<TextView.formattedText>
<FormattedString>
<FormattedString.spans>
<Span text="text" fontAttributes="Bold" foregroundColor="#0000ff" />
<Span text="View" fontAttributes="Italic" foregroundColor="#00ff00" />
<Span text="text" fontWeight="bold" color="#0000ff" />
<Span text="View" fontStyle="italic" color="#00ff00" />
</FormattedString.spans>
</FormattedString>
</TextView.formattedText>

2
apps/package.json
View File

@ -9,7 +9,7 @@
"version": "2.5.0"
},
"tns-android": {
"version": "2.4.1"
"version": "2.5.0"
}
},
"dependencies": {

43
tests/app/color-tests.ts
View File

@ -14,7 +14,7 @@ export var test_Hex_Color = function () {
TKUnit.assertEqual(color.g, 0, "Color.g not properly parsed");
TKUnit.assertEqual(color.b, 0, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, "#FF0000", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 0, 0), "Color.argb not properly parsed");
TKUnit.assertEqual(color.argb, 0xFFFF0000, "Color.argb not properly parsed");
}
export var test_ShortHex_Color = function () {
@ -27,7 +27,7 @@ export var test_ShortHex_Color = function () {
TKUnit.assertEqual(color.g, 136, "Color.g not properly parsed"); // 0x88 == 136
TKUnit.assertEqual(color.b, 0, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, "#FF8800", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 136, 0), "Color.argb not properly parsed");
TKUnit.assertEqual(color.argb, 0xFFFF8800, "Color.argb not properly parsed");
}
export var test_Argb_Color = function () {
@ -39,22 +39,21 @@ export var test_Argb_Color = function () {
TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, _buildHex(100, 255, 100, 100), "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(100, 255, 100, 100), "Color.argb not properly parsed");
TKUnit.assertEqual(color.hex, "#64FF6464", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, 0x64FF6464, "Color.argb not properly parsed");
}
export var test_ArgbInt_Color = function () {
// >> color-rgb-single
// Creates the color with 100 alpha, 100 red, 100 green, 100 blue
var argb = (100 << 24) | (100 << 16) | (100 << 8) | 100;
var color = new Color(argb);
var color = new Color(0x64646464);
// << color-rgb-single
TKUnit.assertEqual(color.a, 100, "Color.a not properly parsed");
TKUnit.assertEqual(color.r, 100, "Color.r not properly parsed");
TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, _buildHex(100, 100, 100, 100), "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(100, 100, 100, 100), "Color.argb not properly parsed");
TKUnit.assertEqual(color.hex, "#64646464", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, 0x64646464, "Color.argb not properly parsed");
}
export var test_rgb_Color_CSS = function () {
@ -69,13 +68,13 @@ export var test_rgb_Color_CSS = function () {
TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, _buildHex(255, 255, 100, 100), "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 100, 100), "Color.argb not properly parsed");
TKUnit.assertEqual(color.hex, "#FF6464", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, 0xFFFF6464, "Color.argb not properly parsed");
}
export var test_rgba_Color_CSS = function () {
var alpha = 0.5;
var expected = Math.round(alpha * 255);
var expected = 0x80;
// <snippet module="color" title="color">
// ### Creating a Color from four RGB values
// ``` JavaScript
@ -87,24 +86,6 @@ export var test_rgba_Color_CSS = function () {
TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
TKUnit.assertEqual(color.hex, _buildHex(expected, 255, 100, 100), "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, _parseArgb(expected, 255, 100, 100), "Color.argb not properly parsed");
}
var _buildHex = function (a: number, r: number, g: number, b: number): string {
return "#" + _componentToHex(a) + _componentToHex(r) + _componentToHex(g) + _componentToHex(b);
}
var _componentToHex = function (component: number): string {
var hex = component.toString(16);
if (hex.length === 1) {
hex = "0" + hex;
}
return hex;
}
var _parseArgb = function (a: number, r: number, g: number, b: number): number {
// Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
return (a << 24) | (r << 16) | (g << 8) | b;
TKUnit.assertEqual(color.hex, "#80FF6464", "Color.hex not properly parsed");
TKUnit.assertEqual(color.argb, 0x80FF6464, "Color.argb not properly parsed");
}

9
tests/app/timer-tests.ts
View File

@ -52,16 +52,17 @@ export function test_setTimeout_callbackCalledAfterSpecifiedTime() {
TKUnit.waitUntilReady(() => completed, 1);
timer.clearTimeout(id);
TKUnit.assert(completed, "Callback should be called after specified time!");
TKUnit.assert(completed, "Callback should be called after the specified time!");
};
export function test_setTimeout_callbackNotCalled() {
let completed = false;
const id = timer.setTimeout(() => completed = true, 50);
TKUnit.wait(0.007);
const id = timer.setTimeout(() => completed = true, 10);
timer.clearTimeout(id);
TKUnit.assert(!completed, "Callback should be called after specified time!");
TKUnit.wait(30 / 1000);
TKUnit.assert(!completed, "Callback should not be called after the specified time!");
};
export function test_setTimeout_shouldReturnNumber() {

45
tests/app/ui/button/button-tests.ts
View File

@ -180,58 +180,60 @@ var _testNativeFontSizeFromLocal = function (views: Array<viewModule.View>) {
helper.assertAreClose(actualResult, expectedFontSize, "FontSizeFromLocal");
}
var expectedColorHex = "#ffff0000";
var actualColorHex = "#ffff0000";
var expectedNormalizedColorHex = "#FF0000"
var _testLocalColorFromCss = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
page.css = "button { color: " + expectedColorHex + "; }";
page.css = "button { color: " + actualColorHex + "; }";
var actualResult = button.style.color.hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
}
var _testNativeColorFromCss = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
page.css = "button { color: " + expectedColorHex + "; }";
page.css = "button { color: " + actualColorHex + "; }";
var actualResult = buttonTestsNative.getNativeColor(button).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
}
var _testNativeColorFromLocal = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
button.style.color = new colorModule.Color(expectedColorHex);
button.style.color = new colorModule.Color(actualColorHex);
var actualResult = buttonTestsNative.getNativeColor(button).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
}
var expectedBackgroundColorHex = "#ff00ff00";
var actualBackgroundColorHex = "#FF00FF00";
var expectedNormalizedBackgroundColorHex = "#00FF00";
var _testLocalBackgroundColorFromCss = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
page.css = "button { background-color: " + expectedBackgroundColorHex + "; }";
page.css = "button { background-color: " + actualBackgroundColorHex + "; }";
var actualResult = button.style.backgroundColor.hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
}
var _testNativeBackgroundColorFromCss = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
page.css = "button { background-color: " + expectedBackgroundColorHex + "; }";
page.css = "button { background-color: " + actualBackgroundColorHex + "; }";
var actualResult = buttonTestsNative.getNativeBackgroundColor(button).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
}
var _testNativeBackgroundColorFromLocal = function (views: Array<viewModule.View>) {
var button = <buttonModule.Button>views[0];
button.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
button.style.backgroundColor = new colorModule.Color(actualBackgroundColorHex);
var actualResult = buttonTestsNative.getNativeBackgroundColor(button).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
}
var expectedTextAlignment: "right" = "right";
@ -261,13 +263,14 @@ export var test_StateHighlighted_also_fires_pressedState = function () {
helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
var view = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
var expectedColor = "#ffff0000";
var expectedColor = "#FFFF0000";
var expectedNormalizedColor = "#FF0000";
page.css = "button:pressed { background-color: " + expectedColor + "; }";
view._goToVisualState('highlighted');
var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
});
}
@ -275,13 +278,14 @@ export var test_StateHighlighted_also_fires_activeState = function () {
helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
var view = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
var expectedColor = "#ffff0000";
var expectedColor = "#FFFF0000";
var expectedNormalizedColor = "#FF0000";
page.css = "button:active { background-color: " + expectedColor + "; }";
view._goToVisualState('highlighted');
var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
});
}
@ -289,13 +293,14 @@ export var test_applying_disabled_visual_State_when_button_is_disable = function
helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
var view = <buttonModule.Button>views[0];
var page = <pagesModule.Page>views[1];
var expectedColor = "#ffff0000";
var expectedColor = "#FFFF0000";
var expectedNormalizedColor = "#FF0000";
page.css = "button:disabled { background-color: " + expectedColor + "; }";
view.isEnabled = false;
var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
});
}

9
tests/app/ui/label/label-tests.ts
View File

@ -193,8 +193,8 @@ export class LabelTest extends testModule.UITest<LabelModule.Label> {
const label = this.testView;
const fontSize = 14;
const color = "#ffff0000";
const backgroundColor = "#ff00ff00";
const color = "#FFFF0000";
const backgroundColor = "#FF00FF00";
const testCss = [".title {background-color: ", backgroundColor, "; ",
"color: ", color, "; ",
"font-size: ", fontSize, ";}"].join("");
@ -471,14 +471,15 @@ export class LabelTest extends testModule.UITest<LabelModule.Label> {
let view = this.testView;
let page = this.testPage;
this.waitUntilTestElementIsLoaded();
let expectedColor = "#ffff0000";
let expectedColor = "#FFFF0000";
let expectedNormalizedColor = "#FF0000";
page.css = "label:disabled { background-color: " + expectedColor + "; }";
view.isEnabled = false;
let actualResult = labelTestsNative.getNativeBackgroundColor(view);
TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
};
public test_IntegrationTest_Transform_Decoration_Spacing_WithoutFormattedText_DoesNotCrash() {

22
tests/app/ui/page/page-tests-common.ts
View File

@ -295,7 +295,7 @@ export function test_LoadPageFromDeclarativeWithCSS() {
TKUnit.assert(topFrame.currentPage.content instanceof Label, "Content of the test page should be a Label created within test-page-module-css.");
let testLabel = <Label>topFrame.currentPage.content;
TKUnit.assertEqual(testLabel.text, "Label created within a page declarative file with css.");
TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#ff00ff00");
TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#00FF00");
}
export function test_LoadPageFromModuleWithCSS() {
@ -305,7 +305,7 @@ export function test_LoadPageFromModuleWithCSS() {
TKUnit.assert(topFrame.currentPage.content instanceof Label, "Content of the test page should be a Label created within test-page-module-css.");
let testLabel = <Label>topFrame.currentPage.content;
TKUnit.assertEqual(testLabel.text, "Label created within a page module css.");
TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#ff00ff00");
TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#00FF00");
}
export function test_NavigateToPageCreatedWithNavigationEntry() {
@ -334,7 +334,7 @@ export function test_cssShouldBeAppliedToAllNestedElements() {
let stackLayout = new StackLayout();
stackLayout.addChild(label);
testPage.content = stackLayout;
testPage.css = "stackLayout {background-color: #ffff0000;} label {background-color: #ff00ff00;}";
testPage.css = "stackLayout {background-color: #FFFF0000;} label {background-color: #FF00FF00;}";
let pageFactory = function () {
return testPage;
@ -342,8 +342,8 @@ export function test_cssShouldBeAppliedToAllNestedElements() {
helper.navigate(pageFactory);
TKUnit.assertEqual(label.style.backgroundColor.hex, "#ff00ff00");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ffff0000");
TKUnit.assertEqual(label.style.backgroundColor.hex, "#00FF00");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#FF0000");
}
export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
@ -356,7 +356,7 @@ export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
let stackLayout = new StackLayout();
stackLayout.addChild(label);
testPage.content = stackLayout;
testPage.css = "stackLayout {background-color: #ffff0000;} label {background-color: #ff00ff00;}";
testPage.css = "stackLayout {background-color: #FFFF0000;} label {background-color: #FF00FF00;}";
let pageFactory = function () {
return testPage;
@ -364,12 +364,12 @@ export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
helper.navigate(pageFactory);
TKUnit.assertEqual(label.style.backgroundColor.hex, "#ff00ff00");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ffff0000");
TKUnit.assertEqual(label.style.backgroundColor.hex, "#00FF00");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#FF0000");
testPage.css = "stackLayout {background-color: #ff0000ff;} label {background-color: #ffff0000;}";
TKUnit.assertEqual(label.style.backgroundColor.hex, "#ffff0000");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ff0000ff");
testPage.css = "stackLayout {background-color: #FF0000FF;} label {background-color: #FFFF0000;}";
TKUnit.assertEqual(label.style.backgroundColor.hex, "#FF0000");
TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#0000FF");
}
export function test_page_backgroundColor_is_white() {

10
tests/app/ui/search-bar/search-bar-tests.ts
View File

@ -31,18 +31,18 @@ export var testSearchBarHintColorAndroid = function () {
searchBar.text = "";
searchBar.hint = "hint color test";
var expectedValue;
var expectedNormalizedValue;
var actualValue;
searchBar.textFieldHintColor = new colorModule.Color("blue");
expectedValue = "#ff0000ff"; // blue
expectedNormalizedValue = "#0000FF"; // blue
actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
searchBar.textFieldHintColor = new colorModule.Color("red");
expectedValue = "#ffff0000"; // Red
expectedNormalizedValue = "#FF0000"; // red
actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
});
};

28
tests/app/ui/text-field/text-field-tests.ts
View File

@ -397,7 +397,8 @@ export var testNativeFontSizeFromLocal = function () {
});
}
var expectedColorHex = "#ffff0000";
var expectedColorHex = "#FFFF0000";
var expectedNormalizedColorHex = "#FF0000";
export var testLocalColorFromCss = function () {
helper.buildUIAndRunTest(_createTextFieldFunc(), function (views: Array<viewModule.View>) {
var textField = <textFieldModule.TextField>views[0];
@ -405,7 +406,7 @@ export var testLocalColorFromCss = function () {
page.css = "textfield { color: " + expectedColorHex + "; }";
var actualResult = textField.style.color.hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
@ -416,7 +417,7 @@ export var testNativeColorFromCss = function () {
page.css = "textfield { color: " + expectedColorHex + "; }";
var actualResult = textFieldTestsNative.getNativeColor(textField).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
@ -426,11 +427,12 @@ export var testNativeColorFromLocal = function () {
textField.style.color = new colorModule.Color(expectedColorHex);
var actualResult = textFieldTestsNative.getNativeColor(textField).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
var expectedBackgroundColorHex = "#ff00ff00";
var expectedBackgroundColorHex = "#FF00FF00";
var expectedNormalizedBackgroundColorHex = "#00FF00";
export var testLocalBackgroundColorFromCss = function () {
helper.buildUIAndRunTest(_createTextFieldFunc(), function (views: Array<viewModule.View>) {
var textField = <textFieldModule.TextField>views[0];
@ -438,7 +440,7 @@ export var testLocalBackgroundColorFromCss = function () {
page.css = "textfield { background-color: " + expectedBackgroundColorHex + "; }";
var actualResult = textField.style.backgroundColor.hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}
@ -449,7 +451,7 @@ export var testNativeBackgroundColorFromCss = function () {
page.css = "textfield { background-color: " + expectedBackgroundColorHex + "; }";
var actualResult = textFieldTestsNative.getNativeBackgroundColor(textField).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}
@ -459,7 +461,7 @@ export var testNativeBackgroundColorFromLocal = function () {
textField.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
var actualResult = textFieldTestsNative.getNativeBackgroundColor(textField).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}
@ -568,21 +570,23 @@ export function test_IntegrationTest_Transform_Decoration_Spacing_WithFormattedT
export function test_set_placeholder_color() {
let view = new textFieldModule.TextField();
let expectedColorHex = "#ffff0000";
let expectedColorHex = "#FFFF0000";
let expectedNormalizedColorHex = "#FF0000";
helper.buildUIAndRunTest(view, function (views: Array<viewModule.View>) {
view.hint = "Some text for hint";
view.setInlineStyle("placeholder-color: " + expectedColorHex + ";");
let actualColorHex = textFieldTestsNative.getNativePlaceholderColor(view).hex;
TKUnit.assertEqual(actualColorHex, expectedColorHex);
TKUnit.assertEqual(actualColorHex, expectedNormalizedColorHex);
});
}
export function test_set_placeholder_color_when_hint_is_not_set() {
let view = new textFieldModule.TextField();
let expectedColorHex = "#ffff0000";
let expectedColorHex = "#FFFF0000";
let expectedNormalizedColorHex = "#FF0000";
helper.buildUIAndRunTest(view, function (views: Array<viewModule.View>) {
view.setInlineStyle("placeholder-color: " + expectedColorHex + ";");
let actualColorHex = textFieldTestsNative.getNativePlaceholderColor(view).hex;
TKUnit.assertEqual(actualColorHex, expectedColorHex);
TKUnit.assertEqual(actualColorHex, expectedNormalizedColorHex);
});
}

33
tests/app/ui/text-view/text-view-tests.ts
View File

@ -260,22 +260,19 @@ export var testHintColoriOS = function () {
textView.hint = "hint";
var expectedValue;
var expectedNormalizedValue;
var actualValue;
// expectedValue = "#38.1999948ff0000"; // 22% red
// if (utils.ios.MajorVersion > 7) {
// expectedValue = "#38.19999999999aff0000"; // 22% red
// }
actualValue = textViewTestsNative.getNativeColor(textView).hex;
// TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
TKUnit.assert(actualValue.indexOf("#38.19999") === 0, "Expected hint color to start with #38.19999");
TKUnit.assert(actualValue.indexOf("ff0000") !== -1, "Expected hint color to end with ff0000");
TKUnit.assertEqual(actualValue, "#38FF0000", "Expected hint color to be a subtle transparent red: #38FF0000");
textView.text = "text";
expectedValue = "#ffff0000"; // red
expectedValue = "#FFFF0000"; // red
expectedNormalizedValue = "#FF0000";
actualValue = textViewTestsNative.getNativeColor(textView).hex;
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
});
}
@ -377,7 +374,8 @@ export var testNativeFontSizeFromLocal = function () {
});
}
var expectedColorHex = "#ffff0000";
var expectedColorHex = "#FFFF0000";
var expectedNormalizedColorHex = "#FF0000";
export var testLocalColorFromCss = function () {
helper.buildUIAndRunTest(_createTextViewFunc(), function (views: Array<viewModule.View>) {
var textView = <textViewModule.TextView>views[0];
@ -385,7 +383,7 @@ export var testLocalColorFromCss = function () {
page.css = "textview { color: " + expectedColorHex + "; }";
var actualResult = textView.style.color.hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
@ -396,7 +394,7 @@ export var testNativeColorFromCss = function () {
page.css = "textview { color: " + expectedColorHex + "; }";
var actualResult = textViewTestsNative.getNativeColor(textView).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
@ -406,11 +404,12 @@ export var testNativeColorFromLocal = function () {
textView.style.color = new colorModule.Color(expectedColorHex);
var actualResult = textViewTestsNative.getNativeColor(textView).hex;
TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
});
}
var expectedBackgroundColorHex = "#ff00ff00";
var expectedBackgroundColorHex = "#FF00FF00";
var expectedNormalizedBackgroundColorHex = "#00FF00";
export var testLocalBackgroundColorFromCss = function () {
helper.buildUIAndRunTest(_createTextViewFunc(), function (views: Array<viewModule.View>) {
var textView = <textViewModule.TextView>views[0];
@ -418,7 +417,7 @@ export var testLocalBackgroundColorFromCss = function () {
page.css = "textview { background-color: " + expectedBackgroundColorHex + "; }";
var actualResult = textView.style.backgroundColor.hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}
@ -429,7 +428,7 @@ export var testNativeBackgroundColorFromCss = function () {
page.css = "textview { background-color: " + expectedBackgroundColorHex + "; }";
var actualResult = textViewTestsNative.getNativeBackgroundColor(textView).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}
@ -439,7 +438,7 @@ export var testNativeBackgroundColorFromLocal = function () {
textView.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
var actualResult = textViewTestsNative.getNativeBackgroundColor(textView).hex;
TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
});
}

4
tests/app/ui/view/view-tests-common.ts
View File

@ -755,8 +755,8 @@ export function testIsVisible() {
export function testSetInlineStyle() {
const lbl = new Label();
const expectedColor = "#ff0000";
const expectedBackgroundColor = "#ff0000";
const expectedColor = "#FF0000";
const expectedBackgroundColor = "#FF0000";
lbl.setInlineStyle(`color: ${expectedColor};background-color: ${expectedBackgroundColor};`);

101
tns-core-modules/color/color-common.ts
View File

@ -6,11 +6,6 @@ const SHARP = "#";
const HEX_REGEX = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)|(^#[0-9A-F]{8}$)/i;
export class Color implements definition.Color {
private _a: number;
private _r: number;
private _g: number;
private _b: number;
private _hex: string;
private _argb: number;
private _name: string;
@ -25,61 +20,48 @@ export class Color implements definition.Color {
this._argb = argbFromRgbOrRgba(arg);
} else if (knownColors.isKnownName(arg)) {
// The parameter is a known color name
this._hex = knownColors.getKnownColor(arg);
const hex = knownColors.getKnownColor(arg);
this._name = arg;
this._argb = this._argbFromString(this._hex);
this._argb = this._argbFromString(hex);
} else if (HEX_REGEX.test(arg)) {
// The parameter is a "#AARRGGBB" formatted string
this._hex = this._normalizeHex(arg);
this._argb = this._argbFromString(this._hex);
const hex = this._normalizeHex(arg);
this._argb = this._argbFromString(hex);
} else {
throw new Error("Invalid color: " + arg);
}
} else if (types.isNumber(arg)) {
// The parameter is a 32-bit unsigned integer where each 8 bits specify a color component
this._argb = arg;
// In case a 32-bit signed int (Android, Java has no unsigned types) was provided - convert to unsigned by applyint >>> 0
this._argb = arg >>> 0;
} else {
throw new Error("Expected 1 or 4 constructor parameters.");
}
this._parseComponents();
if (!this._hex) {
this._hex = this._buildHex();
}
} else if (arguments.length === 4) {
// TODO: Alpha may be optional
this._a = arguments[0];
this._r = arguments[1];
this._g = arguments[2];
this._b = arguments[3];
this._buildArgb();
this._hex = this._buildHex();
this._argb = (arguments[0] & 0xFF) * 0x01000000
+ (arguments[1] & 0xFF) * 0x00010000
+ (arguments[2] & 0xFF) * 0x00000100
+ (arguments[3] & 0xFF) * 0x00000001;
} else {
throw new Error("Expected 1 or 4 constructor parameters.");
}
}
get a(): number {
return this._a;
}
get r(): number {
return this._r;
}
get g(): number {
return this._g;
}
get b(): number {
return this._b;
}
get a(): number { return (this._argb / 0x01000000) & 0xFF; }
get r(): number { return (this._argb / 0x00010000) & 0xFF; }
get g(): number { return (this._argb / 0x00000100) & 0xFF; }
get b(): number { return (this._argb / 0x00000001) & 0xFF; }
get argb(): number {
return this._argb;
}
get hex(): string {
return this._hex;
if (this.a === 0xFF) {
return ("#" + this._componentToHex(this.r) + this._componentToHex(this.g) + this._componentToHex(this.b)).toUpperCase();
} else {
return ("#" + this._componentToHex(this.a) + this._componentToHex(this.r) + this._componentToHex(this.g) + this._componentToHex(this.b)).toUpperCase();
}
}
get name(): string {
@ -95,7 +77,23 @@ export class Color implements definition.Color {
}
public _argbFromString(hex: string): number {
return undefined;
if (hex.charAt(0) === "#") {
hex = hex.substr(1);
}
if (hex.length === 3) {
hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
} else if (hex.length === 4) {
hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2] + hex[3] + hex[3];
}
var intVal = parseInt(hex, 16);
if (hex.length === 6) {
// add the alpha component since the provided string is RRGGBB
intVal = (intVal & 0x00FFFFFF) + 0xFF000000;
}
return intVal;
}
public equals(value: definition.Color): boolean {
@ -132,10 +130,6 @@ export class Color implements definition.Color {
return HEX_REGEX.test(value) || isRgbOrRgba(value);
}
private _buildHex(): string {
return SHARP + this._componentToHex(this._a) + this._componentToHex(this._r) + this._componentToHex(this._g) + this._componentToHex(this._b);
}
private _componentToHex(component: number): string {
let hex = component.toString(16);
if (hex.length === 1) {
@ -145,23 +139,6 @@ export class Color implements definition.Color {
return hex;
}
private _parseComponents() {
if (types.isUndefined(this._argb)) {
throw new Error("Missing the ARGB numeric value");
}
// Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
this._a = (this._argb >> 24) & 255;
this._r = (this._argb >> 16) & 255;
this._g = (this._argb >> 8) & 255;
this._b = this._argb & 255;
}
private _buildArgb() {
// Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
this._argb = (this._a << 24) | (this._r << 16) | (this._g << 8) | this._b;
}
private _normalizeHex(hexStr: string): string {
if (hexStr.charAt(0) === SHARP && hexStr.length === 4) {
// Duplicate each char after the #, so "#123" becomes "#112233"
@ -208,6 +185,8 @@ function argbFromRgbOrRgba(value: string): number {
a = Math.round(parseFloat(parts[3].trim()) * 255);
}
// Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
return (a << 24) | (r << 16) | (g << 8) | b;
return (a & 0xFF) * 0x01000000
+ (r & 0xFF) * 0x00010000
+ (g & 0xFF) * 0x00000100
+ (b & 0xFF) * 0x00000001;
}

6
tns-core-modules/color/color.android.ts
View File

@ -2,10 +2,6 @@
export class Color extends common.Color {
get android(): number {
return this.argb;
}
public _argbFromString(hex: string): number {
return android.graphics.Color.parseColor(hex);
return this.argb >> 0;
}
}

16
tns-core-modules/color/color.ios.ts
View File

@ -1,7 +1,5 @@
import * as common from "./color-common";
var AMP = "#";
export class Color extends common.Color {
private _ios: UIColor;
@ -12,18 +10,4 @@ export class Color extends common.Color {
}
return this._ios;
}
public _argbFromString(hex: string): number {
if (hex.charAt(0) === AMP) {
hex = hex.substr(1);
}
var intVal = parseInt(hex, 16);
if (hex.length === 6) {
// add the alpha component since the provided string is RRGGBB
intVal |= 255 << 24;
}
return intVal;
}
}

353
tns-core-modules/ui/text-base/text-base.ios.ts
View File

@ -6,7 +6,6 @@
import { _isSet as isSet } from "ui/core/properties";
import { FontWeight, FontStyle } from "ui/styling/font";
import * as utils from "utils/utils";
export * from "./text-base-common";
@ -23,11 +22,15 @@ export class TextBase extends TextBaseCommon {
return '';
}
set [textProperty.native](value: string) {
if (this.formattedText) {
return;
}
const newValue = (value === undefined || value === null) ? '' : value.toString();
const nativeView = this.nativeView;
if (this.textDecorationSet || this.textTransformSet || this.letterSpacingSet) {
const style = this.style;
setTextDecorationAndTransform(newValue, nativeView, style.textDecoration, style.textTransform, style.letterSpacing, style.color);
this.setTextDecorationAndTransform(newValue, nativeView, style.textDecoration, style.textTransform, style.letterSpacing, style.color);
} else if (nativeView instanceof UIButton) {
nativeView.setTitleForState(newValue, UIControlState.Normal);
} else {
@ -43,7 +46,7 @@ export class TextBase extends TextBaseCommon {
}
set [formattedTextProperty.native](value: FormattedString) {
const style = this.style;
setFormattedTextDecorationAndTransform(value, this.nativeView, style.textDecoration, style.textTransform, style.letterSpacing);
this.setFormattedTextDecorationAndTransform(value, this.nativeView, style.textDecoration, style.textTransform, style.letterSpacing);
textProperty.nativeValueChange(this, !value ? '' : value.toString());
this._requestLayoutOnTextChanged();
}
@ -130,9 +133,9 @@ export class TextBase extends TextBaseCommon {
this.textDecorationSet = value !== TextDecoration.NONE;
const style = this.style;
if (this.formattedText) {
setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, value, style.textTransform, style.letterSpacing);
this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, value, style.textTransform, style.letterSpacing);
} else {
setTextDecorationAndTransform(this.text, this.nativeView, value, style.textTransform, style.letterSpacing, style.color);
this.setTextDecorationAndTransform(this.text, this.nativeView, value, style.textTransform, style.letterSpacing, style.color);
}
}
@ -144,13 +147,13 @@ export class TextBase extends TextBaseCommon {
this.textTransformSet = value !== TextTransform.NONE;
const style = this.style;
if (this.formattedText) {
setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, value, style.letterSpacing);
this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, value, style.letterSpacing);
} else {
setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, value, style.letterSpacing, style.color);
this.setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, value, style.letterSpacing, style.color);
}
}
// LetterSpacing
// LetterSpacing.
get [letterSpacingProperty.native](): number {
return 0;
}
@ -158,11 +161,178 @@ export class TextBase extends TextBaseCommon {
this.letterSpacingSet = value !== 0;
const style = this.style;
if (this.formattedText) {
setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, style.textTransform, value);
this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, style.textTransform, value);
} else {
setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, style.textTransform, value, style.color);
this.setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, style.textTransform, value, style.color);
}
}
setFormattedTextDecorationAndTransform(formattedText: FormattedString, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number) {
const attrText = this.createNSMutableAttributedString(formattedText);
if (letterSpacing !== 0) {
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * nativeView.font.pointSize, { location: 0, length: attrText.length });
}
if (nativeView instanceof UIButton) {
nativeView.setAttributedTitleForState(attrText, UIControlState.Normal);
}
else {
nativeView.attributedText = attrText;
}
}
setTextDecorationAndTransform(text: string, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number, color: Color) {
let dict = new Map<string, number>();
switch (textDecoration) {
case TextDecoration.NONE:
break;
case TextDecoration.UNDERLINE:
dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
case TextDecoration.LINE_THROUGH:
dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
case TextDecoration.UNDERLINE_LINE_THROUGH:
dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
default:
throw new Error(`Invalid text decoration value: ${textDecoration}. Valid values are: "${TextDecoration.NONE}", "${TextDecoration.UNDERLINE}", "${TextDecoration.LINE_THROUGH}", "${TextDecoration.UNDERLINE_LINE_THROUGH}".`);
}
if (letterSpacing !== 0) {
dict.set(NSKernAttributeName, letterSpacing * nativeView.font.pointSize);
}
if (color) {
dict.set(NSForegroundColorAttributeName, color.ios);
}
let source = getTransformedText(text, textTransform);
if (dict.size > 0) {
let result = NSMutableAttributedString.alloc().initWithString(source);
result.setAttributesRange(<any>dict, { location: 0, length: source.length });
if (nativeView instanceof UIButton) {
nativeView.setAttributedTitleForState(result, UIControlState.Normal);
} else {
nativeView.attributedText = result;
}
} else {
if (nativeView instanceof UIButton) {
// Clear attributedText or title won't be affected.
nativeView.setAttributedTitleForState(null, UIControlState.Normal);
nativeView.setTitleForState(source, UIControlState.Normal);
} else {
// Clear attributedText or text won't be affected.
nativeView.attributedText = undefined;
nativeView.text = source;
}
}
}
createNSMutableAttributedString(formattedString: FormattedString): NSMutableAttributedString {
let mas = NSMutableAttributedString.alloc().init();
if (formattedString) {
for (let i = 0, spanStart = 0, length = formattedString.spans.length; i < length; i++) {
const span = formattedString.spans.getItem(i);
const text = span.text;
const textTransform = (<TextBase>formattedString.parent).textTransform;
let spanText = (text === null || text === undefined) ? '' : text.toString();
if (textTransform !== "none") {
spanText = getTransformedText(spanText, textTransform);
}
const nsAttributedString = this.createMutableStringForSpan(span, spanText);
mas.insertAttributedStringAtIndex(nsAttributedString, spanStart);
spanStart += spanText.length;
}
}
return mas;
}
createMutableStringForSpan(span: Span, text: string): NSMutableAttributedString {
const viewFont = this.nativeView.font;
let attrDict = <{ key: string, value: any }>{};
const style = span.style;
const bold = isBold(style.fontWeight);
const italic = style.fontStyle === FontStyle.ITALIC;
let fontFamily = span.fontFamily;
let fontSize = span.fontSize;
if (bold || italic || fontFamily || fontSize) {
if (!fontSize) {
fontSize = viewFont.pointSize;
}
if (!fontFamily) {
fontFamily = viewFont.fontName;
}
let font;
let fontDescriptor: UIFontDescriptor = viewFont.fontDescriptor;
if (fontFamily) {
fontDescriptor = fontDescriptor.fontDescriptorWithFamily(fontFamily);
}
let symbolicTraits;
if (bold) {
symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitBold;
}
if (italic) {
symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitItalic;
}
if (symbolicTraits) {
font = UIFont.fontWithDescriptorSize(fontDescriptor.fontDescriptorWithSymbolicTraits(symbolicTraits), fontSize);
} else {
font = UIFont.fontWithDescriptorSize(fontDescriptor, fontSize);
}
attrDict[NSFontAttributeName] = font;
}
const color = span.color;
if (color) {
attrDict[NSForegroundColorAttributeName] = color.ios;
}
// We don't use isSet function here because defaultValue for backgroundColor is null.
const backgroundColor = style.backgroundColor
|| (<FormattedString>span.parent).backgroundColor
|| (<TextBase>(<FormattedString>span.parent).parent).backgroundColor;
if (backgroundColor) {
attrDict[NSBackgroundColorAttributeName] = backgroundColor.ios;
}
let valueSource: typeof style;
if (isSet(textDecorationProperty, style)) {
valueSource = style;
} else if (isSet(textDecorationProperty, span.parent.style)) {
// span.parent is FormattedString
valueSource = span.parent.style;
} else if (isSet(textDecorationProperty, span.parent.parent.style)) {
// span.parent.parent is TextBase
valueSource = span.parent.parent.style;
}
if (valueSource) {
const textDecorations = valueSource.textDecoration;
const underline = textDecorations.indexOf(TextDecoration.UNDERLINE) !== -1;
if (underline) {
attrDict[NSUnderlineStyleAttributeName] = underline;
}
const strikethrough = textDecorations.indexOf(TextDecoration.LINE_THROUGH) !== -1;
if (strikethrough) {
attrDict[NSStrikethroughStyleAttributeName] = strikethrough;
}
}
return NSMutableAttributedString.alloc().initWithStringAttributes(text, <any>attrDict);
}
}
export function getTransformedText(text: string, textTransform: TextTransform): string {
@ -184,172 +354,9 @@ function NSStringFromNSAttributedString(source: NSAttributedString | string): NS
return NSString.stringWithString(source instanceof NSAttributedString && source.string || <string>source);
}
function setFormattedTextDecorationAndTransform(formattedText: FormattedString, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number) {
const attrText = createNSMutableAttributedString(formattedText);
if (letterSpacing !== 0) {
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * nativeView.font.pointSize, { location: 0, length: attrText.length });
}
if (nativeView instanceof UIButton) {
nativeView.setAttributedTitleForState(attrText, UIControlState.Normal);
}
else {
nativeView.attributedText = attrText;
}
}
function setTextDecorationAndTransform(text: string, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number, color: Color) {
let dict = new Map<string, number>();
switch (textDecoration) {
case TextDecoration.NONE:
break;
case TextDecoration.UNDERLINE:
dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
case TextDecoration.LINE_THROUGH:
dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
case TextDecoration.UNDERLINE_LINE_THROUGH:
dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
break;
default:
throw new Error(`Invalid text decoration value: ${textDecoration}. Valid values are: "${TextDecoration.NONE}", "${TextDecoration.UNDERLINE}", "${TextDecoration.LINE_THROUGH}", "${TextDecoration.UNDERLINE_LINE_THROUGH}".`);
}
if (letterSpacing !== 0) {
dict.set(NSKernAttributeName, letterSpacing * nativeView.font.pointSize);
}
if (color) {
dict.set(NSForegroundColorAttributeName, color.ios);
}
let source = getTransformedText(text, textTransform);
if (dict.size > 0) {
let result = NSMutableAttributedString.alloc().initWithString(source);
result.setAttributesRange(<any>dict, { location: 0, length: source.length });
if (nativeView instanceof UIButton) {
nativeView.setAttributedTitleForState(result, UIControlState.Normal);
} else {
nativeView.attributedText = result;
}
} else {
if (nativeView instanceof UIButton) {
// Clear attributedText or title won't be affected.
nativeView.setAttributedTitleForState(null, UIControlState.Normal);
nativeView.setTitleForState(source, UIControlState.Normal);
} else {
// Clear attributedText or text won't be affected.
nativeView.attributedText = undefined;
nativeView.text = source;
}
}
}
function createNSMutableAttributedString(formattedString: FormattedString): NSMutableAttributedString {
let mas = NSMutableAttributedString.alloc().init();
if (formattedString) {
for (let i = 0, spanStart = 0, length = formattedString.spans.length; i < length; i++) {
const span = formattedString.spans.getItem(i);
const text = span.text;
const textTransform = (<TextBase>formattedString.parent).textTransform;
let spanText = (text === null || text === undefined) ? '' : text.toString();
if (textTransform) {
spanText = getTransformedText(spanText, textTransform);
}
const nsAttributedString = createMutableStringForSpan(span, spanText);
mas.insertAttributedStringAtIndex(nsAttributedString, spanStart);
spanStart += spanText.length;
}
}
return mas;
}
function isBold(fontWeight: FontWeight): boolean {
return fontWeight === FontWeight.BOLD
|| fontWeight === "700"
|| fontWeight === FontWeight.EXTRA_BOLD
|| fontWeight === FontWeight.BLACK;
}
function createMutableStringForSpan(span: Span, text: string): NSMutableAttributedString {
let attrDict = <{ key: string, value: any }>{};
const style = span.style;
const bold = isBold(style.fontWeight);
const italic = style.fontStyle === FontStyle.ITALIC;
let fontFamily = span.fontFamily;
let fontSize = span.fontSize;
if (bold || italic || fontFamily || fontSize) {
let font;
if (fontFamily) {
if (!fontSize) {
fontSize = utils.ios.getter(UIFont, UIFont.systemFontSize);
}
font = UIFont.fontWithNameSize(fontFamily, fontSize);
}
if (!font) {
const fontDescriptor = UIFontDescriptor.new();
let symbolicTraits;
if (bold) {
symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitBold;
}
if (italic) {
symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitItalic;
}
if (symbolicTraits) {
font = UIFont.fontWithDescriptorSize(fontDescriptor.fontDescriptorWithSymbolicTraits(symbolicTraits), fontSize);
} else {
font = UIFont.fontWithDescriptorSize(fontDescriptor, fontSize);
}
}
attrDict[NSFontAttributeName] = font;
}
const color = span.color;
if (color) {
attrDict[NSForegroundColorAttributeName] = color.ios;
}
// We don't use isSet function here because defaultValue for backgroundColor is null.
const backgroundColor = style.backgroundColor
|| (<FormattedString>span.parent).backgroundColor
|| (<TextBase>(<FormattedString>span.parent).parent).backgroundColor;
if (backgroundColor) {
attrDict[NSBackgroundColorAttributeName] = backgroundColor.ios;
}
let valueSource: typeof style;
if (isSet(textDecorationProperty, style)) {
valueSource = style;
} else if (isSet(textDecorationProperty, span.parent.style)) {
// span.parent is FormattedString
valueSource = span.parent.style;
} else if (isSet(textDecorationProperty, span.parent.parent.style)) {
// span.parent.parent is TextBase
valueSource = span.parent.parent.style;
}
if (valueSource) {
const textDecorations = valueSource.textDecoration;
const underline = textDecorations.indexOf(TextDecoration.UNDERLINE) !== -1;
if (underline) {
attrDict[NSUnderlineStyleAttributeName] = underline;
}
const strikethrough = textDecorations.indexOf(TextDecoration.LINE_THROUGH) !== -1;
if (strikethrough) {
attrDict[NSStrikethroughStyleAttributeName] = strikethrough;
}
}
return NSMutableAttributedString.alloc().initWithStringAttributes(text, <any>attrDict);
}