Class TKPageSliderController
Extends
TKController
.
A page slider controller adds the ability to browse through a collection of elements, often images, with nice and smooth transitions set up in CSS. Using this controller type, you can easily track when a new page is highlighted or activated. Optionally, you can also set up a series of indicators giving the user an overview of the number of images and arrows to navigate through elements, the connection between the various components being automatically handled behind the scenes for you.
Defined in: PageSliderController.js.
Constructor Attributes | Constructor Name and Description |
---|---|
TKPageSliderController (data)
|
Field Attributes | Field Name and Description |
---|---|
Indicates whether the focused page can get activated.
|
|
Provides the list of directions that the user can navigate out of the list of pages.
|
|
The index of the page currently selected within the collection of pages.
|
|
Indicates whether the pages managed by the controller are navigable with keys.
|
|
Indicates whether navigation of pages is done strictly with paging buttons.
|
|
A CSS selector matching a button to be used as the button to increment the
highlightedPageIndex . |
|
The set of properties used to set up the contents of the optional page indicators.
|
|
A CSS selector matching a button to be used as the button to decrement the
highlightedPageIndex . |
|
The set of properties used to set up the contents of the page slider.
|
- Fields borrowed from class
TKController
: actions
,backButton
,becomesActiveTransition
,becomesInactiveTransition
,id
,navigableElements
,navigatesTo
,outlets
,parentController
,preloads
,scrollableElement
,template
Method Attributes | Method Name and Description |
---|---|
pageWasHighlighted (index)
Triggered as the
highlightedPageIndex property has changed when a new page became focused. |
|
pageWasSelected (index)
Triggered as the focused page was selected by the user, either from clicking on the page or using the play/pause remote key.
|
|
styleForPageAtIndex (index)
This method allows to provide custom style rules for a page programatically any time the
highlightedPageIndex property changes. |
- Methods borrowed from class
TKController
: addNavigableElement
,customMetricsForElement
,elementWasActivated
,elementWasHighlighted
,elementWasHovered
,elementWasUnhighlighted
,elementWasUnhovered
,handleEvent
,isDescendentOfController
,isViewLoaded
,keyWasPressed
,preferredElementToHighlightInDirection
,processView
,removeNavigableElement
,viewDidAppear
,viewDidDisappear
,viewDidLoad
,viewWasInsertedIntoDocument
,viewWillAppear
,viewWillDisappear
,wantsToHandleKey
- Methods borrowed from class
TKObject
: addPropertyObserver
,callMethodNameAfterDelay
,callSuper
,notifyPropertyChange
,removePropertyObserver
Class Detail
TKPageSliderController(data)
- Parameters:
- {Object} data
- A hash of properties to use as this object is initialized.
- Since:
- TuneKit 1.0
Field Detail
{bool}
activatesFocusedPage
Indicates whether the focused page can get activated. Defaults to
true
, setting this to false
plays the limit sound when
the user attempts to activate the focused page.
{Array}
allowedOutwardNavigationDirections
Provides the list of directions that the user can navigate out of the list of pages. By default, this array is empty, meaning that if the
navigatesWithPagingButtonsOnly
property is set to false
and pages can be navigated with arrow keys, then the user will not
be able to move focus out of the pages from either ends. The directions allowed are the TKSpatialNavigationManagerDirection
family
of constants.
{int}
highlightedPageIndex
The index of the page currently selected within the collection of pages.
{bool}
highlightsFocusedPage
Indicates whether the pages managed by the controller are navigable with keys. Defaults to
true
.
{bool}
navigatesWithPagingButtonsOnly
Indicates whether navigation of pages is done strictly with paging buttons. Defaults to
false
, allowing the Apple remote to
be used to navigate between pages.
{String}
nextPageButton
A CSS selector matching a button to be used as the button to increment the
highlightedPageIndex
.
{
TKPageControlData
}
pageControlData
The set of properties used to set up the contents of the optional page indicators.
{String}
previousPageButton
A CSS selector matching a button to be used as the button to decrement the
highlightedPageIndex
.
{
TKSlidingViewData
}
slidingViewData
The set of properties used to set up the contents of the page slider.
Method Detail
pageWasHighlighted(index)
Triggered as the
highlightedPageIndex
property has changed when a new page became focused.
- Parameters:
- {int} index
- The index of the newly focused page
pageWasSelected(index)
Triggered as the focused page was selected by the user, either from clicking on the page or using the play/pause remote key.
- Parameters:
- {int} index
- The index of the activated page
styleForPageAtIndex(index)
This method allows to provide custom style rules for a page programatically any time the
highlightedPageIndex
property changes. The values in this
array are expected to be individual two-value arrays, where the first index holds the CSS property name, and the second index its value.
- Parameters:
- {Array} index
- The index of the page for which we are trying to obtain custom styles.