首页 > 解决方案 > 我想做一个这样的自定义形状

问题描述

这是一个自定义盒子

我正在尝试制作这样的盒子。如果我按下“产品”按钮,那么我需要显示一个这样的框。但我做不到。我尝试了剪贴路径和自定义绘画。我可以使用可见性小部件来显示和隐藏——这不是问题。问题是我需要显示一个类似于我在此处添加的图片的框。

标签: flutter

解决方案


你可以用CustomPainter. 这是一个例子:

class LinePainter extends CustomPainter {
  final double progress;

  LinePainter({this.progress});

  Paint _paint = Paint()
    ..color = Colors.black
    ..strokeWidth = 4.0
    ..style = PaintingStyle.stroke
    ..strokeJoin = StrokeJoin.round;

  @override
  void paint(Canvas canvas, Size size) {
    var path = Path();
    path.moveTo(0, size.height / 2);
    path.lineTo(size.width * progress, size.height / 2);
    canvas.drawPath(path, _paint);
  }

  @override
  bool shouldRepaint(LinePainter oldDelegate) {
    return oldDelegate.progress != progress;
  }
}

有关更多信息,您可以查看此页面


推荐阅读