PageView Component Reference
Click the Add Component button at the bottom of the Inspector panel and select UI/PageView to add the PageView component to the node.
PageViewIndicator is optional, the component is used to display the number of pages and mark the current page.
The association can be done by dragging a node with a PageViewIndicator component into the Indicator property of the PageView component in the Hierarchy panel.
Property | Function Description |
---|---|
Target | Node with script component |
Component | Script component name |
Handler | Specifies a callback function that will be called when the PageView event occurs |
CustomEventData | The user specifies an arbitrary string as the last parameter of the event callback |
The PageView event callback has two parameters, the first parameter is the PageView itself, the second parameter is the event type of the PageView.
The PageView component must have the specified content node to work. Each child node in content is a separate page, and the size of each page is the size of the PageView node. If the node size is larger than the content size, it may result in an incomplete scroll. Under the PageView component there is a node object, which combines with ScrollThreshold
to determine whether the current sliding distance is such that the page can be turned. The operation effect is divided into two kinds:
- Fast sliding - quickly drag in one direction, automatically slide to the next page. Only slide up to one page at a time.
By way to add.
// Suppose we add event handling callbacks to the onLoad method of a component and perform event handling in the callback function:
import { _decorator, Component, Event, Node, PageView } from 'cc';
const { ccclass, property } = _decorator;
@ccclass("example")
this.pageView.node.on('page-turning', this.callback, this);
}
callback(pageView: PageView){
// The parameter of the callback is the PageView component. Note that events registered this way cannot pass customEventData
}