【发布时间】：2021-08-04 14:26:29
【问题描述】：
我对 Flutter / Dart 还很陌生，所以对我来说很赤裸裸。
我开始学习Flutter，遇到以下情况。根据 main.dart 中的给定值，我想生成图像。
我现在有以下代码：
import 'package:flutter/material.dart';
class FireChar extends StatelessWidget {
// The amount of Characters are going to be created
final double amount;
FireChar({this.amount});
@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
for (var i = 0; i < amount; i++) Row(
children: [
Image.asset(
'assets/images/characters/fire.png',
fit: BoxFit.cover,
height: double.maxFinite
),
],
)
],
),
height: 75,
);
}
}
我认为这应该确实有效。因为当我将Image.asset 更改为文本小部件时，它会完美呈现。但是当我使用上述情况时，我得到一个参考错误：
══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following assertion was thrown during paint():
Rect argument contained a NaN value.
'dart:ui/painting.dart':
Failed assertion: line 40 pos 10: '<optimized out>'
Either the assertion indicates an error in the framework itself, or we should provide substantially
more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
https://github.com/flutter/flutter/issues/new?template=2_bug.md
The relevant error-causing widget was:
Image
file:///Users/*/Documents/Coding/Mobile-Apps/Magic/simulation_game/lib/characters/fire.dart:17:21
When the exception was thrown, this was the stack:
#2 _rectIsValid (dart:ui/painting.dart:40:10)
#3 Canvas.drawImageRect (dart:ui/painting.dart:4283:12)
#4 paintImage (package:flutter/src/painting/decoration_image.dart:575:14)
#5 RenderImage.paint (package:flutter/src/rendering/image.dart:391:5)
#6 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#7 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#8 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#9 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#10 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#11 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#12 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1079:7)
#13 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#14 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#15 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#16 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1089:7)
#17 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#18 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#19 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#20 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#21 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#22 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#23 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1089:7)
#24 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#25 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#26 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#27 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1079:7)
#28 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#29 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#30 RenderShiftedBox.paint (package:flutter/src/rendering/shifted_box.dart:72:15)
#31 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#32 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#33 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#34 RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
#35 RenderStack.paint (package:flutter/src/rendering/stack.dart:639:7)
#36 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#37 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#38 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#39 RenderFlex.paint (package:flutter/src/rendering/flex.dart:1079:7)
#40 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#41 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#42 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2805:15)
#43 RenderCustomMultiChildLayoutBox.paint (package:flutter/src/rendering/custom_layout.dart:412:5)
#44 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#45 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#46 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#47 _RenderInkFeatures.paint (package:flutter/src/material/material.dart:551:11)
#48 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#49 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#50 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#51 PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:396:12)
#52 RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1925:15)
#53 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#54 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#55 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#56 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#57 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:189:13)
#58 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:142:15)
#59 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2322:7)
#60 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:140:11)
#61 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
#62 PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:978:29)
#63 RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:455:19)
#64 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:874:13)
#65 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:319:5)
#66 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
#67 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
#68 SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:865:7)
(elided 6 frames from class _AssertionError, class _RawReceivePortImpl, class _Timer, and dart:async-patch)
The following RenderObject was being processed when the exception was fired: RenderImage#19a83 relayoutBoundary=up10:
creator: RawImage ← Semantics ← Image ← Row ← Column ← ConstrainedBox ← Container ← FireChar ←
Container ← Row ← Expanded ← Row ← ⋯
parentData: <none> (can use size)
constraints: BoxConstraints(unconstrained)
size: Size(1.1984620899082103e+308, 1.7976931348623157e+308)
image: [28×42]
height: 1.7976931348623157e+308
fit: cover
alignment: Alignment.center
invertColors: false
filterQuality: low
This RenderObject has no descendants.
════════════════════════════════════════════════════════════════════════════════════════════════════
Another exception was thrown: Unsupported operation: Infinity or NaN toInt
⢿
Another exception was thrown: A RenderFlex overflowed by Infinity pixels on the bottom.
Another exception was thrown: A RenderFlex overflowed by 1.1984620899082103e+308 pixels on the right.
Another exception was thrown: SemanticsNode#15(Rect.fromLTRB(0.0, 0.0, 0.0, 0.0), invisible) (with null) tried to set a non-finite rect.
Reloaded 2 of 553 libraries in 234ms.
问题：谁能解释一下为什么？
在 Main.dart 中，我这样调用 Widget：
import 'package:flutter/material.dart';
import 'package:simulation_game/characters/fire.dart';
import 'package:simulation_game/maps/battleMap.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'ElementSlam',
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
// Variables
double mapX = 0;
double mapY = 0;
// Game and map settings
String activeMap = 'battle';
// Functions
void restartGame(){}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
Expanded(
child: Container(
child: Stack(
children: [
// Map
BattleMap(
currentMap: activeMap,
),
// Computer - Defense
Padding(
padding: const EdgeInsets.fromLTRB(50, 80, 50, 80),
child: Row(
children: [
Expanded(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.fromLTRB(0, 30, 30, 8),
child: const Text(
'DEFENCE',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontFamily: "Games",
),
),
),
Container(
child: FireChar(
amount: 4,
),
),
],
)
)
],
),
),
// Computer
// Column(
// children: [
// Padding(
// padding: const EdgeInsets.fromLTRB(50, 80, 0, 0),
// child: Container(
// child:
// Text(
// 'DEFENCE',
// textAlign: TextAlign.center,
// style: TextStyle(
// color: Colors.white,
// fontSize: 20,
// fontFamily: "Games",
// ),
// ),
// ),
// ),
// ],
// ),
// Column(
// children: [
// Column(
// children: [
// Container(
// alignment: Alignment(0, 0),
// child: FireChar(),
// ),
// Container(
// alignment: Alignment(0, 0),
// child: ElectricChar(),
// ),
// ]
// ),
// ],
// ),
// VS TEXT
Container(
alignment: Alignment(0,0.05),
child: Text(
'VS',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 80,
fontFamily: "Games",
),
),
),
],
)
)
),
]
)
);
}
}
【问题讨论】：
-
能把
main.dart的代码也发一下吗？ -
同时检查
ListView类而不是在Column中使用for -
@happy_san 添加到描述中
-
尝试将
width: 50添加到您在问题中发布的代码中，并告诉我它是否有效 -
@happy_san - 是的！你是最棒的。这就是解决方案！ :) 非常感谢