Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

Tab Control Tutorial

This topic will guide you through the process of creating a simple application illustrating the basic capabilities of the TcxTabControl control.

Place the TcxTabControl onto a form first.

Click the ellipses ‘‘ button corresponding to the Tabs property. A String List Editor dialog will appear. Enter tab captions as displayed in the image below. Click the OK button to close the dialog and save changes.

The result is as follows:

Place a TImageList component onto the form and add four images to it.

Assign the modified TImageList component to the Images property of the TcxTabControl control. Images will be displayed within tabs in their order within the image list collection.

Place TLabel and TEdit controls onto the control’s page. Set the label caption to ‘Selected tab index is:‘. Set the edit control’s text to an empty string. This results in the following look & feel for the tab control.

Write an OnChange event handler as listed below. It will update the edit control’s text when a tab is selected.

Delphi
procedure TForm1.cxTabControl1Change(Sender: TObject);
begin
  Edit1.Text := IntToStr(cxTabControl1.TabIndex);
end;

Run the application. Click tabs to select them. The edit control will display the current page index.