Eye-Candy Controls/ru

From Lazarus wiki
Revision as of 14:39, 17 August 2020 by Zoltanleo (talk | contribs) (TECTabCtrl)

English (en) español (es) русский (ru)

Eye Candy Controls (сокращенно ECControls или EC-Controls) - набор визуальных элементов управления, написанных для Lazarus. Их дизайн основан на Themes, поэтому они выглядят очень нативными везде, независимо от того, какой виджет вы используете.

Каждый релиз аннонсируется на форуме Lazarus в разделе Third Party Announcements(Сторонние объявления).

Всегда есть прикрепленные файлы README.txt (список всех известных проблем) и CHANGELOG.txt (список всех изменений из предыдущего выпуска).

Лицензия

GNU Lesser General Public License 2.0 с исключением ссылок (a.k.a. Модифицированный LGPL). Каждый файл EC-Controls содержит заголовок лицензии. Кроме того, файлы COPYING.modifiedLGPL.txt и COPYING.LGPL.txt связаны с каждым архивом.

Авторство

Все компоненты написаны Blaazen. Уведомление об авторском праве и настоящее имя упоминаются в заголовке каждого блока. Вы можете связаться с автором на форуме Lazarus (псевдоним: Blaazen) в любой теме о EC-Controls (email author). Если вы авторизованы на форуме, вы можете получить адрес автора электронной почты или отправить ему личное сообщение.

Credits: Выравнивание составных компонентов (TECSpinEdit, TECSpinPosition, TECEditBtn, TECColorBtn, TECComboBtn, TECColorCombo) основано на идее Flávio, опубликованной в списке рассылки [1]

Класс TBaseScrollControl основан на TScrollingControl от Theo.

Загрузка
  • Последний релиз: 0.9.44 на 1 июня 2020 (включая demo); UltraShare не работает. Этот выпуск был протестирован с Lazarus 2.1
  • Предыдущий релиз: 0.9.30 на 1 марта 2018 (включая demo); UltraShare не работает. Этот выпуск был протестирован с Lazarus 1.9 и 1.8
  • Предыдущий релиз: 0.9.24.6 на 24 октября 2017 (без demo); TECGrid - Release candidate; UltraShare не работает.
  • Предыдущий релиз: 0.9.20 на 31 июля 2017 (без demo)
  • Предыдущий релиз: 0.9.6 на 24 мая 2016 (включая demo)
  • SourceForge: https://sourceforge.net/projects/eccontrols/
  • UltraShare: http://ultrashare.net/hosting/fl/8c275ee97f (прямая ссылка на 0.9.6, выпущенный 24.05.2016; включая demo)
  • UltraShare: http://ultrashare.net/hosting/fl/a8838060fb (прямая ссылка на 0.9.4.16, выпущенный 9.04.2016; без demos)
  • UltraShare: http://ultrashare.net/hosting/fl/f523032cb4 (прямая ссылка на 0.9.4.14, выпущенный 6.04.2016; без demo)

UltraShare - альтернатива, потому что SourceForge заблокирован в некоторых странах. О новых выпусках всегда объявляется в разделе Third Party на форуме Lazarus.

Установка в Lazarus

Открываем меню Package => Open package File (*.lpk) ... и выбираем файл eccontrols.lpk. Щелкаем Compile (ждем, пока закончится компиляция), затем выбираем Use >> Install. Lazarus спросит "Do you want to rebuild Lazarus now?"(Хотите пересобрать Lazarus сейчас?). Жмем Yes, чтобы установить пакет.

Компоненты

EC-Controls устанавливаются на вкладку EC-C палитры компонентов Lazarus.

ecpalette2.png

Новые изображения (начиная с версии 0.9.24.6). Файлы ресурсов (* .lrs) также содержат изображения _150 и _200 для настольных компьютеров с высоким разрешением.

eccpalette4.png

Компоненты ниже перечислены в порядке их появления на палитре компонентов. Все скриншоты взяты из KDE4 или Plasma5 (Lazarus + Qt).

Визуальные

TECBevel

Альтернатива TBevel.

tecbevel.png

TECBevel может рисовать непрямоугольные формы или непрямые линии.

TECLink

TECLink предоставляет веб-ссылку. Эти же ссылки хорошо известны из веб-браузеров.

teclink.png

Метка, которая меняет свой вид при наведении на нее курсора мыши (по умолчанию становится подчеркнутой и синей).

Она может открывать URL-адрес в браузере по умолчанию, почтовом клиенте по умолчанию, файл в связанном приложении или просто запускать событие OnClick.

TECImageMenu

Вертикальное меню с изображениями. Подобный компонент часто используется в приложениях KDE4 и Outlook97.

tecimagemenu.png

TECImageMenu может находиться в фокусе, и к нему можно перейти с помощью клавиши Tab (когда TabStop = True, что по умолчанию). Может управляться мышью, клавиатурой или кодом.

Мышь
  • Щелчок левой кнопкой мыши по пункту меню эквивалентен нажатию по нему.
  • Щелчок средней или правой кнопкой мыши выбирает элемент, но не нажимает его.
  • Колесико мыши перемещает выделение и не нажимает его.

Клавиатура

  • Пробел и Enter: нажимает выбранный пункт меню.
  • Arrow Up, Arrow Down, Page Up, Page Down, Home и End: перемещают выделение, но не нажимают на пункт меню.
  • Быстрые клавиши (Alt + Key) выбирают и нажимают соответствующий пункт (нет необходимости фокусировать меню) ..

TECSpinBtns

Продвинутая альтернатива TUpDown.

tecspinbtns.png

TECSpinBtns основан на переменных двойной точности.

TECSpinBtns не имеет фокуса. Управляется мышью или кодом.

Мышь

TECSpinBtns состоит из 9 маленьких кнопок.

  • Щелчок левой кнопкой мыши(ЛКМ) на BtnMin, BtnBigDec, BtnDec, BtnMiddle, BtnMenu, BtnInc, BtnBigInc и BtnMax задает Value к Min, уменьшает Value на величину PageSize, уменьшает Value на величину Increment, задает Value к Middle, запускает событие OnMenuClick, увеличивает Value на величину Increment, увеличивает Value на величину PageSize и задает Value к Max соответственно.
  • Щелчок средней кнопкой мыши(СКМ) задает Value к Middle или запускает событие OnMenuClick - зависит от свойства MenuControl. Для перетаскивания также могут быть использованы другие кнопки мыши, зависит от свойства DragControl. Перетаскивание в основном зависит от свойств: DragOrientation, MouseIncrementX, MouseIncrementY, MouseStepPixelsX, MouseStepPixelsY и Reversed.
Программно

Просто присвоив любое значение с плавающей запятой свойству Value:

Value := 10.5;

If the value is out of range (lesser than Min or greater than Max) then Value will be Min or Max. Если значение выходит за пределы диапазона (меньше Min или больше Max), тогда Value будет равно Min или Max.

Приоритет отрисовки:

  1. Наивысший приоритет имеет событие OnDrawGlyph.
  2. Второй - Caption. Он должен быть коротким (один или два символа).
  3. Третий - изображение из Images. Изображения должны быть присвоены, а ImageIndex должен быть больше или равен нулю, и меньше, чем Images.Count
  4. Если OnDrawGlyph не назначен, Caption является пустой строкой, а ImageIndex равен -1, тогда используется встроенный глиф. Есть пять наборов стилей, их можно выбрать с помощью свойства GlyphStyle.

TECSpinEdit

Продвинутая альтернатива TSpinEdit и TFloatSpinEdit. Это TEdit, соединенный с TECSpinBtns.

tecspinedit.png

TECSpinEdit может иметь фокус, и к нему можно перейти с помощью клавиши Tab (когда TabStop = True, что по умолчанию). Может управляться мышью, клавиатурой или кодом.

Мышь

См. TECSpinBtns.

Клавиатура

(строка редактирования должна быть в фокусе)

Текстовое значение можно ввести непосредственно в строку редактирования. Если введенное значение меньше TECSpinBtnsPlus.MinInEdit или больше TECSpinBtnsPlus.MaxInEdit, тогда значение будет изменено, чтобы соответствовать этим границам. Изменение значения выполняется в событии OnEditingDone.

  • Arrow Up/Down "щелкают" по BtnInc/BtnDec*.
  • PgUp/PgDn "щелкают" по BtnBigInc/BtnBigDec*.
  • Ctrl + Home/End "щелкают" по BtnMax/BtnMin*.
  • Ctrl + Space "щелкают" по BtnMiddle.
  • Ctrl + Enter "щелкают" по BtnMenu.

*) справедливо для Reversed = False. Reversed = True делает наоборот.

Программно

Простое присвоение любого значения с плавающей точкой свойству Value:

Value := 10.5;

Если значение выходит за пределы диапазона (меньше Min или больше Max), тогда Value будет соответственно Min или Max.

TECSwitch

Альтернатива TCheckBox. Аналогичный компонент существует в GTk3.

tecswitch.png

TECSwitch может иметь фокус, и к нему можно перейти с помощью клавиши Tab (когда TabStop = True, что по умолчанию). Может управляться мышью, клавиатурой или кодом.

Мышь
  • Щелчок левой кнопкой мыши(ЛКМ) на области переключателя (вне кнопки) изменит State*.
  • Щелчок левой кнопкой мыши(ЛКМ) и удержание ее нажатой на кнопке захватит курсор мыши, и кнопку можно будет перемещать, даже если курсор мыши покинет область переключателя.
Клавиатура
  • Пробел или Enter изменяют State* (только если переключатель в фокусе).
  • Быстрые клавиши (Alt + Key) изменяют State* (нет необходимости перемещать фокус на переключатель).
Программно

Простое присвоение любого значения свойствам State* или Checked:

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

*) Свойство State всегда изменяет значение от checked к unchecked, от grayed к unchecked или от unchecked к checked.

TECSpeedBtn

Кнопка с некоторыми расширенными функциями и встроенными глифами. Альтернатива TSpeedButton и TToggleBox.

tecspeedbtn.png

TECSpeedBtn не имеет фокуса.

Особенности и отличия от TSpeedButton:

  • TSpeedButton имеет свойство Glyph: TBitmap. TECSpeedBtn вместо этого имеет свойства ImageIndex: Integer и Images: TImageList.
  • TECSpeedBtn имеет свойство Delay и встроенный таймер. Поэтому она может работать как кнопка задержки (Delay>0) или как переключатель (Delay<0).
  • TECSpeedBtn имеет более 80 встроенных глифов (нарисованных с помощью помощника TCanvas). Глифы могут быть разными для состояния checked и unchecked.
  • Подобно TSpeedButton, TECSpeedBtn имеет свойства GroupIndex, Checked и AllowAllUp, поэтому кнопки можно сгруппировать в радиогруппу.
  • TECSpeedBtn не может получать фокус, но может быть нажата быстрой клавишей (Alt + [подчеркнутая клавиша]).
  • TECSpeedBtn также может быть связана с TAction.

Приоритеты отрисовки:

  1. Наивысший приоритет имеет событие OnDrawGlyph.
  2. Второй - Caption и изображение из Images. Изображения должны быть присвоены, и хотя бы одно из ImageIndex и ImageIndexChecked должно быть больше или равно нулю и меньше, чем Images.Count.
  3. Когда событие OnDrawGlyph не назначено и оба свойства ImageIndex и ImageIndexChecked имеют значение -1, то используется встроенный глиф (свойства GlyphDesign и GlyphDesignChecked). Если ImageIndex корректен, Image и ImageIndexChecked имеет значение -1 или только GlyphDesign является некоторым глифом, а GlyphDesignChecked имеет значение egdNone, то ImageIndex или GlyphDesign также используются для состояния проверки (и наоборот).

TECBitBtn

То же, что и TECSpeedBtn, но производное от TCustomControl, поэтому может иметь фокус. Альтернатива TBitBtn и TToggleBox.

tecbitbtn.png

TECEditBtn

Альтернатива TEditButton. Это TEdit, объединенное с TECSpeedBtn.

teceditbtn.png

TECColorBtn

Визуальный компонент для выбора цвета. При редактировании строки отображается цветовой код в различных форматах, а соответствующая кнопка запускает диалог выбора цвета.

teccolorbtn.png

Цвет глифа на кнопке соответствует цвету в строке редактирования.

Свойство Text не является публикуемым (прим.перев: не видно в редакторе свойств). Если текст изменен с помощью кода, необходимо вызвать EditingDone для подтверждения изменения.

TECComboBtn

Поле со списком совмещенный с кнопкой. Это TComboBox, соединенный с TECSpeedBtn.

teccombobtn.png

TECColorCombo

Визуальный компонент для выбора цвета. Поле со списком содержит цвета в различных форматах, а соответствующая кнопка вызывает диалоговое окно цвета.

teccolorcombo.png

Цвет глифа на кнопке соответствует цвету, выбранному в поле со списком.

Свойство Text не является публикуемым (прим.перев.: не видно в редакторе свойств). Если текст изменяется с помощью кода, необходимо вызвать Validate для подтверждения изменения.

TECHeader

Альтернатива THeader.

techeader.png

Основная особенность - возможность выравнивания столбцов по левому и правому краю одновременно. Этот компонент разработан для TECCheckListBox.

TECCheckListBox

Альтернатива TCheckListBox.

tecchecklistbox.png

Может иметь несколько столбцов с возможностью их пометки.

В настоящее время свойство Sorted не поддерживается.

TECSlider

Продвинутая альтернатива TTrackBar.

tecslider.png

TECSlider может иметь фокус, и к нему можно перейти с помощью клавиши Tab (когда TabStop = True, что по умолчанию).

TECSlider основан на переменных с двойной точностью. TECSlider можно управлять с помощью мыши, клавиатуры или кода.

Мышь
  • Щелчок левой кнопкой мыши (ЛКМ) на области Slider (вне ползунка) переместит ползунок на величину PageSize (или меньше, если курсор мыши ближе).
  • Двойной щелчок ЛКМ или щелчок средней кнопкой (колесиком) мыши сразу переместит ползунок в позицию курсора мыши (или к Min/Max значению, если щелчок осуществляется за пределами области канавки и шкалы).
  • Щелчок ЛКМ на ползунке и удержание ее нажатой включит режим удержания мышью, что позволит перемещать ползунок, даже если курсор мыши покинет пределы слайдера.
  • Колесико мыши перемещает ползунок вверх/вниз независимо от свойства Reversed. В случае горизонтального расположения слайдера прокручивание ползунка вверх/вниз будет равносильно перемещению влево/вправо, независимо от свойства Reversed.

Приращение составляет:

  • колесико мыши: Increment*Mouse.WheelScrollLines
  • Ctrl + колесико мыши: Increment.
Клавиатура
  • Пробел: перемещает ползунок в середину канавки слайдера или в ProgressMiddlePos в случае ProgressFromMiddle = True
  • 0-9: перемещает ползунок в положение, которое является целочисленным множителем PageSize (т.е. 0, 10, ..., 90 для PageSize = 10).
  • PgUp: уменьшает Position на величину PageSize
  • PgUp: увеличивает Position на величину PageSize
  • Home: перемещает ползунок к Min
  • End: перемещает ползунок к Max
  • +: увеличивает Position на величину Increment
  • -: уменьшает Position на величину Increment
  • Ctrl + ArrowUp: уменьшает* Position на величину Increment
  • Ctrl + ArrowLeft: уменьшает* Position на величину Increment
  • Ctrl + ArrowDown: увеличивает* Position на величину Increment
  • Ctrl + ArrowRight: увеличивает* Position на величину Increment

*) справедливо для Reversed = False. Если Reversed = True, работает наоборот.

Программно

Это можно сделать, просто присвоив свойству Position любое значение с плавающей точкой:

Position := 10.5; 

Если значение выходит за пределы допустимого диапазона (меньше Min или больше Max), тогда Position будет Min или Max соответственно.

TECProgressBar

Продвинутая альтернатива TProgressBar.

tecprogressbar.png

TECProgressBar основан на переменных с двойной точностью. TECProgressBar не может иметь фокус. Управлять им можно только с помощью кода.

TECPositionBar

Альтернатива TTrackBar или TScrollBar. Подобные компоненты используются в Blender (программа для 3D-графики).

tecpositionbar.png

TECPositionBar не может иметь фокус и базируется на переменных с двойной точностью. TECPositionBar можно контролировать с помощью мыши или кода.

Мышь
  • Щелчок левой кнопкой мыши(ЛКМ) сразу же устанавливает позицию в положение курсора мыши (или в положение Min/Max, если щелчок произведен вне области канавки или шкалы).
  • Щелчок средней кнопкой мыши(СКМ): перемещает позицию полоски прогрессбара в середину канавки или в позицию ProgressMiddlePos в случае ProgressFromMiddle = True
  • Щелчок левой кнопкой мыши(ЛКМ) в конце шкалы и удержание ЛКМ нажатой захватывает курсор мыши, что позволяет изменять позицию шкалы даже если курсор мыши покидает область компонента.
  • Перетаскивание позиции полоски прогрессбара мышью осуществляется на величину MouseDragPixels (нажатие только ЛКМ) или на величину MouseDragPixelsFine (Ctrl + ЛКМ). По умолчанию это значения 1 и 10, т.е. позиция полоски прогрессбара изменится на 1 пиксел, когда курсор мыши переместится на 1 пиксел (или на 10 пикселей в случае перетаскивания с нажатой клавишей Ctrl).
  • Колесико мыши перемещает ползунок вверх/вниз независимо от свойства Reversed. В случае горизонтального расположения слайдера прокрутка вверх/вниз перемещает ползунок влуво/вправо, опять же, независимо от свойства Reversed.

Приращение составляет:

  • Колесико мыши: MouseDragPixels*Mouse.WheelScrollLines
  • Ctrl + колесико мыши: (MouseDragPixels/MouseDragPixelsFine)*Mouse.WheelScrollLines
Программно

Это можно сделать, просто присвоив любое значение с плавающей токой свойству PositionSimply:

Position := 10.5; 

Если значение выходит за пределы допустимого диапазона (меньше Min или больше Max), тогда Position будет Min или Max соответственно.

TECSpinPosition

Альтернатива TTrackBar или TScrollBar. Подобные компоненты используются в Krita (программное обеспечение для 2D-графики).

tecspinposition.png

TECRuler

Продвинутая линейка.

tecruler.png

TECRuler не меет фокуса. Она просто отображает масштаб. По желанию может иметь фиксированный или подвижный указатель.

TECRadioGroup

Альтернатива TRadioGroup.

tecradiogroup.png

TECRadioGroup может иметь фокус,и к ней можно перейти с помощью клавиши Tab (когда TabStop = True, что не по умолчанию). Может управляться мышью, клавиатурой или кодом.

Мышь
  • Щелчок левой кнопкой мыши(ЛКМ) по любому пункту (вне кнопки) изменяет ее свойство Checked на True (или на False, если этот пункт уже имеет значение checked*).
  • Щелчок ЛКМ на TECRadioGroup вне пунктов приводит только к получению компонентом фокуса.
Клавиатура
  • 0: снимает выбор всех пунктов*
  • 1-9: выбирает (или снимает выбор*) пункты 1-9
  • Быстрые клавиши (Alt + Key) изменяют свойство Checked на True или False* (radio group не может иметь фокус).

*) Зависит от того, находится ли egoAllowAllUp в Options.

Клавиатура

Это можно сделать, просто определив любой ItemIndex или свойство Items[].Checked :

ItemIndex := 1; //отмечает второй пункт
Items[1].Checked := False; //снимает выбор со второго пункта, независимо от egoAllowAllUp в Options

TECCheckGroup

Альтернатива TCheckGroup.

teccheckgroup.png

TECCheckGroup может находиться в фокусе, и к ней можно перейти с помощью клавиши Tab (когда TabStop = True, что не по умолчанию). Может управляться мышью, клавиатурой или кодом.

Мышь
  • Щелчок левой кнопкой мыши(ЛКМ) по любому из пунктов (вне кнопки) меняет его свойство Checked на True (или на False, если этот пункт уже был помечен*).
  • Щелчок ЛКМ на TECCheckGroup вне пунктов только переводит фокус на компонент.
Клавиатура
  • 0: снять пометки со всех пунктов*
  • 1-9: пометить (ил снять пометки*) пунктов 1-9
  • Быстрые клавиши (Alt + Key) меняют свойство Checked на True/False* (check group не может иметь фокус).

*) Зависит от того, находится ли egoAllowAllUp в Options.

Программно

Simply by assigning any Checked[] or Items[].Checked property: Это можно сделать, просто присвоив какое-либо значение свойству Checked[] или Items[].Checked:

Checked[1] := True; //пометит второй пункт
Items[1].Checked := False; //снимет пометку со второго пункта, независимого от того, находится ли egoAllowAllUp в Options.

TECTabCtrl

См: TECTabCtrl

TECAccordion

TECAccordion is a side menu, works similarly to TPageControl.

tecaccordion.png

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.png

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

Mouse
  • Left-click on triangle area.
  • Left-click and hold the pointer can drag.
  • Left-click on a mark sets more exact value, for example [0,333..., 0.333..., 0.333...].
  • Mouse wheel can roll the pointer up and down.
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.

tecconfcurve.png

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.

tecscheme.png

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.

tecspincontrollericon.png

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.

tectimericon.png

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.