Sign in Join
Wiki copytemporary

TECTabCtrl: what changed

Revision 1 to 2. Removed lines have a minus sign; added lines have a plus sign.

OldNewLine
11**TECTabCtrl** ![](/wiki-images/b/b4/Tectabctrl.png) is advanced alternative [[TTabControl]]. It allows tab stacking, tabs in multiple rows, top/bottom/left/right orientation, reversed and right-to-left bi-directional mode, dragging tabs to move or fold them and many others.
22
33TECTabCtrl is installed to the (non-default) [[Eye-Candy Controls|EC tab]] on the Lazarus [[Component Palette]].
44
55Image shows tab with close button and arrow-down area.
66
7-<figure>
8-<img src="tab_close_dd.png" title="tab_close_dd.png" />
9-<figcaption>tab_close_dd.png</figcaption>
10-</figure>
7+![](/wiki-images/4/43/Tab_close_dd.png)
118
129TECTabCtrl is part of [[Eye-Candy Controls]] (shortly ECControls or EC-Controls), see [[Eye-Candy Controls]], set of visual controls written for Lazarus. Its design is based on Themes, therefore its look is very native everywhere, no matter what widgetset you use.
1310
1411Each release is announced on Lazarus Forum in section Third Party Announcements.
1512
1613There are always attached files `README.txt` (list of all known issues) and `CHANGELOG.txt` (list of all changes from previous release).
1714
1815License
1916
2017GNU Lesser General Public License 2.0 with linking exception (a.k.a. Modified LGPL). File ectabctrl.pas contains license header. Also, files `COPYING.modifiedLGPL.txt` and `COPYING.LGPL.txt` are bundled to each archive.
2118
2219Author
2320
2421This component is written by Blaazen. Copyright notice and real name is mentioned in the header of the unit. You can contact author on Lazarus Forum (nickname: Blaazen) in any thread about EC-Controls. If you are logged in to forum, you can get author's e-mail or send him private message.
2522
2623Download and Install
2724
2825See [[Eye-Candy Controls|Eye-Candy Controls#Install]]
2926
3027## Options
3128
3229Options (TECTabOption and TECTabCtrlOption) are shortly described (commented) in interface section of the unit `ectabctrl.pas`.
3330
3431## Using the component
3532
3633Mouse
3734
3835- Left-click on a tab activates it.
3936- Left-click on close-icon area closes tab.
4037- Left-click on arrow-down area or right-click anywhere on the tab opens drop-down menu.
4138- Middle-click closes tab (if option etcoMiddleBtnClose is set and tab is closeable).
4239
4340Dragging
4441
4542Dragging is realized by left mouse button or middle mouse button (if option etcoMiddleBtnClose is NOT set).
4643
4744When etcoFoldingPriority is NOT set:
4845
4946- Dragging moves a tab.
5047- Dragging + CTRL key (exactly ssModifier) folds a tab.
5148
5249Setting etcoFoldingPriority causes opposite behaviour.
5350
5451Notes:
5552
5653- etcoFixedPosition: tabs cannot be moved
5754- etoCanBeFolded: tab can be folded into another tab
5855- etoCanFold: tab can fold another tabs
5956
6057Drop down menu
6158
6259Allows:
6360
6461- switching folded tabs
6562- unfolding any or all folded tabs
6663- closing any or all folded tabs
6764- fold tab to any folder tab (includig its own folded tabs)
6865- moving tab
6966- closing respective tab
7067
7168Keyboard
7269
7370- Arrow keys change tab (only when focused).
7471- Arrow keys + CTRL key (exactly ssModifier) move tab (only when focused).
7572- Enter or Space opens drop-down menu of selected tab (only when focused).
7673- Acceleration keys (Alt + Key) change tab (doesn't need to be focused).
7774
7875Note to multi-row tabs: the row with active tab is always placed on the baseline. Therefore, arrow keys Up and Down may sometime look like they work oppositely (assume horizontal position and active tab is NOT at the first row). It is by design.
7976
8077## Code
8178
8279Each tab has two identificators: Index and ID.
8380
8481- ID is unique and never changes during the life of tab
8582- Index is unique but it changes as tabs are moved, folded, unfolded, added or deleted.
8683
8784`function IDToIndex(AID: Integer): Integer;`
8885
8986Returns index of tab AID.
9087
9188`procedure ActivateTab(AIndex: Integer);`
9289
9390Activates tab AIndex. If tab is folded, folder and folded tab are switched.
9491
9592`function AddTab(APosition: TECTabAdding; AActivate: Boolean): TECTab;`
9693
9794Adds a new tab. Must be specified where the tab will be positioned and whether it will be activated.
9895
9996`procedure CloseAllFoldedTabs(AFolder: Integer);`
10097
10198Closes all tabs folded to AFolder.
10299
103100`procedure DeleteTab(AIndex: Integer);`
104101
105102Deletes tab AIndex.
106103
107104`function FindFolderOfTab(AIndex: Integer): Integer;`
108105
109106Returns index of folder which contains tab AIndex. Result is -1 when tab is not folded anywhere.
110107
111108`procedure FoldTab(AIndex, AFolder: Integer);`
112109
113110Folds tab AIndex to folder AFolder.
114111
115112`function IndexOfTabAt(X, Y: Integer): Integer;`
116113
117114Returns index of tab at coordinates X, Y. Result is -1 when there is no tab at X, Y.
118115
119116`function IsTabVisible(AIndex: Integer): Boolean;`
120117
121118Returns True when tab AIndex is visible and is in visible area (i.e. is not scrolled out).
122119
123120`procedure MakeTabAvailable(AIndex: Integer; AActivate: Boolean);`
124121
125122Makes tab AIndex available, i.e. moves tab to visible area (if necessary), switches it with its folder (if necessary) and activates it if AActivate is True.
126123
127124`procedure MoveTab(AFrom, ATo: Integer);`
128125
129126Moves tab to a new position.
130127
131128`procedure UnfoldTab(AID: Integer; AFolder: Integer=-1);`
132129
133130Unfolds tab AID. If its folder is known, caller can specify it. Otherwise, method attempts to find folder itself.
134131
135132## Examples
136133
137134Screenshots are taken from Plasma5. Desktop theme for Examples 1-7 is Plastique, Example 8 is Breeze.
138135
139136Example 1
140137
141138Basic layout.
142139
143-<figure>
144-<img src="top_1row.png" title="top_1row.png" />
145-<figcaption>top_1row.png</figcaption>
146-</figure>
140+![](/wiki-images/4/4d/Top_1row.png)
147141
148142Example 2
149143
150144Tabs are in one row, their size exceeds width of component. Left-right buttons and optional Add button appear.
151145
152-<figure>
153-<img src="top_1row_btns.png" title="top_1row_btns.png" />
154-<figcaption>top_1row_btns.png</figcaption>
155-</figure>
146+![](/wiki-images/4/40/Top_1row_btns.png)
156147
157148Example 3
158149
159150Tabs are in two rows, their size exceeds width of component. Left-right buttons and optional Add button appear.
160151
161-<figure>
162-<img src="top_2row_btns.png" title="top_2row_btns.png" />
163-<figcaption>top_2row_btns.png</figcaption>
164-</figure>
152+![](/wiki-images/f/f6/Top_2row_btns.png)
165153
166154Example 4
167155
168156Component is in reversed mode. Tabs are in three rows, their size exceeds width of component. Left-right buttons and optional Add button appear. Note that buttons are aligned differently when component has one/two/three or more rows.
169157
170-<figure>
171-<img src="top_3row_btns_rev.png" title="top_3row_btns_rev.png" />
172-<figcaption>top_3row_btns_rev.png</figcaption>
173-</figure>
158+![](/wiki-images/a/ab/Top_3row_btns_rev.png)
174159
175160Example 5
176161
177162Tab position is tpLeft. Tabs are in two rows. Close button on each tab is displayed.
178163
179-<figure>
180-<img src="left_2row_close.png" title="left_2row_close.png" />
181-<figcaption>left_2row_close.png</figcaption>
182-</figure>
164+![](/wiki-images/d/d1/Left_2row_close.png)
183165
184166Example 6
185167
186168Tab position is tpBottom. Tabs are in two rows. Close button on each tab is displayed. Drop-down menu is opened (Tab5, Tab12 and Tab13 are folded to Tab1).
187169
188170Close buttons cannot be enabled for the **entire** TECTabCtrl. They can be enabled per each separate tab by adding *etoClosabel* and *etoCloseBtn* to the *Options* property.
189171
190-<figure>
191-<img src="bttm_2row_close_fold.png" title="bttm_2row_close_fold.png" />
192-<figcaption>bttm_2row_close_fold.png</figcaption>
193-</figure>
172+![](/wiki-images/a/af/Bttm_2row_close_fold.png)
194173
195174Example 7
196175
197176Tab position is tpRight. Tabs are in two rows. Close button on each tab is displayed. Drop-down menu is opened (Tab5 is folded to Tab1).
198177
199-<figure>
200-<img src="right_2row_close_fold.png" title="right_2row_close_fold.png" />
201-<figcaption>right_2row_close_fold.png</figcaption>
202-</figure>
178+![](/wiki-images/7/7f/Right_2row_close_fold.png)
203179
204180Example 8
205181
206182Tabs are in two rows. Close button tab is displayed on the active tab only. Tabs are enlarges so they fulfil the width of component. Desktop theme is Breeze.
207183
208-<figure>
209-<img src="top_2row_r2l_breeze_enlarge.png" title="top_2row_r2l_breeze_enlarge.png" />
210-<figcaption>top_2row_r2l_breeze_enlarge.png</figcaption>
211-</figure>
184+![](/wiki-images/1/14/Top_2row_r2l_breeze_enlarge.png)
212185
213186Example 9
214187
215188Tab position is tpLeft but tabs are horizontal and reversed, i.e. from the bottom to the top (options etcoVertTabsHorizontal and etcoReversed). Close button on each tab is displayed.
216189
217-<figure>
218-<img src="left_verthor_rev_close.png" title="left_verthor_rev_close.png" />
219-<figcaption>left_verthor_rev_close.png</figcaption>
220-</figure>
190+![](/wiki-images/2/2c/Left_verthor_rev_close.png)
221191
222192Example 10
223193
224194Add a new tab and set its caption
225195
226196`   ECTabCtrl1.AddTab(etaLast, True);`\
227197`   ECTabCtrl1.Tabs.Items[ECTabCtrl1.Tabs.Count-1].Text:='TabName';`
228198
229199## Issues
230200
231201Component can be visually "ugly" or "incorrect" with some desktop themes or some Style setting. (example: GTk2 and Style = eosThemedPanel). That's because unit Themes does not implement images for tabs and images for button are used instead. Some themes (Oxygen, Breeze) draws button smaller than its rectangle and the remaining area around is used for shiny effect. It may cause design issue.
232202
233203---
234204*From the Free Pascal wiki, page "TECTabCtrl", as it stood on 2018-01-21 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](/wiki-contact).*
235205Category: Components

Back to history