Recent

Author Topic: TEdit with rounded corners.  (Read 9918 times)

simonbosti

  • Newbie
  • Posts: 4
TEdit with rounded corners.
« on: January 20, 2009, 10:05:43 pm »
Hello :)


Is there any way to round TEdit corners ? Normally TEdit is a rectangle. I would change its look. How can I draw TEdit by myself?


Thx in advance,
Simon

felipemdc

  • Administrator
  • Hero Member
  • *
  • Posts: 3538
Re: TEdit with rounded corners.
« Reply #1 on: February 16, 2009, 09:06:22 am »
Is there any way to round TEdit corners ?

No

Quote
Normally TEdit is a rectangle. I would change its look. How can I draw TEdit by myself?

You need to create your own control and implement all necessary features. There are several design options. You can descend from either TCustomControl, TWinControl or TCustomEdit. To have a start about descending from TCustomControl have a look here:

http://wiki.lazarus.freepascal.org/Developing_with_Graphics#Create_a_custom_control_which_draws_itself

This explains how to draw the control. Then you just need to add caret and input support.

edgarrod71

  • Jr. Member
  • **
  • Posts: 68
Re: TEdit with rounded corners.
« Reply #2 on: April 22, 2018, 06:18:57 am »
Yes, it's not like modifying windows messages, but this is an approach.

Even tested in any platform, it works.

Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormShow(Sender: TObject);
  2. var
  3.     i: Integer;
  4.     TC: TCustomEdit;
  5.     aShape: TShape;
  6. begin
  7.   for i:=0 to ComponentCount-1 do begin
  8.       if (Components[i] is TCustomEdit) and
  9.          not (Components[i] is TMemo) then begin
  10.         TC := Components[i] as TCustomEdit;
  11.         aShape := TShape.Create(Self);
  12.         aShape.Parent := Self;
  13.         aShape.SetBounds(TC.Left,TC.Top,TC.Width+4,TC.Height+2);
  14.         TC.BorderStyle:=bsNone;
  15.         TC.SetBounds(TC.Left+4,TC.Top+4,TC.Width-6,TC.Height);
  16.         aShape.Shape:=stRoundRect;
  17.         aShape.Brush.Color:=clWhite;
  18.         aShape.Brush.Style:=bsSolid;
  19.         aShape.Pen.Cosmetic:=True;
  20.         aShape.Pen.Style:=psSolid;
  21.         aShape.Pen.Color:=clGreen;
  22.         aShape.Pen.Width:=1;
  23.       end;
  24.   end;
  25. end;                          

RayoGlauco

  • Full Member
  • ***
  • Posts: 176
  • Beers: 1567
Re: TEdit with rounded corners.
« Reply #3 on: April 22, 2018, 10:21:39 am »
edgarrod71, I like your code. I tested it, and I found a problem, because I like to put some tEdit inside a tPanel and, in this case, the shapes were misplaced. I found a simple solution, changing the line 12 of your code:

Code: Pascal  [Select][+][-]
  1. aShape.Parent := TC.Parent;  // Instead aShape.Parent := Self;
« Last Edit: April 22, 2018, 12:12:23 pm by RayoGlauco »
To err is human, but to really mess things up, you need a computer.

edgarrod71

  • Jr. Member
  • **
  • Posts: 68
Re: TEdit with rounded corners.
« Reply #4 on: April 23, 2018, 07:43:38 am »
hi, Thank you, it's strange, because I put Tedits on a panel and they worked, nevertheless I accept your code, now it looks more clean and failproof. :)

edgarrod71

  • Jr. Member
  • **
  • Posts: 68
Re: TEdit with rounded corners.
« Reply #5 on: April 23, 2018, 08:43:49 am »
A simpler and better code, even on the onCreate event handler.  Tested with different colors on the Edit and the Fonts.

Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormCreate(Sender: TObject);
  2. var i: Integer;
  3.     TC: TCustomEdit;
  4.     aShape: TShape;
  5. begin
  6.   for i:=0 to ComponentCount-1 do begin
  7.       if (Components[i] is TCustomEdit) and
  8.          not (Components[i] is TMemo) then begin
  9.         TC := Components[i] as TCustomEdit;
  10.         TC.AutoSize:=false;
  11.         TC.BorderStyle:=bsNone;
  12.         aShape := TShape.Create(Self);
  13.         aShape.Parent := TC.Parent;
  14.         aShape.SetBounds(TC.Left,TC.Top,TC.Width,TC.Height);
  15.         TC.SetBounds(TC.Left+4,TC.Top+3,TC.Width-10,TC.Height-5);
  16.         aShape.Shape:=stRoundRect;
  17.         aShape.Brush.Color:=TC.Brush.Color;
  18.         aShape.Pen.Color:=clWindowFrame;
  19.       end;
  20.   end;
  21. end;
  22.  

edgarrod71

  • Jr. Member
  • **
  • Posts: 68
Re: TEdit with rounded corners.
« Reply #6 on: February 27, 2023, 04:08:37 am »
I was remembering my old programming times... and now this version uses Helpers... Enjoy! ;)

Activate the switch before the Interface section
Code: Pascal  [Select][+][-]
  1. {$MODESWITCH TYPEHELPERS}
  2.  

Put this on the Interface section
Code: Pascal  [Select][+][-]
  1.   { TCustomEditHelper }
  2.  
  3.   TCustomEditHelper = class helper for TCustomEdit
  4.     procedure HInit;
  5.     procedure HPaint;
  6.   end;

Put this on the Implementation section
Code: Pascal  [Select][+][-]
  1. procedure TCustomEditHelper.HInit;
  2. var
  3.   WC: TWinControl;
  4. begin
  5.   AutoSize := false;
  6.   WC := Self;
  7.   while not (WC is TCustomControl) do
  8.     WC := WC.parent;
  9.   If WC is TPanel then begin
  10.     (WC as TPanel).BevelInner := bvSpace;
  11.     (WC as TPanel).BevelWidth := 5;
  12.   end;
  13.   BorderStyle := bsNone;
  14.   SetBounds(Left + 2, Top + 2, Width - 5, Height - 6);
  15. end;
  16.  
  17. procedure TCustomEditHelper.HPaint;
  18. var
  19.   WC: TWinControl;
  20.   CV: TCanvas;
  21.   R: TRect;
  22. begin
  23.   R := BoundsRect;
  24.   WC := Self;
  25.   while not (WC is TCustomControl) do
  26.     WC := WC.parent;
  27.   CV := (WC as TCustomControl).Canvas;
  28.   CV.Brush := Brush ;
  29.   CV.Pen.Color := clWindowFrame;  //clActiveBorder;
  30.   CV.RoundRect(Left - 2 , Top - 2, R.Right + 3, R.Bottom + 3, 10, 10);
  31.  


Put some TEdit and TMemo on your project, even works when you have TPanel as a container.  Initialize them this way
Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormCreate(Sender: TObject);
  2. begin
  3.   { ... Other Stuff ... }
  4.   Edit1.HInit;
  5.   Memo1.HInit;
  6.   Memo2.HInit;
  7. end;
  8.  
Put inside OnPaint methods for TForm and TPanel.
Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormPaint(Sender: TObject);
  2. begin
  3.   Edit1.HPaint;
  4.   Memo2.HPaint;
  5. end;
  6.  
  7. procedure TForm1.Panel1Paint(Sender: TObject);
  8. begin
  9.   Memo1.HPaint;
  10. end;
  11.  

As I said... Enjoy!

 

TinyPortal © 2005-2018