ScrollView Component Reference

Click the Add Component button at the bottom of the Inspector panel and select UI/ScrollView to add the ScrollView component to the node.

To use , please refer to the ScrollView API documentation and the scene of the test-cases-3d project.

The ScrollView event callback will have two parameters, the first one is the ScrollView itself and the second one is the event type of ScrollView.

ScrollBar is optional. You can choose to set either a Horizontal ScrollBar or a Vertical ScrollBar or of course set them both.

To build a connection, you can drag a node with the ScrollBar component in the Hierarchy over to the corresponding field in ScrollView.

The ScrollView component can only work with the specified content node. It calculates location information during scrolling using both the designated scroll direction and the length of the content node in this direction.

The Content node can also set up the auto resize by adding a Widget, or it can arrange the layout of child nodes by adding a Layout, but these two components should not be added to a node at the same time to avoid unintentional consequences.

The view here is used to define a scroll area that can be displayed. As a result, the Mask will normally be added to the view. Contents that can scroll can be put in the content node or added to its child node.

The event callback added by this method is the same as the event callback added by the editor, all added by code. First you need to construct a EventHandler object, and then set the corresponding target, component, handler and customEventData parameters.

By way to add.

import { _decorator, Component, ScrollView } from 'cc';
const { ccclass, property } = _decorator;
@ccclass("example")
export class example extends Component {
    @property(ScrollView)
    scrollview: ScrollView | null = null;
    }
    callback(scrollView: ScrollView) {
        // The callback parameter is the ScrollView component, note that events registered this way cannot pass customEventData.
    }
}

Similarly, you can register events such as scrolling, touch-up, scroll-began, etc. The parameters of the callback function for these events are consistent with the parameters of .