将我的小部件放入Flutter中的列会破坏所有内容
问题描述 投票：0回答：1
我作为锻炼对象，尝试重新创建IMDb应用程序。我这样做是为了尽可能地学习某些东西，以使它们看起来应有的外观。列中的行中的列变得越来越复杂，我不确定是否做错了什么，但是它的工作原理是这样的（请告诉我我的代码是否根本上是错误的）。
The Page, when they are not in a column
我已经尝试了很多事情，甚至在代码中有空列以及下面的文本和按钮，它也可以正常工作（例如，按钮位于文本旁边，而不是应该位于文本的下方，但是确实可以不会崩溃）
被许多/////包围的部分是“问题区域”，我不知道上下文需要什么
Card(
color: (HSVColor.fromAHSV(1.0, 0.0, 0.0, 0.22)).toColor(),
child: Column(children: <Widget>[
Stack(
children: <Widget>[
ShaderMask(
shaderCallback: (rect) {
return LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.black, Colors.transparent],
).createShader(
Rect.fromLTRB(0, 200, rect.width, rect.height));
},
blendMode: BlendMode.dstIn,
child: Image.asset("assets/movies/" +
_movie.getImagePath() +
'/banner1.bmp'),
),
Align(
alignment: FractionalOffset.bottomLeft,
child: Padding(
padding: EdgeInsets.only(bottom: 10.0),
child: Column(children: <Widget>[
RichText(
textAlign: TextAlign.left,
text: TextSpan(
text: _movie.getName() + '\n\n',
style:
TextStyle(color: Colors.white, fontSize: 25),
children: <TextSpan>[],
),
),
]),
),
)
],
),
Align(
alignment: Alignment.bottomLeft,
child: Text(
"\n " +
_movie.getReleaseYear() +
" " +
_movie.getDuration().toString() +
"min Directed by: " +
_movie.getDirector(),
textAlign: TextAlign.left,
style: TextStyle(color: Colors.white70))),
Padding(
padding: EdgeInsets.all(7.0),
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Image.asset(
"assets/movies/" +
_movie.getImagePath() +
'/poster.bmp',
height: 240,
width: 160),
Padding(
padding: EdgeInsets.all(4.0),
),
/////////////////////////////////////////////////////
Column(
children: <Widget>[],
),
Expanded(
child: Align(
alignment: Alignment.topLeft,
child: Text(
_movie.getDescription(),
style: TextStyle(color: Colors.white),
))),
RaisedButton(
onPressed: () {},
textColor: Colors.white,
color: Colors.blue,
)
/////////////////////////////////////////////////////
],
)
])),
您可能会看到，我在这里所做的就是将Expanded and Button拖放到Column中。
Card(
color: (HSVColor.fromAHSV(1.0, 0.0, 0.0, 0.22)).toColor(),
child: Column(children: <Widget>[
Stack(
children: <Widget>[
ShaderMask(
shaderCallback: (rect) {
return LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.black, Colors.transparent],
).createShader(
Rect.fromLTRB(0, 200, rect.width, rect.height));
},
blendMode: BlendMode.dstIn,
child: Image.asset("assets/movies/" +
_movie.getImagePath() +
'/banner1.bmp'),
),
Align(
alignment: FractionalOffset.bottomLeft,
child: Padding(
padding: EdgeInsets.only(bottom: 10.0),
child: Column(children: <Widget>[
RichText(
textAlign: TextAlign.left,
text: TextSpan(
text: _movie.getName() + '\n\n',
style:
TextStyle(color: Colors.white, fontSize: 25),
children: <TextSpan>[],
),
),
]),
),
)
],
),
Align(
alignment: Alignment.bottomLeft,
child: Text(
"\n " +
_movie.getReleaseYear() +
" " +
_movie.getDuration().toString() +
"min Directed by: " +
_movie.getDirector(),
textAlign: TextAlign.left,
style: TextStyle(color: Colors.white70))),
Padding(
padding: EdgeInsets.all(7.0),
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Image.asset(
"assets/movies/" +
_movie.getImagePath() +
'/poster.bmp',
height: 240,
width: 160),
Padding(
padding: EdgeInsets.all(4.0),
),
/////////////////////////////////////////////////////
Column(children: <Widget>[
Expanded(
child: Align(
alignment: Alignment.topLeft,
child: Text(
_movie.getDescription(),
style: TextStyle(color: Colors.white),
))),
RaisedButton(
onPressed: () {},
textColor: Colors.white,
color: Colors.blue,
)
],),
/////////////////////////////////////////////////////
],
)
])),
然后我会收到22条错误消息
════════ (2) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#46c16 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Column file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:28:22
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (3) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#1ecab relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (4) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#bf879 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (5) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#23d9c relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (6) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: _RenderInkFeatures#d5fb8 relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (7) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderCustomPaint#c42f6 relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (8) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#af491 relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (9) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderPadding#82ff0 relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (10) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#d9b34 relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (11) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#f2c36 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (12) Exception caught by rendering library ════════════════════════════════════════════════
The method '>' was called on null.
Receiver: null
Tried calling: >(1e-10)
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (13) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#1ecab relayoutBoundary=up9 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (14) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#bf879 relayoutBoundary=up8 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (15) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#23d9c relayoutBoundary=up7 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (16) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: _RenderInkFeatures#d5fb8 relayoutBoundary=up6 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (17) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderCustomPaint#c42f6 relayoutBoundary=up5 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (18) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#af491 relayoutBoundary=up4 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (19) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderPadding#82ff0 relayoutBoundary=up3 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Card file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:26:11
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (20) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderSemanticsAnnotations#d9b34 relayoutBoundary=up2 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (21) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#f2c36 relayoutBoundary=up1 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (22) Exception caught by rendering library ════════════════════════════════════════════════
The method '>' was called on null.
Receiver: null
Tried calling: >(1e-10)
User-created ancestor of the error-causing widget was:
Scaffold file:///C:/Users/xxx/dev/flutter_testapp2/lib/movie_detailed_widget.dart:12:12
════════════════════════════════════════════════════════════════════════════════════════════════════
[我认识一个会颤动的人，他们可能会说'哦，这不是很明显，看着错误消息巧妙地表明……”，但是我对颤动非常陌生，这对我来说毫无意义，尤其是为什么这可能会失败
因为我实际上只是将2个小部件放入该列中，并且没有错误消息，所以我只是希望它能工作。我尝试过很多次，改变了一些东西，但是除非它在专栏中，否则它总是有效的。
编辑1：我设法使它不崩溃，使我远离幸福的唯一原因实际上是使事情无法进行的“扩展”。没有它：很好
编辑2：更多的试验和错误。因此，我不能使用弹性。有或没有对齐，它都无法工作。它没有弹性就可以工作，但是随后屏幕溢出。我不知道该怎么办，老实说，我比以前更加困惑。灵活和扩展都不起作用。我做错了
1个回答
0
投票
投票
您需要做的就是用column小部件包裹罪魁祸首flexible。>>
代码：
Card( color: (HSVColor.fromAHSV(1.0, 0.0, 0.0, 0.22)).toColor(), child: Column(children: <Widget>[ Stack( children: <Widget>[ ShaderMask( shaderCallback: (rect) { return LinearGradient( begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [Colors.black, Colors.transparent], ).createShader( Rect.fromLTRB(0, 200, rect.width, rect.height)); }, blendMode: BlendMode.dstIn, child: Image.network('https://placeimg.com/640/480/tech'), ), Align( alignment: FractionalOffset.bottomLeft, child: Padding( padding: EdgeInsets.only(bottom: 10.0), child: Column(children: <Widget>[ RichText( textAlign: TextAlign.left, text: TextSpan( text: 'Dummy Movie' + '\n\n', style: TextStyle(color: Colors.white, fontSize: 25), children: <TextSpan>[], ), ), ]), ), ) ], ), Align( alignment: Alignment.bottomLeft, child: Text( "\n " + '2019' + " " + '2h 30 Min' + "min Directed by: " + 'Anmol Majhail', textAlign: TextAlign.left, style: TextStyle(color: Colors.white70))), Padding( padding: EdgeInsets.all(7.0), ), Row( crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: <Widget>[ Image.network( 'https://placeimg.com/640/480/tech', height: 240, width: 160, alignment: Alignment.topCenter, ), Padding( padding: EdgeInsets.all(4.0), ), ///////////////////////////////////////////////////// Flexible( child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ Align( alignment: Alignment.topLeft, child: Text( 'This is Dummy Description. Just to fill up the space.', style: TextStyle(color: Colors.white), )), RaisedButton( onPressed: () {}, textColor: Colors.white, color: Colors.blue, ) ], ), ), ///////////////////////////////////////////////////// ], ) ]))
最新问题
- 在运行时使用资源编译 VB.NET 项目
- 如何在swift中创建一个处理格式为16的音频文件？
- 使用 jni 从本机代码调用 Java 方法
- std::chrono now() 在 WSL2 下与 Ubuntu 24.04 产生非常显着的偏差
- Windows 上服务/驱动程序 IO 文件的未完成客户端数量
- 将索引数组转换为普通或简单数组
- 按特定顺序映射向量组
- 单独的长/纬度列用于多线串并以颜色绘制
- ASP.NET 2.0 排序时高效的自定义分页
- 如何使用Leaflet将两条独立的路线连接起来？
- Vim“yank”似乎不起作用
- 在 R 中交互式显示航拍照片
- time.time ()
- 使用传单弹出窗口中保留在 HTML 中的图像
- 根据邮政编码创建传单地图
- 从包含坐标/邮政编码和 ID 的 data.frame 中绘制等值线图
- 实体框架Take语句，导致EF生成低效的SQL查询
- 有没有可以在传单地图的线条上添加箭头的包
- 将地图连接在一起
- tmap中有没有设置符号最小尺寸的函数？
© www.soinside.com 2019 - 2024. All rights reserved.