Canvas Load PNG Image at X/Y with Transparency (Opacity)

[andyhill]

  cArea.Brush.Opacity:= 0.10;
  cArea.LoadFromFile('images\FemaleAbdomen.png');
  cArea.Brush.Opacity:= 1;

PNG Image has a Masked out area and it is ignored (painted black) ?

I need to load a PNG Image at a particular Left/Top position overlaying other Canvas Objects with an Opacity of 10% - please advise how - thanks

[andyhill]

Farshad, Please advise how ...

[Sherzod]

On 5/5/2020 at 3:28 AM, andyhill said:

PNG Image has a Masked out area and it is ignored (painted black) ?

Hello,

One of the possible solutions:

procedure TMainForm.UniButton11Click(Sender: TObject);
begin
  UniCanvas1.JSInterface.JSCode('var context='#1'._cc_; var image=new Image();'+
                                'image.onload=function(){'+
                                '    context.drawImage(image, 0, 0, image.width, image.height);'+
                                '}; image.src="yourPNGFile.png";'
  );
end;

 

[andyhill]

Thank You for PNG rendering above, We also need Opacity settings ?

Also, We should be able to have FloodFill as part of any closed drawn object (ClosedPolygon, Circle, Rectangle) so that we do not have to readdress that object with a new Fill command that has anti-aliasing issues.

eg.

canvas.Circle(X, Y, 2, FloodFill=True, Colour);

Drawing circle first, then re-locating center X,Y then FloodFilling is not advantageous for irregular polygon shapes.

Please provide work around for:-

canvas.Polygon(PointArray, FloodFill=True, Colour);

 

 

[Sherzod]

10 hours ago, andyhill said:

We also need Opacity settings ?

procedure TMainForm.UniButton13Click(Sender: TObject);
begin
  UniCanvas1.JSInterface.JSCode('var context='#1'._cc_; var image=new Image();'+
                                'image.onload=function(){'+
                                '    context.globalAlpha = 0.5;'+ //<----- custom opacity
                                '    context.drawImage(image, 0, 0, image.width, image.height);'+
                                '    context.globalAlpha = 1;'+   //<----- opacity = 1
                                '}; image.src="yourPNGFile.png";'
  );
end;

 

[andyhill]

Yes, thank you.

I have moved the polygon discussion to a new thread.