如何在Flutter中拥有动态大小的CustomPainter

Question

考虑Flutter文档中的以下代码：

CustomPaint(
painter: Sky(),
child: const Center(
child: Text(
'Once upon a time...',
style: TextStyle(
fontSize: 40.0,
fontWeight: FontWeight.w900,
color: Color(0xFFFFFFFF),
),
),
),
)

我不想要文本小部件。

我不希望CustomPaint小部件被子小部件遮挡。

此外，我希望CustomPaint小部件可以填充任何可用的空间。

我认为解决方案是将Text小部件替换为类似Expanded的BLANK小部件。

但是，我尝试过各种组合的Expanded、Container、Spacer和Space小部件，但总是出现错误或大小为零。

谢谢！

Answer 1

以下是您的操作方法：

Expanded(
child: CustomPaint(
painter: MyCustomPainter(),
size: Size.infinite,
),
),

Answer 2

您可以通过使用MediaQuery获得屏幕的高度和宽度，并使用它们

final width = MediaQuery.of(context).size.width;
final height = MediaQuery.of(context).size.height;
return CustomPaint(
size: Size(width,height),
painter: Sky(),
child: const Center(
child: Text(
'Once upon a time...',
style: TextStyle(
fontSize: 40.0,
fontWeight: FontWeight.w900,
color: Color(0xFFFFFFFF),
),
),
),
);