Text with overflow is clipped from top #98975
Description
Steps to Reproduce
- Execute
flutter runon the code sample
Expected results: Text rendered correctly whether overflowing or not
Actual results: Text cut above when overflowing:
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(primarySwatch: Colors.blue),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
const TextStyle textStyle = TextStyle(
fontSize: 18.0,
color: Colors.black,
);
const StrutStyle strutStyle = StrutStyle(forceStrutHeight: true, height: 1.0);
final List<String> texts = <String>[
'BGBGBGj first line',
'BGBGBGj second line is a bit longer',
'BGBGBGj third line is a bit longer and has ellipsis',
'BGBGBGj fourth line is normal',
'Lorem ipsum 1',
'Lorem ipsum 2',
'Lorem ipsum 3',
'Lorem ipsum 4',
'Lorem ipsum 5',
'Lorem ipsum 6',
'Lorem ipsum 7',
'Lorem ipsum 8',
'Lorem ipsum 9',
'Lorem ipsum 10',
'Lorem ipsum 11',
];
final List<Widget> tiles = texts.map((String text) {
return ListTile(
title: Text(
text,
style: textStyle,
strutStyle: strutStyle,
maxLines: 1,
softWrap: false,
overflow: TextOverflow.fade,
),
);
}).toList();
return Scaffold(
appBar: AppBar(title: Text(widget.title)),
body: Center(
child: SizedBox(
width: 400.0,
child: Scrollbar(
child: ListView(children: tiles),
),
),
),
);
}
}