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