Wiki copymirror

This is a mirror of the wiki at pascal.chat. Editing, history and sign-in are there.

Eye-Candy Controls

English · Español · Русский

Eye Candy Controls (shortly ECControls or EC-Controls) are set of visual controls written for Lazarus. Their design is based on Themes, therefore their look is very native everywhere, no matter what widgetset you use.

Each release is announced on Lazarus Forum in section Third Party Announcements.

There are always attached files README.txt (list of all known issues) and CHANGELOG.txt (list of all changes from previous release).

License

GNU Lesser General Public License 2.0 with linking exception (a.k.a. Modified LGPL). Each file of EC-Controls contains license header. Also, files COPYING.modifiedLGPL.txt and COPYING.LGPL.txt are bundled to each archive.

Author

All components are written by Blaazen. Copyright notice and real name are mentioned in the header of each unit. You can contact author on Lazarus Forum (nickname: Blaazen) in any thread about EC-Controls (email author). If you are logged in to the forum, you can get author's e-mail or send him private message.

Credits:

Alignment of composite components (TECSpinEdit, TECSpinPosition, TECEditBtn, TECColorBtn, TECComboBtn, TECColorCombo) is based on idea of Flávio published on mailing list 1

TBaseScrollControl class is based on TScrollingControl by Theo.

Download

UltraShare is alternative because SourceForge is blocked in some countries. New releases are always announced in the Third Party section of the Lazarus Forum.

Install to Lazarus

Open menu Package => Open package File (*.lpk) ... and select file eccontrols.lpk. Click Compile (wait a while) and then Use >> Install. Lazarus will ask you "Do you want to rebuild Lazarus now?". Click Yes to install the package.

Components

EC-Controls are installed to the tab EC-C on the Lazarus component palette.

New images (from version 0.9.24.6). Resource files (*.lrs) also contains _150 and _200 images for Hi-DPI desktops.

Components below are listed in order of their appearance on the component palette. All screenshots are taken from KDE4 or Plasma5 (Lazarus+Qt).

Visual

TECBevel

An alternative to TBevel.

TECBevel can draw non-rectangular shapes or non-straight lines.

TECLink

TECLink provides a weblink. The same links are well known from web-browsers.

A label which changes its look when hovered by mouse (by default becomes underlined and blue).

It can open URL in default browser, default mail client, file in associated application or just trigger OnClick event.

TECImageMenu

A vertical menu with images. Similar component is frequently used in KDE4 applications and Outlook97

TECImageMenu can have focus and can be reached by Tab key (when TabStop = True, which is default). Can be controlled by mouse, by keyboard or by code.

Mouse

Keyboard

TECSpinBtns

An advanced alternative to TUpDown.

TECSpinBtns is based on double precision variables.

TECSpinBtns cannot have focus. Can be controlled by mouse or by code.

Mouse

TECSpinBtns consists from 9 small buttons.

Code

Simply by assigning any floating-point value to property Value:

pascal
Value := 10.5;

If the value is out of range (lesser than Min or greater than Max) then Value will be Min or Max.

Precendence of drawing:

  1. The highest precedence has the OnDrawGlyph event.
  2. The second is Caption. It should be short (one or two characters).
  3. The third is image from Images. Images must be assigned and ImageIndex must be greater or equal to zero and lesser than Images.Count
  4. When the OnDrawGlyph is not assigned, Caption is empty string and ImageIndex is -1 then built-in glyph is used. There is five sets of styles, they can be selected with GlyphStyle property.

TECSpinEdit

An advanced alternative to TSpinEdit and TFloatSpinEdit. It is TEdit joined together with TECSpinBtns.

TECSpinEdit can have focus and can be reached by Tab key (when TabStop = True, which is default). Can be controlled by mouse, by keyboard or by code.

Mouse

See TECSpinBtns.

Keyboard

(line-edit must be focused)

Text value can typed in to the line-edit directly. If entered value is lesser than TECSpinBtnsPlus.MinInEdit or greater than TECSpinBtnsPlus.MaxInEdit then the value will be changed to fit these bounds. Change of Value is done in OnEditingDone event.

*) valid for Reversed = False. For Reversed = True works oppositely.

Code

Simply by assigning any floating-point value to property Value:

pascal
Value := 10.5;

If the value is out of range (lesser than Min or greater than Max) then Value will be Min or Max.

TECSwitch

An alternative to TCheckBox. Similar component exists in GTk3.

TECSwitch can have focus and can be reached by Tab key (when TabStop = True, which is default). Can be controlled by mouse, by keyboard or by code.

Mouse

Keyboard

Code

Simply by assigning any State* or Checked property:

pascal
Checked := True; //False
State := cbChecked; //cbGrayed, cbUnchecked

*) Property State is always changed from checked to unchecked, from grayed to unchecked or from unchecked to checked.

TECSpeedBtn

A button with some advanced features and built-in glyphs. An alternative to TSpeedButton and TToggleBox.

TECSpeedBtn cannot have focus.

Features and differences from TSpeedButton:

Precendence of drawing:

  1. The highest precedence has the OnDrawGlyph event.
  2. The second is Caption and image from Images. Images must be assigned and at least on of ImageIndex and ImageIndexChecked must be greater or equal to zero and lesser than Images.Count.
  3. When the OnDrawGlyph is not assigned and both ImageIndex and ImageIndexChecked are -1 then built-in glyph is used (properties GlyphDesign and GlyphDesignChecked). When ImageIndex is valid Image and ImageIndexChecked is -1 or only GlyphDesign is some glyph and GlyphDesignChecked is egdNone then ImageIndex or GlyphDesign is used for checked state too (and vice versa).

TECBitBtn

The same as TECSpeedBtn but derived from TCustomControl, therefore it can have focus. An alternative to TBitBtn and TToggleBox.

TECEditBtn

An alternative to TEditButton. It is TEdit joined together with TECSpeedBtn.

TECColorBtn

Visual component for selecting color. Line edit displays color code in various formats and associated button triggers color dialog.

Color of the glyph on the button corresponds with the color in the line-edit.

Property Text is not published. If Text is changed via code, EditingDone must be called to validate the change.

TECComboBtn

A combobox with associated button. It is TComboBox joined together with TECSpeedBtn.

TECColorCombo

Visual component for selecting color. Combobox contains colors in various formats and associated button triggers color dialog.

Color of the glyph on the button corresponds with the color selected in the combobox.

Property Text is not published. If Text is changed via code, Validate must be called to validate the change.

TECHeader

An alternative to THeader.

Main feature is ability to have columns aligned to the left and to the right at a time. This components is designed for TECCheckListBox.

TECCheckListBox

An alternative to TCheckListBox.

Can have multiple checkable columns.

Currently, property Sorted is not supported.

TECSlider

An advanced alternative to TTrackBar.

TECSlider can have focus and can be reached by Tab key (when TabStop = True, which is default).

TECSlider is based on double precision variables. TECSlider can be controlled by mouse, by keyboard or by code.

Mouse

The increment is:

Keyboard

*) valid for Reversed = False. When Reversed = True works oppositely.

Code

Simply by assigning any floating-point value to property Position:

pascal
Position := 10.5;

If the value is out of range (lesser than Min or greater than Max) then Position will be Min or Max.

TECProgressBar

An advanced alternative to TProgressBar.

TECProgressBar is based on double precision variables. TECProgressBar cannot have focus. It can be controlled by code only.

TECPositionBar

An alternative to TTrackBar or TScrollBar. Similar components are used in Blender (3D graphics software).

TECPositionBar cannot have focus and is based on double precision variables. TECPositionBar can be controlled by mouse or by code.

Mouse

The increment is:

Code

Simply by assigning any floating-point value to property Position:

pascal
Position := 10.5;

If the value is out of range (lesser than Min or greater than Max) then Position will be Min or Max.

TECSpinPosition

An alternative to TTrackBar or TScrollBar. Similar components are used in Krita (2D graphics software).

TECRuler

An advanced ruler.

TECRuler cannot have focus. It just displays scale. Can have fixed or movable pointer optionally.

TECRadioGroup

An alternative to TRadioGroup.

TECRadioGroup can have focus and can be reached by Tab key (when TabStop = True, which is not default). Can be controlled by mouse, by keyboard or by code.

Mouse

Keyboard

*) Depends whether egoAllowAllUp is in Options.

Code

Simply by assigning any ItemIndex or Items[].Checked property:

pascal
ItemIndex := 1; //selects the second item
Items[1].Checked := False; //deselects the second item, regardless of the egoAllowAllUp in Options

TECCheckGroup

An alternative to TCheckGroup.

TECCheckGroup can have focus and can be reached by Tab key (when TabStop = True, which is not default). Can be controlled by mouse, by keyboard or by code.

Mouse

Keyboard

*) Depends whether egoAllowAllUp is in Options.

Code

Simply by assigning any Checked[] or Items[].Checked property:

pascal
Checked[1] := True; //selects the second item
Items[1].Checked := False; //deselects the second item, regardless of the egoAllowAllUp in Options.

TECTabCtrl

See: TECTabCtrl

TECAccordion

TECAccordion is a side menu, works similarly to TPageControl.

TECAccordion can have focus and can be reached by Tab key (when TabStop = True, which is not default). Can be controlled by mouse, by keyboard or by code.

Mouse

Left-click on any item opens/closes it.

Keyboard

Acceleration key (Alt + Key) changes the item (component doesn't have to be focused).

Code

Simply by setting ItemIndex property.

TECTriangle

A balance of three values. This is not a color picker!

TECTriangle cannot have focus and cannot be reached by Tab key. Can be controlled by mouse only.

Mouse

Code

By calling overloaded SetValues method. Parameters can be 1) X and Y coordinates or 2) "Top" and "Bottom" values (the thirds value "Side" is calculated so the sum of the values is always equal to 1).

TECGrid

See: TECGrid

TECLightView

See: TECLightView

TECConfCurve

Component for Configuration.

User can configure polyline or Bezier curve with multiple points.

Can be aligned with vertical and/or horizontal ruler (TECRuler).

See ECConfCurve-Demo.

TECScheme

An advanced component for configuration of general scheme.

User can add multiple blocks and connect them.

This component is highly configurable. See SchemeDesigner and ECSchemeDesc bundled with EC-Controls.

Non-visual components

TECSpinController

Designed for controlling properties of multiple TECSpinBtns and TECSpinEdit.

TECSpinBtns and TECSpinEdit have properties Controller. When some SpinController is assigned to this property then this Controller can change selected properties of all assigned TECSpinEdits and TECSpinBtns at a time. Adjustable properties are - for example - TimerDelay, TimerRepeat, widths of individual buttons, GlyphsStyle and others.

Project can have multiple SpinControllers.

TECTimer

An advanced timer.

Main feature is that the first interval (property Delay) can differ from all following intervals (property Repeat).

Other parts of EC-Controls

Class TECScale

A scale. It is not a component but can draw itself to any canvas.

This class is used in TECRuler, TECSlider, TECProgressBar, TECPositionBar and TECSpinPosition.

See demo ECScale-Demo.

Unit ECTypes

Base types and classes for Eye Candy Controls (EC-C).

If you use EC-Controls in your project you may need to add this unit to your uses section.

This unit contains many declarations, color-conversion routines and base classes, for example TBaseScrollControl.

TBaseScrollControl

is base class for scrolling components (TECScheme is its descendant).

You can derive your own scrolling component from TBaseScrollControl. TECScheme and TECGrid are based on this class.

Demos

EC-Controls come with several demos. If some of following demos is missing in archive, it may mean that there were no changes and the demo was not included. In that case use the demo from previous release.

ECC-Demo

This demo shows all EC-Controls in various configurations.

ECScale-Demo

This demo shows how you can use TECScale in our own visual component.

ECConfCurve-Demo

This demo shows capabilities of TECConfCurve.

ECSchemeDesc

This demo shows how you can create descendant component from TCustomECScheme.

SchemeDesigner

SchemeDesigner is more than a demo. It shows you how you can create TECScheme configurator in your own application but it can be also used to create your own configurations and store them in *.xml format.

From the Free Pascal wiki, page "Eye-Candy Controls", as it stood on 2023-05-02 after a change by Blaazen, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's Licensing page. If you have concerns about this material, message the admin.

Revision 3, last changed by WikiArchive .