我有以下代码:
import 'package:flutter/material.dart';
class HomePage extends StatelessWidget {
const HomePage({super.key});
final String longText = '''
Vestibulum dapibus sit amet ante et vehicula. Aliquam erat volutpat.
Pellentesque ut velit odio. Nam varius interdum urna ac gravida.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Curabitur dapibus in enim nec porta. Praesent tortor diam, tempus a massa eget, mattis imperdiet tellus.
Aliquam porta pellentesque tellus sit amet dapibus.
Vivamus dolor dui, dapibus sed risus ac, pellentesque convallis mauris.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Vivamus egestas metus eget ipsum pretium scelerisque.
Nulla tempus ligula venenatis faucibus suscipit.
Aenean est tortor, elementum fermentum ullamcorper a, consectetur nec erat.
Quisque tincidunt finibus metus, eget vulputate turpis volutpat ac.
Vivamus consectetur at ligula ac semper. Duis a justo sed tortor egestas sodales sed vitae sem.
Mauris efficitur finibus lectus quis lacinia.
Mauris velit odio, finibus et ipsum et, maximus iaculis diam.
Phasellus ligula mi, gravida in enim et, fermentum tempus quam.
Integer fermentum orci risus, eget aliquam nulla posuere eu.
Donec dictum tristique nunc, in ullamcorper mi pulvinar ac.
Integer sit amet laoreet nisi. Donec aliquet nibh nec rutrum aliquet.
Mauris rutrum non ipsum et volutpat.
''';
final String shortText =
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris venenatis hendrerit lectus sit amet venenatis.';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Home Page'),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
Expanded(
child: Text(
longText,
),
),
Expanded(
child: Container(
color: Colors.teal,
),
),
],
),
),
);
}
}
输出如下:
这很好(Text
的一半空间,Container
的另一半空间)和我想要的,但更长的文本.如果我有一个更短的文本,如下所示:
child: Text(
shortText,
),
然后输出将如下所示:
在Text
和Container
之间有一个空白的空间,我知道这是因为Expanded
.但我想让Container
填补剩余的空间,直到Text
的最后一行.但同样,如果Text
更大,那么Text
和Container
都应该像第一张照片一样占据半个屏幕.
如果我将Text
的父Expanded
替换为Flexible
,则它将如下所示:
这是接近我想要的,但再次,有一个空的空间低于Container
.