From 0b9d4aea0ab76f01107de0b33c83a5c77e1c9559 Mon Sep 17 00:00:00 2001 From: Manol Donev Date: Thu, 7 Jun 2018 16:44:33 +0300 Subject: [PATCH] fix(android): label width shrinking on shorter text change (#5917) --- tests/app/ui/label/label-tests.ts | 99 ++++++++++++++++++- .../ui/text-base/text-base-common.ts | 6 +- 2 files changed, 101 insertions(+), 4 deletions(-) diff --git a/tests/app/ui/label/label-tests.ts b/tests/app/ui/label/label-tests.ts index fad7aa778..5063e903f 100644 --- a/tests/app/ui/label/label-tests.ts +++ b/tests/app/ui/label/label-tests.ts @@ -20,6 +20,7 @@ import { isIOS, isAndroid } from "tns-core-modules/platform"; import { Label } from "tns-core-modules/ui/label"; import { LayoutBase } from "tns-core-modules/ui/layouts/layout-base"; import * as helper from "../helper"; +import { Span, FormattedString } from "tns-core-modules/text/formatted-string"; export class LabelTest extends testModule.UITest { @@ -137,6 +138,102 @@ export class LabelTest extends testModule.UITest { TKUnit.assertEqual(actualNative, expectedValue); } + public test_label_shrinks_on_text_change() { + const label = this.testView; + label.horizontalAlignment = "left"; + this.waitUntilTestElementIsLoaded(); + + label.text = "long label long label"; + this.waitUntilTestElementLayoutIsValid(); + const longLabelWidth = label.getActualSize().width; + + label.text = "short label"; + this.waitUntilTestElementLayoutIsValid(); + const shortLabelWidth = label.getActualSize().width; + + TKUnit.assert(longLabelWidth > shortLabelWidth, "label width should shrink on text change."); + } + + public test_label_shrinks_on_formatted_text_change() { + const label = this.testView; + label.horizontalAlignment = "left"; + this.waitUntilTestElementIsLoaded(); + + const span = new Span(); + span.text = "long label"; + span.fontWeight = "bold"; + + const span2 = new Span(); + span2.text = "long label"; + + const formattedString = new FormattedString(); + formattedString.spans.push(span); + formattedString.spans.push(span2); + label.formattedText = formattedString; + this.waitUntilTestElementLayoutIsValid(); + const longLabelWidth = label.getActualSize().width; + + const span3 = new Span(); + span3.text = "short label"; + span3.fontWeight = "bold"; + + const formattedString2 = new FormattedString(); + formattedString2.spans.push(span3); + label.formattedText = formattedString2; + this.waitUntilTestElementLayoutIsValid(); + const shortLabelWidth = label.getActualSize().width; + + TKUnit.assert(longLabelWidth > shortLabelWidth, "label width should shrink on formatted text change."); + } + + public test_label_grows_on_text_change() { + const label = this.testView; + label.horizontalAlignment = "left"; + this.waitUntilTestElementIsLoaded(); + + label.text = "short label"; + this.waitUntilTestElementLayoutIsValid(); + const shortLabelWidth = label.getActualSize().width; + + label.text = "long label long label"; + this.waitUntilTestElementLayoutIsValid(); + const longLabelWidth = label.getActualSize().width; + + TKUnit.assert(longLabelWidth > shortLabelWidth, "label width should grow on text change."); + } + + public test_label_grows_on_formatted_text_change() { + const label = this.testView; + label.horizontalAlignment = "left"; + this.waitUntilTestElementIsLoaded(); + + const span = new Span(); + span.text = "short label"; + span.fontWeight = "bold"; + + const formattedString = new FormattedString(); + formattedString.spans.push(span); + label.formattedText = formattedString; + this.waitUntilTestElementLayoutIsValid(); + const shortLabelWidth = label.getActualSize().width; + + const span2 = new Span(); + span2.text = "long label"; + span2.fontWeight = "bold"; + + const span3 = new Span(); + span3.text = "long label"; + + const formattedString2 = new FormattedString(); + formattedString2.spans.push(span2); + formattedString2.spans.push(span3); + label.formattedText = formattedString2; + this.waitUntilTestElementLayoutIsValid(); + const longLabelWidth = label.getActualSize().width; + + TKUnit.assert(longLabelWidth > shortLabelWidth, "label width should grow on formatted text change."); + } + public test_measuredWidth_is_not_clipped() { const label = this.testView; label.horizontalAlignment = "left"; @@ -539,7 +636,7 @@ export class LabelTest extends testModule.UITest { if (expectRequestLayout) { TKUnit.assertTrue(called, "label.requestLayout should be called."); } else { - TKUnit.assertFalse(called, "image.requestLayout should not be called."); + TKUnit.assertFalse(called, "label.requestLayout should not be called."); } } diff --git a/tns-core-modules/ui/text-base/text-base-common.ts b/tns-core-modules/ui/text-base/text-base-common.ts index 5583a0cd9..ee7482beb 100644 --- a/tns-core-modules/ui/text-base/text-base-common.ts +++ b/tns-core-modules/ui/text-base/text-base-common.ts @@ -4,7 +4,7 @@ import { FontStyle, FontWeight } from "../styling/font"; import { PropertyChangeData } from "../../data/observable"; // Types. -import { View, ViewBase, Property, CssProperty, InheritedCssProperty, Style, isIOS, Observable, makeValidator, makeParser, Length } from "../core/view"; +import { View, ViewBase, Property, CssProperty, InheritedCssProperty, Style, isAndroid, isIOS, Observable, makeValidator, makeParser, Length } from "../core/view"; import { FormattedString, Span } from "../../text/formatted-string"; export { FormattedString, Span }; @@ -169,10 +169,10 @@ export function isBold(fontWeight: FontWeight): boolean { return fontWeight === "bold" || fontWeight === "700" || fontWeight === "800" || fontWeight === "900"; } -export const textProperty = new Property({ name: "text", defaultValue: "" }); +export const textProperty = new Property({ name: "text", defaultValue: "", affectsLayout: isAndroid }); textProperty.register(TextBaseCommon); -export const formattedTextProperty = new Property({ name: "formattedText", affectsLayout: isIOS, valueChanged: onFormattedTextPropertyChanged }); +export const formattedTextProperty = new Property({ name: "formattedText", affectsLayout: true, valueChanged: onFormattedTextPropertyChanged }); formattedTextProperty.register(TextBaseCommon); function onFormattedTextPropertyChanged(textBase: TextBaseCommon, oldValue: FormattedString, newValue: FormattedString) {