Как нарисовать изображение внутри контура Circulr на холсте во Flutter

Здравствуйте, может ли кто-нибудь сказать мне, как я могу нарисовать изображение внутри кругового пути с масштабированным изображением, которое помещается внутри пути. Я пытался, но не мог понять и очень беспокоился. Пожалуйста, помоги мне.

        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();
   



 //Circular Path to draw Image  and Image need to be properly Scaled to be visible
  canvas.drawPath(
            path_4,
            Paint()
              ..shader = ImageShader(images, TileMode.clamp,TileMode.clamp,Matrix4.identity().scaled(0.19, 0.21).storage));
    

[![введите описание изображения здесь][1]][1]

        here Is my Code

   

     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();
           
       



Изображение должно быть правильно видимым и может масштабироваться. Круговой контур для рисования Изображение и изображение должны быть правильно Масштабированы, чтобы быть видимым [![Лицо должно быть четко видно внутри кругового контура][2]][2]

      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;
                  }
            
            }
    
    
          
    


  [1]: https://i.stack.imgur.com/nTGGf.jpg
  [2]: https://i.stack.imgur.com/4lvXI.jpg

0 ответов

Другие вопросы по тегам