新手求教,2.4.11 版本怎么做那种卡牌翻面的效果,目前找到了一种实现方式,还有别的方式吗。

@property(cc.Node)
card1: cc.Node = null;
@property(cc.Node)
card2: cc.Node = null;

protected onLoad(): void {
    this.card1.is3DNode = true; // 设置为3D节点
}

protected onClickCard(): void {
    this.card2.opacity = 0;
    cc.tween(this.card1)
        .to(0.3, { eulerAngles: cc.v3(0, 90, 0) }, { easing: "quadInOut" })
        .start();
    this.scheduleOnce(() => {
        cc.tween(this.card2)
            .to(0.15, { opacity: 255 }, { easing: "quadInOut" })
            .delay(2)
            .call(() => {
                this.card2.opacity = 0;
                this.card1.eulerAngles = cc.v3(0, 0, 0);
            })
            .start();
    }, 0.25);
}

如果不用这种3d节点的方式怎么实现那种平滑的过渡感

出两张图片,一个是正面,一个是背面,交替显示

转起来那个阶段要怎么实现 俩张图片的过程我是知道

scaleX 1=>0 ,在0=>1

图片1 scaleX 1=>0
图片2 0=>1 这样吗

你这个不是只要翻转一次吗,这个卡牌是一整个组件,那你就可以先把背面的显示(背面比正面的节点层级大),然后在scaleX=0的时候,把背面隐藏起来,然后在scale=>1

好的 大体明白你的意思了 等下实践一下

【包教包会】2D图片实现3D透视效果(支持3.x、支持原生、可合批) 这个写的还不错

1赞

好的 我看了但是他这个好像只适合单张素材图片的情况 正常翻面应该都是有俩张素材的吧 一个盖住的状态 一个翻面的状态 不过这个确实挺有用的

害,我现在就是两个图片用这个写的,你一个弄成90度,一个弄成0度那么转几次就明白了

那个中途更换spriteFrame就行,不过如果你只是做卡牌翻面,我感觉scaleX比3D翻面可能好看一些

ok 好像可以

我这边有demo

我也是觉得3d的不好看 所以才想看看

能分享看看吗

scaleX用这几句话就可以了,
tween(item)
.to(toTime,{scaleX:0})
.call(()=>{
img_bg.visible = false;
})
.to(toTime,{scaleX:1})
.start()