Question

当我尝试使用Inkwell时出现以下错误

No Material widget found.
InkWell widgets require a Material widget ancestor.
In material design, ....
The specific widget that could not find a Material ancestor was:
  InkWell

The ancestors of this widget were:
  ...
  Column
  TextOnCanvasWidget
  RepaintBoundary
  IndexedSemantics
  NotificationListener<KeepAliveNotification>
  ...

The relevant error-causing widget was:
  InkWell

我知道我需要使用Material design作为使用墨水瓶的祖先...但是我想我是...

但是，它在跟踪中显示我的祖先树是Column-> TextOnCanvasWidget-> RepaintBoundary ..

我想我很困惑，为什么当我的顶级模块是MaterialApp时，我的祖籍树中没有显示我的材料小部件。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: TextOnCanvasList(),
    );
  }
}

class TextOnCanvasList extends StatelessWidget {
  final List<String> listOfNames = [
    "Matt",
    "John",
    "Bill123456",
    "Doug",
    "Paul",
    "Hanz",
    "Ruby",
    "Karl",
    "WOW123456789",
    "HAL",
    "TODD",
    "MARK",
    "CURT"
  ];
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        reverse: false,
        itemBuilder: (_, int index) =>
            TextOnCanvasWidget(this.listOfNames[index]),
        itemCount: listOfNames.length,
      ),
    );
  }
}

class TextOnCanvasWidget extends StatelessWidget {
  final String name;
  TextOnCanvasWidget(this.name);
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        InkWell(
          onTap: () {
            print("You Tapped: " + this.name);
          },
          child: new CustomPaint(
            size: Size(52, 0),
            foregroundPainter: new TextOnCanvasPainter(this.name),
          ),
        ),
      ],
    );
  }
}

class TextOnCanvasPainter extends CustomPainter {
  final String name;
  TextOnCanvasPainter(this.name);
  static const l0 = 50.0;
  static final l1 = 10.0;
  static final h = 30.0;
  final Path chevron = new Path()
    ..relativeLineTo(l0, 0)
    ..relativeLineTo(l1, h / 2)
    ..relativeLineTo(-l1, h / 2)
    ..relativeLineTo(-l0, 0)
    ..relativeLineTo(l1, -h / 2)
    ..close();
  void paint(Canvas canvas, Size size) {
    Paint fillShape = new Paint()
      ..color = Colors.blue
      ..style = PaintingStyle.fill
      ..strokeWidth = 2.0;
    TextSpan span = new TextSpan(
      style: new TextStyle(color: Colors.red[600]),
      text: this.name,
    );
    TextPainter tp = new TextPainter(
        text: span,
        textAlign: TextAlign.left,
        textDirection: TextDirection.ltr);
    tp.layout(minWidth: 500.0);
    canvas.drawPath(chevron, fillShape);
    tp.paint(canvas, new Offset(l1, h / 8));
    canvas.save();
    canvas.restore();
  }

  @override
  bool shouldRepaint(TextOnCanvasPainter oldDelegate) => true;
}

Answer 1

由于缺少脚手架，导致出现此错误。将SafeArea包裹在Scaffold中，该错误将消失。

在MaterialApp中找不到墨水池

1 个答案: