From b1573f923af90ed7b9c9724c5d2208a49e813b43 Mon Sep 17 00:00:00 2001
From: Peter Abbondanzo <abbo@meta.com>
Date: Thu, 17 Oct 2024 09:00:28 -0700
Subject: [PATCH] Ensure alert dialog title wraps to two lines, uses default
style
Summary:
The [internal `DialogTitle` implementation from Android](https://cs.android.com/android/platform/superproject/main/+/main:frameworks/base/core/java/com/android/internal/widget/DialogTitle.java;l=63?q=DialogTitle) makes additional checks to see if the title should wrap to two lines before applying ellipsis, so this change recreates those same checks. This change also removes the text appearance and size changes made to the layout.
Reverts some of the changes made to https://github.com/facebook/react-native/pull/45395.
**Changelog:**
[Android][Fixed] - Fixed styling on alert dialog titles to wrap two lines and retain bold appearance
Differential Revision: D64543105
---
.../react/modules/dialog/DialogTitle.kt | 55 +++++++++++++++++++
.../views/alert/layout/alert_title_layout.xml | 8 +--
2 files changed, 59 insertions(+), 4 deletions(-)
create mode 100644 packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/dialog/DialogTitle.kt
diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/dialog/DialogTitle.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/dialog/DialogTitle.kt
new file mode 100644
index 00000000000000..2dfad101298034
--- /dev/null
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/dialog/DialogTitle.kt
@@ -0,0 +1,55 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+package com.facebook.react.modules.dialog
+
+import android.content.Context
+import android.util.AttributeSet
+import android.widget.TextView
+
+/**
+ * Reimplementation of Android's internal DialogTitle. This class will attempt to render titles on
+ * two lines if they are too long, applying ellipsis as necessary.
+ *
+ * @see
+ * https://cs.android.com/android/platform/superproject/main/+/main:frameworks/base/core/java/com/android/internal/widget/DialogTitle.java
+ */
+internal class DialogTitle : TextView {
+
+ constructor(
+ context: Context,
+ attrs: AttributeSet,
+ defStyleAttr: Int,
+ defStyleRes: Int,
+ ) : super(context, attrs, defStyleAttr, defStyleRes)
+
+ constructor(
+ context: Context,
+ attrs: AttributeSet,
+ defStyleAttr: Int,
+ ) : super(context, attrs, defStyleAttr)
+
+ constructor(context: Context, attrs: AttributeSet) : super(context, attrs)
+
+ constructor(context: Context) : super(context)
+
+ override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
+ super.onMeasure(widthMeasureSpec, heightMeasureSpec)
+ val layout = layout
+ if (layout != null) {
+ val lineCount = layout.lineCount
+ if (lineCount > 0) {
+ val ellipsisCount = layout.getEllipsisCount(lineCount - 1)
+ if (ellipsisCount > 0) {
+ setSingleLine(false)
+ setMaxLines(2)
+ super.onMeasure(widthMeasureSpec, heightMeasureSpec)
+ }
+ }
+ }
+ }
+}
diff --git a/packages/react-native/ReactAndroid/src/main/res/views/alert/layout/alert_title_layout.xml b/packages/react-native/ReactAndroid/src/main/res/views/alert/layout/alert_title_layout.xml
index 0677d76b4b0601..1814ab47fc85ac 100644
--- a/packages/react-native/ReactAndroid/src/main/res/views/alert/layout/alert_title_layout.xml
+++ b/packages/react-native/ReactAndroid/src/main/res/views/alert/layout/alert_title_layout.xml
@@ -6,9 +6,10 @@
android:orientation="horizontal"
android:paddingStart="?android:attr/dialogPreferredPadding"
android:paddingTop="18dp"
- android:paddingEnd="?android:attr/dialogPreferredPadding">
+ android:paddingEnd="?android:attr/dialogPreferredPadding"
+ >
- <TextView
+ <com.facebook.react.modules.dialog.DialogTitle
android:id="@+id/alert_title"
style="?android:attr/windowTitleStyle"
android:layout_width="match_parent"
@@ -16,7 +17,6 @@
android:ellipsize="end"
android:singleLine="true"
android:textAlignment="viewStart"
- android:textAppearance="?android:attr/textAppearanceMedium"
- android:textSize="18sp" />
+ />
</LinearLayout>