Class FlipView

Displays a collection, such as a set of photos, one item at a time.

Index

Constructor methods

Properties

Methods

Constructor methods

constructor(element?: HTMLElement, options?: any): FlipView

Creates a new FlipView.

constructor

Parameters

  • element?: HTMLElement optional

    The DOM element that hosts the control.

  • options?: any optional

    An object that contains one or more property/value pairs to apply to the new control. Each property corresponds to one of the control's properties or events. Event names must begin with "on". For example, to provide a handler for the pageselected event, add a property named "onpageselected" and set its value to the event handler.

Returns

FlipView

Properties

public currentPage: number

Gets or sets the index of the currently displayed page.

public element: HTMLElement

Gets the HTML element that hosts this FlipView.

public itemDataSource: IListDataSource

Gets or sets the data source that provides the FlipView with items to display. The FlipView displays one item at a time, on its own page.

public itemSpacing: number

Gets or sets the spacing between each item, in pixels.

public itemTemplate: any

Gets or sets a Template or function that defines the HTML for each item's page.

public orientation: string

Gets or sets the orientation of the FlipView, horizontal or vertical.

Methods

public addEventListener(eventName: string, eventHandler: Function, useCapture?: boolean)

Registers an event handler for the specified event.

Parameters

  • eventName: string

    The name of the event to handle. For a list of events, see the FlipView object page.

  • eventHandler: Function

    The event handler function to associate with the event.

  • useCapture?: boolean optional

    Set to true to register the event handler for the capturing phase; set to false to register the event handler for the bubbling phase.

public count(): Promise

Returns the number of items in the FlipView control's itemDataSource.

Returns

Promise

A Promise that contains the number of items in the list or WinJS.UI.CountResult.unknown if the count is unavailable.

public dispatchEvent(type: string, eventProperties: any): boolean

Raises an event of the specified type and with additional properties.

Parameters

  • type: string

    The type (name) of the event.

  • eventProperties: any

    The set of additional properties to be attached to the event object when the event is raised.

Returns

boolean

true if preventDefault was called on the event, otherwise false.

public dispose()

Releases resources held by this FlipView. Call this method when the FlipView is no longer needed. After calling this method, the FlipView becomes unusable.

public forceLayout()

Forces the FlipView to update its layout. Use this function when making the FlipView visible again after its style.display property had been set to "none".

public next(): boolean

Navigates to the next page.

Returns

boolean

true if the FlipView begins navigating to the next page; false if the FlipView is already at the last item or is in the middle of another navigation animation.

public ondatasourcecountchanged(eventInfo: Event)

Occurs when the datasource count changes.

Parameters

  • eventInfo: Event

    An object that contains information about the event. The detail property of this object contains the following sub-properties: source.

public onpagecompleted(eventInfo: CustomEvent)

Raised when the FlipView flips to a page and its renderer function completes.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: detail.source.

public onpageselected(eventInfo: CustomEvent)

Raised when the FlipView flips to a page.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: detail.source.

public onpagevisibilitychanged(eventInfo: CustomEvent)

Occurs when an item becomes invisible or visible.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: detail.source, detail.visible.

public previous(): boolean

Navigates to the previous item.

Returns

boolean

true if the FlipView begins navigating to the previous page; nfalse if the FlipView is already at the first page or is in the middle of another navigation animation.

public removeEventListener(eventName: string, eventHandler: Function, useCapture?: boolean)

Unregisters an event handler for the specified event.

Parameters

  • eventName: string

    The name of the event.

  • eventHandler: Function

    The event handler function to remove.

  • useCapture?: boolean optional

    Set to true to unregister the event handler for the capturing phase; otherwise, set to false to unregister the event handler for the bubbling phase.

public setCustomAnimations(animations: any)

Sets custom animations for the FlipView to use when navigating between pages.

Parameters

  • animations: any

    An object that contains up to three fields, one for each navigation action: next, previous, and jump. Each of those fields must be a function with this signature: function (outgoingPage, incomingPage) Each function must return a WinJS.Promise that completes once the animations are finished. If a field is null or undefined, the FlipView reverts to its default animation for that action.