我是一个初学者,我已经学会了当屏幕大小从桌面到平板电脑再到移动设备时如何处理大小调整和文本渲染。但我想知道,当我在同一屏幕模式下减小屏幕大小时,如何更改大小或调整内容。
例如-
return Container(
child: new Row(
children: <Widget>[
new Column(
children: <Widget>[new Text("Hello World")],
),
new Column(
children: <Widget>[
new Text(
"This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is ")
],
)
],
),
);
在这种情况下,当我试图将屏幕大小从桌面缩小到桌面时,我开始出现oveflow异常。请指导我如何处理它。
Expanded类似于Flex,支持添加Flex、
你可以用Expanded包裹你的孩子,并按照以下进行弯曲
更新代码:
Container(
child: new Row(
children: <Widget>[
new Expanded (
flex:1,
child : Column(
children: <Widget>[new Text("Hello World")],
),),
new Expanded(
flex :2,
child: Column(
children: <Widget>[
new Text(
"This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is ")
],
),)
],
),
)
展开:一个小部件,用于展开Row、Column或Flex的子级,以便该子级填充可用空间。
你可以在这里阅读更多官方文档
Flex
小部件(例如Column, Row
(中的小部件可以封装在Flexible小部件中。Flexible
小部件具有灵活性。Flutter有3个灵活的小部件:灵活、扩展和间隔
return Container(
child: new Row(
children: <Widget>[
Flexible(
flex: 1 /*or any integer value above 0 (optional)*/,
child: Column(
children: <Widget>[
Expanded(
flex: 1 /*or any integer value above 0 (optional)*/,
child: new Text("Hello World")),
],
),
),
new Column(
children: <Widget>[
new Text(
"This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is This is a long text this is a long test this is ")
],
)
],
),
);