0

您好,谁能告诉我如何在圆形路径内绘制图像,并使用适合路径的缩放图像。我尝试过,但无法弄清楚并打扰了很多。请帮我。

  Paint paint_4 = new Paint()
          ..color = Colors.black
          ..style = PaintingStyle.fill
          ..strokeWidth = 1;
    
        Path path_4 = Path();
        path_4.moveTo(size.width * 0.2275000, size.height * 0.2879286);
        path_4.cubicTo(
            size.width * 0.2528667,
            size.height * 0.2879286,
            size.width * 0.2928750,
            size.height * 0.3193143,
            size.width * 0.2928750,
            size.height * 0.4000000);
        path_4.cubicTo(
            size.width * 0.2928750,
            size.height * 0.4449143,
            size.width * 0.2733667,
            size.height * 0.5120714,
            size.width * 0.2275000,
            size.height * 0.5120714);
        path_4.cubicTo(
            size.width * 0.2013083,
            size.height * 0.5120714,
            size.width * 0.1621250,
            size.height * 0.4786286,
            size.width * 0.1621250,
            size.height * 0.4000000);
        path_4.cubicTo(
            size.width * 0.1621250,
            size.height * 0.3550857,
            size.width * 0.1808750,
            size.height * 0.2879286,
            size.width * 0.2275000,
            size.height * 0.2879286);
        path_4.close();
   

绘制图像和图像的圆形路径需要适当缩放才能可见

如何将资产图像缩放到正确可见或适合的圆形路径
我如何使用 Matrix4 将 ImageShader 缩放到画布


    canvas.drawPath(
                    path_4,
                    Paint()
                      ..shader = ImageShader(images, TileMode.clamp,TileMode.clamp,Matrix4.identity().scaled(0.19, 0.21).storage));

这是我的代码

 class ImagePainters extends StatefulWidget {
          @override
          _ImagePaintersState createState() => _ImagePaintersState();
        }
        
        class _ImagePaintersState extends State<ImagePainters> {
          ui.Image myImage;
        
          Future<ui.Image> _loadAssetImage() async {
            Completer<ui.Image> completer = new Completer<ui.Image();
        
            AssetImage('assets/face.jpg').resolve(new ImageConfiguration()).addListener(
                ImageStreamListener((ImageInfo image, bool synchronousCall) {
              setState(() {
                myImage = image.image;
              });
              ui.Image img;
        
              img = image.image;
              completer.complete(img);
            }));
        
            return completer.future;
          }
        
          @override
          void initState() {
            super.initState();
            _loadAssetImage();
          }
        
        
        
          @override
          Widget build(BuildContext context) {
            return Center(
              child: Container(
                height: MediaQuery.of(context).size.height,
                width: MediaQuery.of(context).size.width,
                child: CustomPaint(
                    size: Size(1000, 1000 * 0.7),
                    painter: FinalPainter(context, myImage)),
              ),
            );
          }
        }
 
    

画布类

                  class FinalPainter extends CustomPainter {
                      final ui.Image images;
                      FinalPainter(BuildContext context, this.images);
                    
                      @override
                      void paint(Canvas canvas, Size size) {
                        
                   Paint paint_4 = new Paint()
                      ..color = Colors.black //Color.fromARGB(255, 255, 255, 255)
                      ..style = PaintingStyle.fill
                      ..strokeWidth = 1;
                
                    Path path_4 = Path();
                    path_4.moveTo(size.width * 0.2275000, size.height * 0.2879286);
                    path_4.cubicTo(
                        size.width * 0.2528667,
                        size.height * 0.2879286,
                        size.width * 0.2928750,
                        size.height * 0.3193143,
                        size.width * 0.2928750,
                        size.height * 0.4000000);
                    path_4.cubicTo(
                        size.width * 0.2928750,
                        size.height * 0.4449143,
                        size.width * 0.2733667,
                        size.height * 0.5120714,
                        size.width * 0.2275000,
                        size.height * 0.5120714);
                    path_4.cubicTo(
                        size.width * 0.2013083,
                        size.height * 0.5120714,
                        size.width * 0.1621250,
                        size.height * 0.4786286,
                        size.width * 0.1621250,
                        size.height * 0.4000000);
                    path_4.cubicTo(
                        size.width * 0.1621250,
                        size.height * 0.3550857,
                        size.width * 0.1808750,
                        size.height * 0.2879286,
                        size.width * 0.2275000,
                        size.height * 0.2879286);
                    path_4.close();
           
       



图像应该正确可见并且可以缩放 绘制的圆形路径 图像和图像需要正确缩放才能可见
面部应该在圆形路径内清晰可见

    canvas.drawPath(path_4, Paint()..shader = ImageShader(images, 
   TileMode.clamp, TileMode.clamp, 
    Matrix4.identity().scaled(0.19, 0.21).storage));}
       
  @override
 bool shouldRepaint(covariant CustomPainter oldDelegate) {
  {return true;}
}
          

  
4

0 回答 0