我已经为此苦苦挣扎了一段时间,而且在过去,我尝试了许多添加约束的组合,包括行、列、扩展、灵活、ConstrainedBox、LayoutBuilder 等的变体,但似乎没有什么可以解决文本和的基本问题TextOverflow 实际上并没有帮助限制溢出边界。似乎如果框架知道它正在溢出,那么必须有一种方法来限制到这一点,但我还没有找到它。任何建议(包括包)都将受到欢迎,否则我正在考虑为该框架制作 PR。这是显示我的麻烦的最小示例。
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child:
Container(
color: Colors.red,
width: MediaQuery.of(context).size.width,
child:Row(children: [
Row(children: [
Text("A VERY LONG TEXT ASDFASDFASDFASDFASDFASDFASDFASDASDFASDFASDFASDFASDFASDFASDFASDF",
style: TextStyle(overflow: TextOverflow.clip),
)
],),
Row(children: [
Container(
color: Colors.green,
width: MediaQuery.of(context).size.width * .25,
),
Container(
color: Colors.blue,
width: MediaQuery.of(context).size.width * .25,
)
],)
]),)
),
);
}
}
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
color: Colors.red,
width: MediaQuery.of(context).size.width,
child: Row(children: [
Expanded(
child: Text(
"A VERY LONG TEXT ASDFASDFASDFASDFASDFASDFASDFASDASDFASDFASDFASDFASDFASDFASDFASDF",
style: TextStyle(overflow: TextOverflow.clip),
),
),
Row(
children: [
Container(
color: Colors.green,
width: MediaQuery.of(context).size.width * .25,
),
Container(
color: Colors.blue,
width: MediaQuery.of(context).size.width * .25,
)
],
)
]),
)),
);
}
}
这应该有效