Fade out transparent image on top of a chart

[jens.mertelmeyer]

TeeChart has a lot of funky stuff. I can place some good-looking text anywhere on my chart using the TAnnotationTool. Have a look:

This is just text on top of the chart

chartTextAnnotation.png (13 KiB) Viewed 9342 times

Now the time has come to place an image on top of the chart. Not even that, I need to show it, and then slowly fade it out. How would one go about this? I'm a bit clueless. Have a look at these two images:

fade1.png (19.74 KiB) Viewed 9325 times

fade2.png (18.53 KiB) Viewed 9327 times

This is what I need it to look like.

My best try (this is how both pictures were made) is to place a VCL form with a slowly decreasing AlphaBlendValue on top of the chart. The drawback of this approach is that I always have to monitor if the coordinates of my "overlay form" match with the screen coordinates of my chart. I'd also need to monitor the chart's form of moving around, getting minimized, all kinds of stuff.

Are there any better ideas? I see I can easily place random components inside my chart . But transparent components don't seem to keep their transparency when put in there.

Many thanks in advance.

[Yeray]

Hello Jens,

What about using a TTimer to change the Transparency of your shape?
Here it is an example with a TRectangleTool:

Code: Select all

uses Series, TeeTools, TeePNGImage;

var myRectTool: TRectangleTool;
    timerUp: Boolean;

procedure TForm1.FormCreate(Sender: TObject);
begin
  Chart1.View3D:=false;

  Chart1.AddSeries(TLineSeries).FillSampleValues();

  myRectTool:=Chart1.Tools.Add(TRectangleTool) as TRectangleTool;
  with myRectTool do
  begin
    Shape.Picture.LoadFromFile('E:\tmp\elephant_transparent.png');
    Shape.Transparency:=0;
    Shape.Left:=100;
    Shape.Top:=100;
    Shape.Width:=200;
    Shape.Height:=200;
    Shape.Pen.Visible:=false;
  end;

  Label1.Caption:='Transparency: 0 %';
end;

procedure TForm1.Button1Click(Sender: TObject);
begin
  timerUp:=myRectTool.Shape.Transparency=0;

  with TTimer.Create(Self) do
  begin
    Interval:=50;
    OnTimer:=MyTimerOnTimer;
    Enabled:=true;
  end;
end;

procedure TForm1.MyTimerOnTimer(Sender: TObject);
begin
  if timerUp then
    myRectTool.Shape.Transparency:=myRectTool.Shape.Transparency+5
  else
    myRectTool.Shape.Transparency:=myRectTool.Shape.Transparency-5;

  Label1.Caption:='Transparency: ' + IntToStr(myRectTool.Shape.Transparency) + ' %';
  Chart1.Draw;

  if (myRectTool.Shape.Transparency=0) or (myRectTool.Shape.Transparency=100) then
    (Sender as TTimer).Enabled:=false;
end;

[jens.mertelmeyer]

That is bloody beautiful!

It never entered my mind the TRectangleTool can be textured. This is exactly what I want. And it looks really good.

By the way: I couldn't get the TeePNGImage-include to work. I found no binary dcu and hat to include some source file. After that, it didn't even work. Stepping through it, I found that it incorrectly read out the PNG headers from the stream and then bailed out with an exception. I now use the default unit of Vcl.Imaging.PngImage for loading a PNG image.

Thanks a ton!

[Yeray]

Hi Jens,

You are welcome!

By the way: I couldn't get the TeePNGImage-include to work. I found no binary dcu and hat to include some source file. After that, it didn't even work. Stepping through it, I found that it incorrectly read out the PNG headers from the stream and then bailed out with an exception. I now use the default unit of Vcl.Imaging.PngImage for loading a PNG image.

I used TeePNGImage because I was using Delphi 7 to test this. However, you should change it for PNGImage unit if you are on Delphi 2009 or later because PNGImage unit shipped with the IDE since then.
Sorry for the confusion generated.