Text overflow issue when text content combines different languages characters #114949
Labels
a: typography
Text rendering, possibly libtxt
found in release: 3.3
Found to occur in 3.3
found in release: 3.4
Found to occur in 3.4
framework
flutter/packages/flutter repository. See also f: labels.
has reproducible steps
The issue has been confirmed reproducible and is ready to work on
r: duplicate
Issue is closed as a duplicate of an existing issue
Comments
|
After investigate, this may caused by word boundary? If so, should we provide a option for Text that user can disable line clip based on word boundary since the current words break rule may not met user's intent. Furthermore, have tried android Textview with code below, works as expected. <TextView
android:id="@+id/textview_first"
android:layout_width="100dp"
android:background="@color/black"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:ellipsize="end"
android:maxLines="1"
android:text="你abcdefsdasdsasas"
android:textColor="@color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/button_first" />
|
Triage reportI can reproduce this issue with the latest Code Sampleimport 'package:flutter/material.dart';
Future<void> main() async {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'Flutter Demo',
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
//clip issue when text combine different characters
//Chinese characters with English characters
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
color: Colors.amber,
constraints: const BoxConstraints(maxWidth: 120),
child: const Text(
"你abcdefsdasdsasas",
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
)
],
),
//Korean characters with digits
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
color: Colors.amber,
constraints: const BoxConstraints(maxWidth: 120),
child: const Text(
"한111111111111111111",
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
)
],
),
//English with digits no issue
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
color: Colors.amber,
constraints: const BoxConstraints(maxWidth: 120),
child: const Text(
"abcdefsdasds1112222",
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
)
],
),
],
),
),
);
}
}Screenshot
|
exaby73
added
framework
|
This looks like a duplicate of #18761. |
exaby73
added
the
r: duplicate
|
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Steps to Reproduce
flutter runon the code sampleExpected results:
The "你abcdefsdasdsasas" text should be displayed as "你abcdefsdasdsa...".
The "한111111111111111111" text should be displayed as "한1111111111111111...".
Actual results:
The text has been clip too much when there has enough place to display more characters.
Code sample
Logs
The text was updated successfully, but these errors were encountered: