Recent

Author Topic: [SOLVED] Edit component with Clear icon available?  (Read 1454 times)

wittbo

  • Full Member
  • ***
  • Posts: 150
[SOLVED] Edit component with Clear icon available?
« on: October 28, 2020, 01:15:59 pm »
I often see software or internet pages containing edit fields, which contain a clickable "Clear" icon, that can be used to clear an edit field with a single mouse click (s.b.). Does anyone know, if there is a similiar component available for Lazarus LCL?
« Last Edit: October 29, 2020, 11:27:00 am by wittbo »
-wittbo-
MBAir with MacOS 10.14.6 / Lazarus 2.2.4
MacStudio with MacOS 13.0.1 / Lazarus 2.2.4

wp

  • Hero Member
  • *****
  • Posts: 11853
Re: Edit component with Clear icon available?
« Reply #1 on: October 28, 2020, 01:38:11 pm »
Use the TEditButton on the Misc palette. It contains a button next to the edit (it is not embedded in the edit, though), you can assign a Glyph or an image from an attached imagelist, and you can write the handler of the OnButtonClick event to erase the edit.

Blaazen

  • Hero Member
  • *****
  • Posts: 3237
  • POKE 54296,15
    • Eye-Candy Controls
Re: Edit component with Clear icon available?
« Reply #2 on: October 28, 2020, 02:40:42 pm »
Such component is not impossible. I did a quick test - see screenshot. The background is paintbox:
Code: Pascal  [Select][+][-]
  1. procedure TForm1.PaintBox1Paint(Sender: TObject);
  2. var aRect: TRect;
  3.     aDets: TThemedElementDetails;
  4. begin
  5.   with TPaintBox(Sender) do
  6.     begin
  7.       aRect:=Rect(2, 2, 198, 18);
  8.       Canvas.Brush.Color:=clLime;
  9.       Canvas.FillRect(aRect);
  10.       aRect:=Rect(0, 0, 200, 20);
  11.       aDets:=ThemeServices.GetElementDetails(teEditTextFocused);
  12.       ThemeServices.DrawElement(Canvas.Handle, aDets, aRect)
  13.     end;
  14. end;
and normal TEdit with border bsNone is placed over it. It would be possible to join it into one component.
Lazarus 2.3.0 (rev main-2_3-2863...) FPC 3.3.1 x86_64-linux-qt Chakra, Qt 4.8.7/5.13.2, Plasma 5.17.3
Lazarus 1.8.2 r57369 FPC 3.0.4 i386-win32-win32/win64 Wine 3.21

Try Eye-Candy Controls: https://sourceforge.net/projects/eccontrols/files/

jamie

  • Hero Member
  • *****
  • Posts: 6090
Re: Edit component with Clear icon available?
« Reply #3 on: October 28, 2020, 09:50:57 pm »
I don't know how well supporting the widget is for the mac but  you could place a Tedit on a TPanel and set the border for the TEDIT to none, then on the panel you set the border and place an icon using a timage to the right.
The only true wisdom is knowing you know nothing

Blaazen

  • Hero Member
  • *****
  • Posts: 3237
  • POKE 54296,15
    • Eye-Candy Controls
Re: Edit component with Clear icon available?
« Reply #4 on: October 28, 2020, 10:15:10 pm »
Unfortunately, Themes paints EditText frame in Qt4 only. GTK2 and Qt5 don't paint anything. My idea of themed TEdit would be a component with a very limited usage.
Lazarus 2.3.0 (rev main-2_3-2863...) FPC 3.3.1 x86_64-linux-qt Chakra, Qt 4.8.7/5.13.2, Plasma 5.17.3
Lazarus 1.8.2 r57369 FPC 3.0.4 i386-win32-win32/win64 Wine 3.21

Try Eye-Candy Controls: https://sourceforge.net/projects/eccontrols/files/

wittbo

  • Full Member
  • ***
  • Posts: 150
Re: Edit component with Clear icon available?
« Reply #5 on: October 29, 2020, 11:26:40 am »
Thanks to all for your hints.
@Blaazen:  Since themes are limited to QT4, I discardrd this solution. But, using themes and themesservices was a complete new programming ascpect for me; i never used it before. Very interesting.
@WP: TEditButton works as expected on the Mac, no problems. Simple solution, easy to use.
@jamie: Very good idea, looks nice and also easy to implement. This could become my way.
-wittbo-
MBAir with MacOS 10.14.6 / Lazarus 2.2.4
MacStudio with MacOS 13.0.1 / Lazarus 2.2.4

JuhaManninen

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 4459
  • I like bugs.
Re: Edit component with Clear icon available?
« Reply #6 on: October 29, 2020, 12:57:17 pm »
@WP: TEditButton works as expected on the Mac, no problems. Simple solution, easy to use.
+1
It is used in the FilterEdit controls around Lazarus IDE exactly for clearing the edit field. The icon there is a funnel with red 'x', maybe not useful in your case.
Mostly Lazarus trunk and FPC 3.2 on Manjaro Linux 64-bit.

 

TinyPortal © 2005-2018