[开源] 36行代码实现一个ScrollView/PageView嵌套辅助组件

多谢大佬，我现在大概知道怎么回事了，浏览器情况下脚本能正常加载走onLoad，但是模拟器跑的时候脚本不加载，现在不太清楚咋回事，我重开编辑器重命名新建文件挂载脚本也不走onLoad，我再看看具体是因为啥哈

3.x 能用不？

mark!!! +1

import * as cc from ‘cc’;

const { ccclass, property } = cc._decorator;

interface EventTouch extends cc.EventTouch {

sham?: boolean

}

@ccclass

export default class ViewGroupNesting extends cc.Component {

private events: EventTouch[] = [];

onLoad() {

    this.node.on(cc.Node.EventType.TOUCH_START, this.onTouchHandle, this, true);

    this.node.on(cc.Node.EventType.TOUCH_MOVE, this.onTouchHandle, this, true);

    this.node.on(cc.Node.EventType.TOUCH_END, this.onTouchHandle, this, true);

    this.node.on(cc.Node.EventType.TOUCH_CANCEL, this.onTouchHandle, this, true);

}

private onTouchHandle(event: EventTouch) {

    if (event.sham || event.simulate || event.target === this.node) return;

    const cancelEvent: EventTouch = new cc.EventTouch(event.getTouches(), event.bubbles,cc.EventTouch.prototype.type);

    cancelEvent.type = event.type;

    cancelEvent.touch = event.touch;

    cancelEvent.sham = true;

    // 问：这里为啥不直接dispatchEvent

    // 答：必须让ScrollView把真的event先消耗掉，我们再发射假的才可以，

    // 可以去CCNode.js下找一个_doDispatchEvent函数，里面用到了_cachedArray这么个全局变量，

    // 先发射假的话，真的那个数据就被清空了

    this.events.push(cancelEvent);

}

update() {

    if (this.events.length === 0) return;

    for (let index = 0; index < this.events.length; index++) {

        this.node.dispatchEvent(this.events[index]);

    }

    this.events.length = 0;

}

}

楼主好强，已经用上了，谢谢

能用，谢谢楼主
3.x的要稍作修改
import { _decorator, Component, EventTouch, Node } from ‘cc’;

class EventTouchNew extends EventTouch {

// simulate?: boolean

sham?: boolean

}

const { ccclass, property } = _decorator;

@ccclass(‘ViewGroupNesting’)

export default class ViewGroupNesting extends Component {

private events: EventTouch[] = [];

onLoad() {

    this.node.on(Node.EventType.TOUCH_START, this.onTouchHandle, this, true);

    this.node.on(Node.EventType.TOUCH_MOVE, this.onTouchHandle, this, true);

    this.node.on(Node.EventType.TOUCH_END, this.onTouchHandle, this, true);

    this.node.on(Node.EventType.TOUCH_CANCEL, this.onTouchHandle, this, true);

}

private onTouchHandle(event: EventTouchNew) {

    if (event.sham || event.simulate || event.target === this.node) return;

    let cancelEvent: EventTouchNew = new EventTouchNew(event.getTouches(), event.bubbles, event.getType());

    cancelEvent.type = event.type;

    cancelEvent.touch = event.touch;

    cancelEvent.sham = true;

    this.events.push(cancelEvent);

}

update() {

    if (this.events.length === 0) return;

    for (let index = 0; index < this.events.length; index++) {

        this.node.dispatchEvent(this.events[index]);

    }

    this.events.length = 0;

}

}

你好，这个如何控制外层的Pageview左右移动时，不时同时也可以移动内层的scrollview上下移动？

mark.

mark！

3.8.1版本中使用，只要嵌套的列表中存在“按钮”，“在按钮上拖动，就会报错，且会影响整个游戏不正常”

mark!!!

牛啊 牛啊，用上了

MARK KKKK~~~

Mask！！！

大佬牛逼，膜拜下！！

有个问题哈，怎么判断是哪个组件先接受到creator的Touch相关事件？

膜拜大佬！！！

判断条件还要加个 !event.target.getComponent(ScrollView)

大佬，我发现 不用在update发送事件，直接造出来 CancelEvent 发送到 this.node ( scrollview ) 也是可以的 测试引擎 3.8.4

mark!