TMlSkinTabset

A tab strip that lays tabs out like a browser's, each with an optional close button and drag-to-reorder support.

Category
Lists & combo boxes
Unit
uMlSkinTabset.pas
Inherits from
TMlSkinCustomTabset → TMlSkinCustomToolbar → TMlSkinCustomPanel → TMlSkinCustomControl

Notes

  • Unlike TMlSkinPageControl it only manages the strip itself, so it is usually paired with a TFrame or a set of panels for the content.
  • CloseButtonVisible shows the close button; clicking it fires OnCloseButtonClick, where you remove the tab and its content.
  • AllowDragTab lets the user drag tabs into a new order.
  • Tab width comes from ButtonWidth, or from the caption when AutoButtonWidth is on, capped by MaxButtonWidth.

Example

From the demo MlSkin.Demo.多页面切换(含关闭按钮 TMlSkinTabset+TFrame).v3.0 (.dfm form file)

object mltbs1: TMlSkinTabset
  Left = 0
  Top = 0
  Width = 750
  Height = 38
  Color = clBlack
  CloseButton.Active = True
  CloseButton.Image = 'MlSkinMini_close_btn'
  CloseButton.Normal = 0
  CloseButton.Hot = 1
  CloseButton.Disable = 0
  CloseButton.Count = 2
  CloseButton.Pressed = 1
  CloseButtonVisible = True
  OnCloseButtonClick = mltbs1CloseButtonClick
  DelayRefresh = True
  Items = <
  ...

Properties 28

NameTypeDefaultDescription
AllowDragTabBooleanFalseLets the user drag tabs into a different order.
AutoButtonWidthBooleanFalseWhether tab width follows the caption length.
CloseButtonTPngPictures—Images for the close button on a tab — normal, hot and pressed frames.
CloseButtonVisibleBooleanFalseWhether the close button appears on the tabs.
CloseButtonOffsetTMlOffset—Offset (X, Y) of the close button.
DelayRefreshBooleanFalseDelays repainting, cutting redraws while a batch of tabs is changed.
TextOffsetTMlBtnItemOffset—Offset (X, Y) of the tab captions.
ItemsTMlSkinToolbarItems—The control's collection of items, editable one by one in the Object Inspector.
ImagesTCustomImageList—The ImageList the icons come from.
ButtonImageTPngPictures—Tab background images — normal, hot and selected frames.
ButtonWidthInteger48Tab width in pixels.
MaxButtonWidthInteger0Maximum tab width in pixels; 0 means unlimited.
ButtonHeightInteger48Tab height in pixels.
SpaceSizeInteger3Gap between tabs in pixels.
MultiLineBooleanFalseWhether tabs wrap to another row when they do not fit.
ScrollSizeInteger15Width of the scrollbar in pixels.
MarginSizeInteger20Padding between the tab strip content and its edges, in pixels.
MarginTextSizeInteger2Gap between a tab's icon and its caption, in pixels.
AlphaByte192Opacity: 0 fully transparent, 255 opaque.
BorderSidesTSides—Which border edges are drawn — any combination of top, bottom, left and right.
BorderColorTColor$00D9CBBABorder color.
BackgroundImageTMlResID—Background image, given as a resource ID or an image file path.
BackgroundFillTypeTMlPngFillTypeftNormalHow the background image is laid out: ftNormal as-is, ftTile tiled, ftAutoStretch auto-stretched, ftCenter centred, ftStretch stretched to fill, ftGradient gradient.
BackgroundOffsetXInteger0Horizontal offset of the background image in pixels.
BackgroundOffsetYInteger0Vertical offset of the background image in pixels.
DoubleBorderBooleanTrueDouble border: draws a second line inside the border.
FontHotTFont—Font used while the mouse is over the control.
FontDownTFont—Font used while the control is pressed.

Events 7

NameTypeDefaultDescription
OnCloseButtonClickTToolbarClickEvent—Fires when a tab's close button is clicked; this is where you remove the tab and its content.
OnPaintCloseButtonTPaintCloseButtonEvent—Fires while the close button is drawn, so you can style it yourself.
OnItemClickTToolbarClickEvent—Fires when an item is clicked.
OnItemDownTToolbarClickEvent—Fires when a tab is pressed.
OnItemFocusChangedTNotifyEvent—Fires when the focused tab changes.
OnDrawItemTMlToolbarItemDrawEnvent—Fires while an item is drawn, so you can style it yourself.
OnButtonWidthChangedTToolbarButtonWidthEvent—Fires after a tab's width changes.
Properties of TMlSkinCustomPanel 1
NameTypeDefaultDescription
ColorTColorclWhiteBackground color of the control; ignored while Transparent is on.
Events of TMlSkinCustomPanel 1
NameTypeDefaultDescription
OnCustomDrawTMlCustomDrawEvent—Custom draw event: paint your own content after the control has drawn itself.
Properties of TMlSkinCustomControl 5
NameTypeDefaultDescription
AboutTMlAboutInfo—A design-time property: double-clicking it in the Object Inspector opens the MLSkin about box with the component version. It has no effect at run time and is not stored in the .dfm.
TransparentBooleanTrueTransparent background: the control skips its own fill and shows the form background (image or color) instead.
ColorTColorclWhiteBackground color of the control; ignored while Transparent is on.
AutoInvalidateBooleanFalseRepaints automatically when the content changes. Turn it on if property changes do not show up.
EraseBackgroundBooleanFalseWhether the background is erased before painting; worth toggling if the control flickers.
Events of TMlSkinCustomControl 4
NameTypeDefaultDescription
OnDPIChangedTMlDPIChangedEvent—Fires when the screen DPI changes, for example when the window moves to a monitor with a different scaling — a good place to re-adjust anything you draw yourself.
OnBackgroundChangingTMlBackgroundEvent—Fires just before the background changes, giving you a chance to adjust what is drawn.
OnBackgroundChangedTMlCustomDrawEvent—Fires after the background has been drawn, so you can paint on top of it.
OnVisibleChangedTNotifyEvent—Fires when the control is shown or hidden.

Only the properties and events MLSkin adds are listed here. Standard VCL properties such as Align, Anchors, Font and OnClick are available too and behave exactly as on the stock controls.

Offline helpA PDF / CHM version is available for offline reading.