顫振：CustomPainter沒有拾取父級的完整大小

我正在嘗試使用CustomPaint小部件填充所需的大小。我的代碼如下：

@override
  Widget build(BuildContext context) {
    return Scaffold(
//      backgroundColor: Colors.white, //Provider.of<UserData>(context).getSecondryColor(),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Expanded(
            flex: 10,
            child: GestureDetector(
              onTap: () async {
                //Before projects get user profile first
                Profile? _profile = await MyDatabase.db.getProfile();
                if (_profile != null) {
                  Navigator.pushNamed(context, '/mySites');
                } else {
                  bool result = await showProfilePrompt(context);
                  if (result) Navigator.pushNamed(context, '/myProfile');
                }
              },
              child: Stack(
                children: <Widget>[
                  Container(color: Colors.deepOrange,),
                  LayoutBuilder(
                    builder: (context , constraints ) {
                      print (constraints);
                      return CustomPaint(
                          size: Size(constraints.maxWidth, constraints.maxHeight),
                          painter: TriangleDraw(context)
                      );
                    },
                  ),
…

問題是我在除錯控制臺上的約束大小列印為

BoxConstraints(0.0<=w<=411.4, 0.0<=h<=546.4)

但正如你所見，我添加了一個ContainerwithbackgroundColor來可視化完整尺寸。請參閱下面的 Stack 的實際大小：

我的 CustomDraw 很簡單：（我知道它不是三角形）

import 'package:flutter/material.dart';

class TriangleDraw extends CustomPainter {
  late Paint painter;

  TriangleDraw(BuildContext buildContext) {
    painter = Paint()
      ..color = Theme.of(buildContext).colorScheme.primary
      ..style = PaintingStyle.fill;
  }

  @override
  void paint(Canvas canvas, Size size) {
    print('Size: $size');
    var path = Path();

    path.moveTo(0, 0);
    path.lineTo(size.width, 0);
    path.lineTo(size.height, size.width);
    path.lineTo(0, size.width - (size.width/4));
    path.close();

    canvas.drawPath(path, painter);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
}

uj5u.com熱心網友回復：

您在錯誤的地方使用 LayoutBuilder，將其更改為：

Expanded(
            flex: 10,
            child: LayoutBuilder(builder: (context, constraints) {
              return GestureDetector(
                onTap: () async {
                  //Before projects get user profile first
                  Profile? _profile = await MyDatabase.db.getProfile();
                  if (_profile != null) {
                    Navigator.pushNamed(context, '/mySites');
                  } else {
                    bool result = await showProfilePrompt(context);
                    if (result) Navigator.pushNamed(context, '/myProfile');
                  }
                },
                child: Stack(
                  fit: StackFit.expand,
                  children: <Widget>[
                    Container(
                      color: Colors.deepOrange,
                    ),
                    CustomPaint(
                        size: Size(constraints.maxWidth, constraints.maxHeight),
                        painter: TriangleDraw(context)),
                  ],
                ),
              );
            }),
          )

并將您的更改CustomDraw為：

path.moveTo(0, 0);
path.lineTo(size.width, 0);
path.lineTo(size.width, size.height);// <--- change this line
path.lineTo(0, size.width - (size.width / 4));
path.close();

canvas.drawPath(path, painter);

標籤：扑镖颤振布局

上一篇：比較兩個回傳false的相同物件

下一篇：加載程式卡住并且無法導航到下一頁-Flutter