Draw on Panel's canvas - richedit and image

Hi

thank you.

1. About the color of the Panel changing, I thought that the text written on canvas will have Panel's background color, so when it changes, the text is still visible, and the background changes. So, I thought it would be 'transparent' area.

Also, I need for this to work even if RichEdit is not actual control (I create it in my code) - in this case line: RC.ClientRect; doesn't compile... I guess because

Sorry, I guess I should have explained in more details. I'm creating a component that will draw the Richedit text and image on Panel. And panel should behave correctly on MouseEnter,MouseLeave,Click, on color change... and the content on the Panel should stay visible - I guess this is what you were talking about in "WM_PAINT or the paint-method of the control.", right?

2. And Image is a bit distorted. Do you have a suggestion how to fix this?

Hi,
The image is distorted because I used StretchDraw instead of Draw. If you use Draw, then the image will be painted to the TPanels Canvas without being resized in any aspect... If you want to have the image resized to fit the panel, but still keep the aspect ratio of the image, then you need to do some more calculations before you paint the image. Otherwise, just replace the first StretchDraw line with this one:
"Panel1.Canvas.Draw(10, 10, Image1.Picture.Graphic);"

If you want to paint the text directly to the TPanel, without painting the borders of the RichEdit Control, then you shall remove the line "RichEdit1.PaintTo(Panel1.Canvas, 110, 10);" from my example, which paints the borders of the RichEdit Control. Doing that, you would end up just painting the text onto the TPanel.

The reason why the line with ClientRect doesn't work, is because ClientRect is depending on the width and height of the Control. If you have your control on the form, then It's not likely it has a ClientRect at all. Anyway, I only used ClientRect because it was fast and easy to use, you can replace RichEdit1.ClientRect with Panel1.ClientRect (and then remove the OffsetRect line below) and that would paint the text all over the Panel, instead of just in specific part of the Panel. You could also replace Panel1.ClientRect with any coordinates you want using Rect(left, top, right, bottom);

Also, The reason why the content of the panel is removed, is because we only paint on it when we click the button, and it needs to be repainted whenever something moved over it, or whenever itself moved behind or outside the screen. As you've already figured, this is done by overriding the Paint method, overwriding the messagehandler for the WMPaint message or just connecting to the OnPaint event of the TPanel (you have to make it public before you du that). See my new example for this...

I modified my example a bit, the new code is below. This code is for a Form with one TImage, One TRichEdit and one TPanel. It's not supposed to be pretty code, so you should definetly not use it as a design pattern :D As I said before, it's just a quick and dirty example of how to do things to show the effect you're after.

Anyway, What is the kind of RichEdit you are using, if you aren't using an actual Control?

regards
Hypo

unit Unit1;
 
interface
 
uses
  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
  Dialogs, StdCtrls, ComCtrls, ExtCtrls, RichEdit;
 
type
  // Add this as the first type in your unit to make the Canvas property public for TPanel...
  TPanel = class(ExtCtrls.TPanel)
    protected
     FOnPaint : TNotifyEvent;
     Procedure Paint; Override;
    public
     Property Canvas;
     Property OnPaint : TNotifyEvent read FOnPaint write FOnPaint;
  end;
 
  TForm1 = class(TForm)
    Panel1: TPanel;
    Image1: TImage;
    RichEdit1: TRichEdit;
    procedure FormCreate(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
    procedure Panel1Paint(Sender: TObject);
  end;
 
var
  Form1: TForm1;
 
implementation
 
{$R *.dfm}
 
Function PixelsToTwips(ADC : HDC; APoint : TPoint) : TPoint;
var ppiX, ppiY : Integer;
begin
  ppiX := GetDeviceCaps(ADC, LOGPIXELSX);
  ppiY := GetDeviceCaps(ADC, LOGPIXELSY);
  if (ppiX <> 0) and (ppiY <> 0) then begin
    Result.X := Round(1440 / ppiX * APoint.X);
    Result.Y := Round(1440 / ppiY * APoint.Y);
  end else
    Result := Point(0, 0);
End;
 
Function RectToTwips(ADC : HDC; ARect : TRect) : TRect;
Begin
  Result.TopLeft := PixelsToTwips(ADC, ARect.TopLeft);
  Result.BottomRight := PixelsToTwips(ADC, ARect.BottomRight);
End;
 
 
{ TPanel }
 
procedure TPanel.Paint;
begin
  inherited;
  if Assigned(FOnPaint) then FOnPaint(Self);
end;
 
{ TForm1 }
 
procedure TForm1.FormCreate(Sender: TObject);
begin
  Panel1.OnPaint := Panel1Paint;
  Panel1.Color := Richedit1.Color;
end;
 
procedure TForm1.Panel1Paint(Sender: TObject);
var fmtRange: TFormatRange;
    hDCTarget : HDC;
    aRect : TRect;
begin
  Panel1.Canvas.Draw(10, 10, Image1.Picture.Graphic);
  FillChar(fmtRange, SizeOf(fmtRange), 0);
  with fmtRange do begin
    hDC := Panel1.Canvas.Handle;
    hdcTarget := hDC;
    Panel1.Canvas.Brush.Color := clBtnFace;
    rcPage := RectToTwips(hdc, Panel1.BoundsRect);
    aRect := Panel1.ClientRect;
    rc := RectToTwips(hdc, aRect);
    chrg.cpMin := 0;
    chrg.cpMax := RichEdit1.GetTextLen;
  end;
  Richedit1.Perform(EM_FORMATRANGE, 1, Longint(@fmtRange));
  { Free cached information }
  Richedit1.Perform(EM_FORMATRANGE, 0, 0);
end;

                                              

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:

Thanx, I use TrichEdit because I need to format the text (bold, italic, underline, text color...), but I need to have it displayed on a panel along with TImage, which is also just a 'temp' control.

This is how it should work:

1. prepare and format the text (use TRichEdit since the text is easily formatted); I use local variable TRchEdit for this:

var RC:TRichEdit;
...


2. Read image

var vImage:TImage;

vImage:=TImage.Create(nil) ;
vImage.LoadFromFile();

3. Create a Panel and put image and text on it side by side.


This is how it should work, so I assumed it would be possible to paint RichEdit and Image content to Panel. Because I need to have behavior of Panel and it's content as if this is just one control, Panel control. So, if I 'hover' with a mouse the Panel should change background to visually show what content is being 'clicked' on... if mouse click is done.
This is the reason for non-visible controls, but they are all create and only Panel is put on form.

This is the reason why RichEdit.CLientRect doesn't work, because the control is not on form.

In your last example the RichEdit content is always on white background, even if I change the color of Panel.

I also tried with creating controls, but it doesn't work. I tried just for TRichEdit:

RC:TRichEdit;
begin

var RC:TRichEdit;
begin
  RC:=TrichEdit.Create(nil);
  RC.Width:=100;
  RC.Height:=100;

  RC.SelAttributes.Style := [fsbold];
  RC.SelAttributes.Size := 10;

  RC.Lines.Add('Get more info on product here:);
  RC.Lines.Add('Next line in RichEdit...);
...

But id doesn't compile the line:

chrg.cpMax := RC.GetTextLen;

Great! It works, thanx. It just needs some polishing... when the background of the Panel changes to darker color (clGray) then the text (each characters) get non-smooth edges... I tried to manipulate the bitmap's colors:

   aText.Canvas.Brush.Color := clWhite;
   aText.Canvas.Pen.Color := clWhite;
and
   aText.TransparentColor := clWhite;

 but no luck. Any advise?

Ok, try this :)

  aText.Canvas.Brush.Color := Panel1.Color;
  aText.Canvas.Pen.Color := Panel1.Color;
  ...
  aText.TransparentColor := Panel1.Color;

/Hypo

Oops, you also need to set the RichEdits color, So try this instead...  

  RichEdit1.Color := Panel1.Color;
  aText.Canvas.Brush.Color := Panel1.Color;
  aText.Canvas.Pen.Color := Panel1.Color;
  ...
  aText.TransparentColor := Panel1.Color;

/Hypo