Canvas 类的clipPath 方法不裁剪指定区域。一个正方形被绘制成蓝色。clipPath 方法应该将它剪辑成一个三角形。它没有发生。告诉。下面是完整的代码和截图。
主要.dart
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Name App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
appBar: AppBar(
title: Text('Name Page'),
),
body: MyHomePage(),
),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
void _f1() {
setState(() {
});
}
@override
Widget build(BuildContext context) {
return Stack(
children: [
Align(
alignment: Alignment.center,
child: CustomPaint(
//верхний слой
foregroundPainter: A(),
//средний слой
child: Container(
width: 300.0,
height: 300.0,
decoration: BoxDecoration(
border: Border.all(
width: 1.0,
color: Colors.pink
),
),
),
),
),
],
);
}
}
class A extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {
//синий цвет, заполнение
final paint = Paint()
..style = PaintingStyle.fill
..color = Colors.blue;
//квадрат
canvas.drawRRect(
RRect.fromRectAndRadius(
Rect.fromLTWH(0, 0, 250, 250),
Radius.circular(0)
),
paint,
);
//область треугольника, которая должна обрезаться
canvas.clipPath(
Path()
..lineTo(0.0, 0.0)
..lineTo(0, size.height - 50)
..lineTo(size.width - 50, size.height - 50)
..close()
);
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
}
}

在Canvas中使用剪切路径与使用模板非常相似:首先覆盖它,然后在模板没有覆盖画布的地方进行绘制。可以有多个轮廓,结果将是它们的交集。
当前剪切路径与变换矩阵一起形成所谓的上下文,可以使用save和restore方法进行保存和恢复。