From 6c60eab870026e970a5fee1e064e2ee8ccde476a Mon Sep 17 00:00:00 2001
From: felixkrautschuk <felixkrautschuk@gmail.com>
Date: Fri, 18 Nov 2022 19:29:05 +0100
Subject: [PATCH] fix(core): ellipsis at the end for Labels with maxLines
 (#10005)

---
 apps/toolbox/src/main-page.xml              |  3 +-
 apps/toolbox/src/pages/labels.ts            | 10 ++++
 apps/toolbox/src/pages/labels.xml           | 54 +++++++++++++++++++++
 packages/core/ui/text-base/index.android.ts |  1 +
 packages/core/ui/text-base/index.ios.ts     |  1 +
 5 files changed, 68 insertions(+), 1 deletion(-)
 create mode 100644 apps/toolbox/src/pages/labels.ts
 create mode 100644 apps/toolbox/src/pages/labels.xml

diff --git a/apps/toolbox/src/main-page.xml b/apps/toolbox/src/main-page.xml
index 010e7fd99..28f53ca08 100644
--- a/apps/toolbox/src/main-page.xml
+++ b/apps/toolbox/src/main-page.xml
@@ -9,9 +9,10 @@
         <Button text="a11y" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="box-shadow" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="css-playground" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
-         <Button text="datepicker" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
+        <Button text="datepicker" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="image-async" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="image-handling" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
+        <Button text="labels" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="list-page" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="root-layout" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
         <Button text="switch" tap="{{ viewDemo }}" class="btn btn-primary btn-view-demo" />
diff --git a/apps/toolbox/src/pages/labels.ts b/apps/toolbox/src/pages/labels.ts
new file mode 100644
index 000000000..6a625c8f3
--- /dev/null
+++ b/apps/toolbox/src/pages/labels.ts
@@ -0,0 +1,10 @@
+import { Page, Observable, EventData } from '@nativescript/core';
+
+let page: Page;
+
+export function navigatingTo(args: EventData) {
+	page = <Page>args.object;
+	page.bindingContext = new SampleData();
+}
+
+export class SampleData extends Observable {}
diff --git a/apps/toolbox/src/pages/labels.xml b/apps/toolbox/src/pages/labels.xml
new file mode 100644
index 000000000..a94207cab
--- /dev/null
+++ b/apps/toolbox/src/pages/labels.xml
@@ -0,0 +1,54 @@
+<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
+    <Page.actionBar>
+        <ActionBar title="Labels and TextView" class="action-bar">
+        </ActionBar>
+    </Page.actionBar>
+    <ScrollView>
+      <StackLayout padding="20">
+        <Label text="maxLines 2" fontWeight="bold" />
+        <Label
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				textWrap="true"
+				maxLines="2"
+				marginTop="2"
+			/>
+
+        <Label text="maxLines 3" fontWeight="bold" marginTop="6" />
+        <Label
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				textWrap="true"
+				maxLines="3"
+				marginTop="2"
+			/>
+
+        <Label text="maxLines 4" fontWeight="bold" marginTop="6" />
+        <Label
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				textWrap="true"
+				maxLines="4"
+				marginTop="2"
+			/>
+
+        <Label text="NO textWrap" fontWeight="bold" marginTop="6" />
+        <Label
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				marginTop="2"
+			/>
+
+        <Label text="NO maxLines" fontWeight="bold" marginTop="6" />
+        <Label
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				textWrap="true"
+				marginTop="2"
+			/>
+
+        <Label text="TextView with maxLines 4" fontWeight="bold" marginTop="6" />
+        <TextView
+				text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."
+				maxLines="4"
+				textWrap="true"
+				marginTop="2"
+			/>
+      </StackLayout>
+    </ScrollView>
+</Page>
diff --git a/packages/core/ui/text-base/index.android.ts b/packages/core/ui/text-base/index.android.ts
index d325a7083..ce7d277f0 100644
--- a/packages/core/ui/text-base/index.android.ts
+++ b/packages/core/ui/text-base/index.android.ts
@@ -468,6 +468,7 @@ export class TextBase extends TextBaseCommon {
 			nativeTextViewProtected.setMaxLines(Number.MAX_SAFE_INTEGER);
 		} else {
 			nativeTextViewProtected.setMaxLines(typeof value === 'string' ? parseInt(value, 10) : value);
+			nativeTextViewProtected.setEllipsize(android.text.TextUtils.TruncateAt.END);
 		}
 	}
 
diff --git a/packages/core/ui/text-base/index.ios.ts b/packages/core/ui/text-base/index.ios.ts
index b52994014..33e674922 100644
--- a/packages/core/ui/text-base/index.ios.ts
+++ b/packages/core/ui/text-base/index.ios.ts
@@ -244,6 +244,7 @@ export class TextBase extends TextBaseCommon {
 			}
 		} else if (nativeTextViewProtected instanceof UILabel) {
 			nativeTextViewProtected.numberOfLines = numberOfLines;
+			nativeTextViewProtected.lineBreakMode = NSLineBreakMode.ByTruncatingTail;
 		} else if (nativeTextViewProtected instanceof UIButton) {
 			nativeTextViewProtected.titleLabel.numberOfLines = numberOfLines;
 		}