Difference between revisions of "TPageControl"

From Lazarus wiki
m (Fixed typos)
Line 1: Line 1:
 
{{TPageControl}}
 
{{TPageControl}}
  
'''TPageControl''' [[image:tpagecontrol.png]] is a component that provides a container to hold pages, much like a real-world notebook.  TPageControl is a descendant of [[TWinControl]] and is available under the [[Common Controls tab]] of the [[Component Palette]].
+
[[image:tpagecontrol.png]] '''<tt>TPageControl</tt>''' is a multi-page component that provides a container to hold a variety of controls per page. Much like a real-world notebook, it displays a "tab" per page so that the user can quickly switch between pages. Each page can contain its own selection of controls.
  
Unlike a [[TTabControl]], each tab is connected to its own page.  Pages ([[TTabSheet]]s) from a TPageControl are accessible through its (non published) ''Pages'' [[Property|property]]Right-click on a TPageControl to show its context menu, and use 'Add Page' to create a new page.
+
<tt>TPageControl</tt> is a descendant of [[TWinControl]] and can be found on the [[Common Controls tab]] of the [[Component Palette]]. 
 +
 
 +
Unlike a [[TTabControl]], each tab is connected to its own page.  <tt>TPageControl</tt>'s pages are accessible through its (non published) array-like <tt>Pages</tt> property.   
 +
 
 +
The currently active page is accessible through the <tt>ActivePage</tt> or <tt>ActivePageIndex</tt> properties.
 +
 
 +
The event <tt>OnChange</tt> is fired when the user selects another page. The event <tt>OnChanging</tt> occurs before the active page is changed; it has a parameter <tt>AllowChange</tt> which can be set to false to prevent the change to the new page, for example because data input in the old page is incorrect.
 +
 
 +
== Adding a page ==
 +
In order to add a page to a <tt>TPageControl</tt> right-click on it in design mode to show its context menu, then select ''Add Page''.
 +
 
 +
At runtime you first create a <tt>TabSheet</tt> as usual, then assign the <tt>PageControl</tt> to its <tt>Parent</tt>.
 +
 
 +
<syntaxhighlight lang=Pascal>
 +
procedure TForm1.Button4Click(Sender: TObject);
 +
var
 +
  tab: TTabsheet;
 +
begin
 +
  tab := TTabsheet.Create(Self);
 +
  tab.Caption := 'New page';
 +
  tab.Parent := PageControl1;
 +
end;</syntaxhighlight>
  
 
[[File:component-TPageControl.png]]
 
[[File:component-TPageControl.png]]
  
The current (active) page is accessible through the ''ActivePage'' property.
 
 
==Deleting a Page==
 
==Deleting a Page==
 
There are different ways of "deleting" a page from a tabsheet.
 
There are different ways of "deleting" a page from a tabsheet.
 
All the approaches listed below would cause the target page tab to disappear from the control. Giving the end-user an effect of ''deleting'' a page. Though the page might remain available in the code.
 
All the approaches listed below would cause the target page tab to disappear from the control. Giving the end-user an effect of ''deleting'' a page. Though the page might remain available in the code.
 
===Hide the tab===
 
===Hide the tab===
The code simply hides the tab from TabControl. Meaning the user will not longer be able to select it manually.
+
The following code simply hides the tab from the pagecontrol, meaning that the user will not longer be able to select it manually. However, the page will still be accessible by code at runtime.
 
<source lang="pascal">
 
<source lang="pascal">
 
Tabsheet2.TabVisible := false;
 
Tabsheet2.TabVisible := false;
Line 28: Line 48:
 
TabSheet2:=nil; // this is optional  
 
TabSheet2:=nil; // this is optional  
 
</source>
 
</source>
 +
 +
== Similar controls ==
 +
* [[TTabControl]]: looks similar to <tt>TPageControl</tt>, however, possesses only a single page.
 +
* [[TNotebook]]: contains multiple tabs like the <tt>TPageControl</tt>, but there are no tabs. The user must write code to switch between tabs.
  
 
==See also==
 
==See also==
 
* [[doc:lcl/comctrls/tpagecontrol.html|TPageControl doc]]
 
* [[doc:lcl/comctrls/tpagecontrol.html|TPageControl doc]]
 
* [[doc:lcl/extctrls/multi-pagecontrols.html|Multi-page controls doc]]
 
* [[doc:lcl/extctrls/multi-pagecontrols.html|Multi-page controls doc]]
* [[TNotebook]]
 
  
 
{{LCL Components}}
 
{{LCL Components}}

Revision as of 17:07, 6 February 2021

English (en) suomi (fi) français (fr) русский (ru) 中文(中国大陆)‎ (zh_CN)

tpagecontrol.png TPageControl is a multi-page component that provides a container to hold a variety of controls per page. Much like a real-world notebook, it displays a "tab" per page so that the user can quickly switch between pages. Each page can contain its own selection of controls.

TPageControl is a descendant of TWinControl and can be found on the Common Controls tab of the Component Palette.

Unlike a TTabControl, each tab is connected to its own page. TPageControl's pages are accessible through its (non published) array-like Pages property.

The currently active page is accessible through the ActivePage or ActivePageIndex properties.

The event OnChange is fired when the user selects another page. The event OnChanging occurs before the active page is changed; it has a parameter AllowChange which can be set to false to prevent the change to the new page, for example because data input in the old page is incorrect.

Adding a page

In order to add a page to a TPageControl right-click on it in design mode to show its context menu, then select Add Page.

At runtime you first create a TabSheet as usual, then assign the PageControl to its Parent.

procedure TForm1.Button4Click(Sender: TObject);
var
  tab: TTabsheet;
begin
  tab := TTabsheet.Create(Self);
  tab.Caption := 'New page';
  tab.Parent := PageControl1;
end;

component-TPageControl.png

Deleting a Page

There are different ways of "deleting" a page from a tabsheet. All the approaches listed below would cause the target page tab to disappear from the control. Giving the end-user an effect of deleting a page. Though the page might remain available in the code.

Hide the tab

The following code simply hides the tab from the pagecontrol, meaning that the user will not longer be able to select it manually. However, the page will still be accessible by code at runtime.

Tabsheet2.TabVisible := false;

Changing the Parent

You can change Tab's parent to a different control or even to nil The method is useful when you need to move the sheet from one TabControl to another OR you want to show the page again later OR you just need to keep controls intact.

Tabsheet2.Parent := nil;

Freeing the page

The method can be used when you don't need the control itself anymore (as well as it's children)

TabSheet2.Free;
TabSheet2:=nil; // this is optional

Similar controls

  • TTabControl: looks similar to TPageControl, however, possesses only a single page.
  • TNotebook: contains multiple tabs like the TPageControl, but there are no tabs. The user must write code to switch between tabs.

See also


LCL Components
Component Tab Components
Standard TMainMenu • TPopupMenu • TButton • TLabel • TEdit • TMemo • TToggleBox • TCheckBox • TRadioButton • TListBox • TComboBox • TScrollBar • TGroupBox • TRadioGroup • TCheckGroup • TPanel • TFrame • TActionList
Additional TBitBtn • TSpeedButton • TStaticText • TImage • TShape • TBevel • TPaintBox • TNotebook • TLabeledEdit • TSplitter • TTrayIcon • TControlBar • TFlowPanel • TMaskEdit • TCheckListBox • TScrollBox • TApplicationProperties • TStringGrid • TDrawGrid • TPairSplitter • TColorBox • TColorListBox • TValueListEditor
Common Controls TTrackBar • TProgressBar • TTreeView • TListView • TStatusBar • TToolBar • TCoolBar • TUpDown • TPageControl • TTabControl • THeaderControl • TImageList • TPopupNotifier • TDateTimePicker
Dialogs TOpenDialog • TSaveDialog • TSelectDirectoryDialog • TColorDialog • TFontDialog • TFindDialog • TReplaceDialog • TTaskDialog • TOpenPictureDialog • TSavePictureDialog • TCalendarDialog • TCalculatorDialog • TPrinterSetupDialog • TPrintDialog • TPageSetupDialog
Data Controls TDBNavigator • TDBText • TDBEdit • TDBMemo • TDBImage • TDBListBox • TDBLookupListBox • TDBComboBox • TDBLookupComboBox • TDBCheckBox • TDBRadioGroup • TDBCalendar • TDBGroupBox • TDBGrid • TDBDateTimePicker
Data Access TDataSource • TCSVDataSet • TSdfDataSet • TBufDataset • TFixedFormatDataSet • TDbf • TMemDataset
System TTimer • TIdleTimer • TLazComponentQueue • THTMLHelpDatabase • THTMLBrowserHelpViewer • TAsyncProcess • TProcessUTF8 • TProcess • TSimpleIPCClient • TSimpleIPCServer • TXMLConfig • TEventLog • TServiceManager • TCHMHelpDatabase • TLHelpConnector
Misc TColorButton • TSpinEdit • TFloatSpinEdit • TArrow • TCalendar • TEditButton • TFileNameEdit • TDirectoryEdit • TDateEdit • TTimeEdit • TCalcEdit • TFileListBox • TFilterComboBox • TComboBoxEx • TCheckComboBox • TButtonPanel • TShellTreeView • TShellListView • TXMLPropStorage • TINIPropStorage • TJSONPropStorage • TIDEDialogLayoutStorage • TMRUManager • TStrHolder
LazControls TCheckBoxThemed • TDividerBevel • TExtendedNotebook • TListFilterEdit • TListViewFilterEdit • TLvlGraphControl • TShortPathEdit • TSpinEditEx • TFloatSpinEditEx • TTreeFilterEdit • TExtendedTabControl •
RTTI TTIEdit • TTIComboBox • TTIButton • TTICheckBox • TTILabel • TTIGroupBox • TTIRadioGroup • TTICheckGroup • TTICheckListBox • TTIListBox • TTIMemo • TTICalendar • TTIImage • TTIFloatSpinEdit • TTISpinEdit • TTITrackBar • TTIProgressBar • TTIMaskEdit • TTIColorButton • TMultiPropertyLink • TTIPropertyGrid • TTIGrid
SQLdb TSQLQuery • TSQLTransaction • TSQLScript • TSQLConnector • TMSSQLConnection • TSybaseConnection • TPQConnection • TPQTEventMonitor • TOracleConnection • TODBCConnection • TMySQL40Connection • TMySQL41Connection • TMySQL50Connection • TMySQL51Connection • TMySQL55Connection • TMySQL56Connection • TMySQL57Connection • TSQLite3Connection • TIBConnection • TFBAdmin • TFBEventMonitor • TSQLDBLibraryLoader
Pascal Script TPSScript • TPSScriptDebugger • TPSDllPlugin • TPSImport_Classes • TPSImport_DateUtils • TPSImport_ComObj • TPSImport_DB • TPSImport_Forms • TPSImport_Controls • TPSImport_StdCtrls • TPSCustomPlugin
SynEdit TSynEdit • TSynCompletion • TSynAutoComplete • TSynMacroRecorder • TSynExporterHTML • TSynPluginSyncroEdit • TSynPasSyn • TSynFreePascalSyn • TSynCppSyn • TSynJavaSyn • TSynPerlSyn • TSynHTMLSyn • TSynXMLSyn • TSynLFMSyn • TSynDiffSyn • TSynUNIXShellScriptSyn • TSynCssSyn • TSynPHPSyn • TSynTeXSyn • TSynSQLSyn • TSynPythonSyn • TSynVBSyn • TSynAnySyn • TSynMultiSyn • TSynBatSyn • TSynIniSyn • TSynPoSyn
Chart TChart • TListChartSource • TRandomChartSource • TUserDefinedChartSource • TCalculatedChartSource • TDbChartSource • TChartToolset • TChartAxisTransformations • TChartStyles • TChartLegendPanel • TChartNavScrollBar • TChartNavPanel • TIntervalChartSource • TDateTimeIntervalChartSource • TChartListBox • TChartExtentLink • TChartImageList
IPro TIpFileDataProvider • TIpHtmlDataProvider • TIpHttpDataProvider • TIpHtmlPanel
Virtual Controls TVirtualDrawTree • TVirtualStringTree • TVTHeaderPopupMenu