TabControl

Namespace: PP.Ui;

Inheritance Hierarchy

Object

Control

TabControl

Description

The TabControl class implements the TabControl component: a control that includes several items that use the same working space.

Syntax

PP.initClass(PP.Ui.TabControl, PP.Ui.Control, "TabControl");

Constructor

  Constructor name Brief description
TabControl The TabControl constructor creates an instance of the TabControl component.

Properties

  Property name Brief description
AddTabButtonTemplate The AddTabButtonTemplate property determines a tab template on adding it to the panel.
Background The Background property sets background for the component panel. that houses tabs' headings.
BlockUpdateSize The BlockUpdateSize property determines whether locking of component resizing is enabled.
Buttons The Buttons property contains an object with arrays of buttons for each side of the control.
ContentAutoFit The ContentAutoFit property determines autofit of the control contents to the parent element.
DragDropEnabled The DragDropEnabled property determines whether tabs can be moved using the Drag&Drop mechanism.
EnableDelete The EnableDelete property determines whether tabs can be deleted.
EnableDragOutside The EnableDragOutside property determines whether a tab can be dragged out from the control.
EnableDropFromOutside The EnableDropFromOutside property determines whether a tab can be inserted from another control.
EnableEdit The EnableEdit property determines whether tab headers can be edited.
EnableGroupSeparator The EnableGroupSeparator property determines whether there is a separator between groups of tabs.
ImagePath The ImagePath property sets the path to the folder with component images.
IsAddTabButtonVisible The IsAddTabButtonVisible property determines whether a tab for adding new tabs is displayed.
Items The Items property contains an array of control tabs.
MenuAddItems The MenuAddItems property determines the menu for adding tabs.
PaddingLeft The PaddingLeft property determines value of the left padding of control tabs panel.
SelectedIndex The SelectedIndex property sets index of the selected tab.
SelectedItem The SelectedItem property sets, which of the tabs is selected.
SelectOnStartEditing The SelectOnStartEditing property determines whether tab header is selected on double-click.
TabsHeight The TabsHeight property determines height of control tabs.
UseToolBarSwitch The UseToolBarSwitch property determines the same style of tabs as the toolbar has.

Methods

  Method name Brief description
addButton The addButton method adds a button to the TabControl component.
addItem The addItem method adds a tab to the component.
beginUpdate The beginUpdate method disables rerendering of control until the endUpdate method is called.
clear The clear method removes all tabs of a component.
endUpdate The endUpdate method enables rerendering of control and refreshes it.
getActiveItem The getActiveItem method returns the selected control tab.
getContentPanel The getContentPanel method returns the DOM node that stores tabs contents.
getItemByPoint The getItemByPoint method returns control tab by the specified coordinates.
getItemsList The getItemsList method returns the list of tabs in the drop-down component panel.
getLayoutItems The getLayoutItems method returns an array of control tabs.
getPanel The getPanel method returns the panel of control tabs.
getToolBarButtonByTabItem The getToolBarButtonByTabItem method returns a button of control tab toolbar.
getToolBarButtonTemplate The getToolBarButtonTemplate method returns a template of toolbar buttons.
getVisibleTabItemsAtPanel The getVisibleTabItemsAtPanel method returns array of visible tabs of control toolbar.
hideContent The hideContent method hides tabs contents.
insertButton The insertButton inserts a button to the TabControl component.
insertItem The insertItem method inserts a tab to the specified position.
isElementVisible The isElementVisible method returns whether the element is visible.
removeItem The removeItem method removes a tab from the component by its index.
removeItemByIndex The removeItemByIndex method removes a tab by its index.
scrollToItem The scrollToItem method scrolls the tabs panel up to the specified tab.
showContent The showContent method displays tabs contents.

Events

  Event name Brief description
AddButton The AddButton event occurs on adding a button to the tab control.
AddingItemFromMenu The AddingItemFromMenu event occurs on adding a tab from tab adding menu.
AddMenuShowing The AddMenuShowing event occurs on opening the tab adding menu.
AfterAddItem The AfterAddItem event occurs after a new tab is added to the component.
BeforeAddItem The BeforeAddItem event occurs before adding a new tab.
BeforeShowGroupSeparator The BeforeShowGroupSeparator event occurs before showing a separator between groups of tabs.
DropedAfterGroupSeparator The DropedAfterGroupSeparator event occurs after showing a separator between groups of tabs.
ItemDeselected The ItemDeselected event occurs on closing a tab.
ItemMoved The ItemMoved event occurs after moving a tab.
ItemSelected The ItemSelected event occurs on selecting a tab.
SelectableSelected The SelectableSelected event occurs on the mouse click on the element.
TabDeleted The TabDeleted event occurs after deleting a tab.
TabDragIn The TabDragIn event occurs on dragging a tab to the control area.
TabDragOut The TabDragOut event occurs on dragging a tab out of the control area.
TabEdited The TabEdited event occurs after exiting the edit mode.
TabEditing The TabEditing event occurs on switching to edit mode.
TabMenuShowing The TabMenuShowing event occurs on opening the tab menu.
TextEdited The TextEdited event occurs on exiting the edit mode if the header text has been changed.
TextEditing The TextEditing event occurs on exiting the tab header edit mode, even if the header has not been changed.

Properties inherited from the Control class

  Property name Brief description
Anchors The Anchors property determines position of the component placed within container.
Animation The Animation property sets animation parameters for component.
Bottom The Bottom property sets bottom offset on placing the component within the LayoutPanel.
Content The Content property sets the component contents.
ContextMenu The ContextMenu property sets the context menu for the component.
Data The Data property is used to store any custom data.
DataContext The DataContext property contains an object with data.
Enabled The Enabled property sets whether the component is enabled.
Height The Height property determines the component height.
IsResizable The IsResizable property determines whether the component can be resized.
IsRTL The lsRTL property sets right to left text direction.
IsVisible The IsVisible property determines whether the component is displayed.
Left The Left property sets left offset on placing the component within the GridPanel.
Offset The Offset property determines coordinates of root DOM node of a control.
Opacity The Opacity property determines component transparency.
Parent The Parent property determines a parent component of a control.
ParentNode The ParentNode property sets parent DOM node.
ResourceKey The ResourceKey property sets the resource key for the component.
Right The Right property sets right offset on placing the component within the LayoutPanel.
Rotate The Rotate property sets component rotation angle.
ShowToolTip The ShowToolTip property determines whether the tooltip of the component can be displayed.
Style The Style property sets component style.
TabIndex The TabIndex property sets the order of the control element passing inside the container.
Tag The Tag property sets JSON object associated with the component.
ToolTip The ToolTip property determines text of component tooltip.
Top The Top property sets top offset on placing the component within the GridPanel.
Value The Value property sets the value to the component.
Width The Width property sets the component width.

Methods inherited from the Control class

  Method name Brief description
The addClass method adds a CSS class to the component.
addEvent The addEvent method adds an event handler to a DOM node.
addEventHandler The addEventHandler method adds an event handler to a DOM node.
addEvents The addEvents method adds an array of event handlers to a DOM node.
The addStateClass method adds a CSS class to the component and removes the previous CSS class.
addStyleBySelector The addStyleBySelector method creates a block that contains a style with the specified CSS selector.
The addToNode method adds a component to the specified node.
bindEvents The bindEvents method subscribes an element to all available events.
The clearStylesCache method clears cache of component styles.
The getAnchorFlags method returns JSON object that contains settings of the current component's position.
The getClass method returns the current CSS classes of the component.
The getCssStyle method returns style for the specified node.
The getDomNode method returns main DOM node of the component.
The getFocused method determines whether the component is focused.
getFunctionByName The getFunctionByName method returns function by name.
getIsBinded The getIsBinded method returns whether an element is subscribed to all DOM node events.
The hasClass method determines whether the specified CSS class is set for root DOM node of the control.
The hide method hides a control.
The hideToolTip method clears tooltip timeout and hides the tooltip if it is displayed.
The isResingNow method determines whether the component is being resized.
refreshBindingProperty The refreshBindingProperty method refreshes the bound property by name.
refreshItemsStyle The refreshItemsStyle method refreshes CSS styles of child elements.
refreshStyle The refreshStyle method refreshes element CSS styles.
The removeClass method removes CSS class from the component.
The removeEvent method removes event handler from DOM node.
removeEventHandler The removeEventHandler method removes event handler from DOM node.
removeFromDOM The removeFromDOM method removes node from the DOM structure.
The removeStateClasses method removes CSS classes of the component.
The setDraggable method determines whether it is possible to drag component on the HTML page.
The setFocus method sets the component focus.
The setIsHovered method displays the component as on hover.
The setIsPressed method displays the component as if clicked upon.
The setOpacityIE8 method sets component transparency value in Internet Explorer 8.
The setSize method establishes the sizes of the component.
The show method displays a control.
unBindEvents The unBindEvents method unsubscribes an element from all standard events.
The updatePosition method updates size and position when absolute positioning based on the current parameters is used.
The updateSize method updates the component size on changing the size of the container that contains the component.

Events inherited from the Control class

  Event name Brief description
Drag The Drag event occurs on clicking and holding the left mouse button.
DragEnd The DragEnd event occurs when dragging the component finishes.
DragStart The DragStart event occurs when dragging the component starts.
OnContextMenu The OnContextMenu event occurs on calling context menu of the component.
SizeChanged The SizeChanged event occurs after the component is resized.
SizeChanging The SizeChanging event occurs during component resize.

Properties inherited from the class Object

  Property name Brief description
Data The Data property associates a random object with this component.
Id The Id property sets component identifier.
Settings The Settings property sets the component parameters.

Methods inherited from the Control class

  Method name Brief description
clone The clone method creates a copy of object. It is not implemented in PP.Ui.Control.
dispose The dispose method deletes the component.
getTypeName The getTypeName method returns the name of the object type without the namespace, to which it belongs.

See also:

PP.Ui