squidGame/tgx-games-client/assets/module_arean/level3/script/RewardCard.ts

import { _decorator, Component, Node, Label, Sprite, tween, Vec3, UIOpacity, SpriteFrame } from 'cc';
import { resLoader } from 'db://assets/core_tgx/base/utils/ResLoader';
import { ModuleDef } from 'db://assets/scripts/ModuleDef';

const { ccclass, property } = _decorator;

@ccclass('RewardCard')
export class RewardCard extends Component {
    @property(Label)
    nameLabel: Label = null!;

    @property(Label)
    descLabel: Label = null!;

    @property(Sprite)
    iconSprite: Sprite = null!;

    @property(Node)
    cardFront: Node = null!;

    @property(Node)
    glowEffect: Node = null!;

    @property(UIOpacity)
    cardOpacity: UIOpacity = null!;

    start() {
        this.playAppearAnimation();
    }

    setCardData(cardData: { name: string, desc: string, icon: string }) {
        if (this.nameLabel) {
            this.nameLabel.string = cardData.name;
        }
        if (this.descLabel) {
            this.descLabel.string = cardData.desc;
        }
        if (this.iconSprite) {
            resLoader.load(ModuleDef.Arean, `common/textures/${cardData.icon}`, (err: Error | null, spriteFrame: SpriteFrame) => {
                if (!err && spriteFrame) {
                    this.iconSprite.spriteFrame = spriteFrame;
                }
            });
        }
    }

    playAppearAnimation() {
        // 卡牌初始状态
        if (this.cardFront) {
            this.cardFront.scale = new Vec3(0.1, 0.1, 0.1);
        }
        if (this.cardOpacity) {
            this.cardOpacity.opacity = 0;
        }
        if (this.glowEffect) {
            this.glowEffect.scale = new Vec3(0.5, 0.5, 0.5);
        }

        // 卡牌出现动画序列
        if (this.cardOpacity) {
            tween(this.cardOpacity)
                .to(0.3, { opacity: 255 })
                .start();
        }

        if (this.cardFront) {
            tween(this.cardFront)
                .to(0.5, { scale: new Vec3(1, 1, 1) }, {
                    easing: 'backOut'
                })
                .call(() => {
                    this.playGlowAnimation();
                })
                .start();
        }

        // 文字渐入效果
        if (this.nameLabel && this.nameLabel.node.getComponent(UIOpacity)) {
            this.nameLabel.node.getComponent(UIOpacity).opacity = 0;
            tween(this.nameLabel.node.getComponent(UIOpacity))
                .delay(0.3)
                .to(0.3, { opacity: 255 })
                .start();
        }

        if (this.descLabel && this.descLabel.node.getComponent(UIOpacity)) {
            this.descLabel.node.getComponent(UIOpacity).opacity = 0;
            tween(this.descLabel.node.getComponent(UIOpacity))
                .delay(0.4)
                .to(0.3, { opacity: 255 })
                .start();
        }
    }

    playGlowAnimation() {
        if (this.glowEffect) {
            // 光效旋转动画
            tween(this.glowEffect)
                .by(3, { angle: 360 })
                .repeatForever()
                .start();

            // 光效缩放动画
            tween(this.glowEffect)
                .to(1.5, { scale: new Vec3(1.2, 1.2, 1.2) })
                .to(1.5, { scale: new Vec3(1, 1, 1) })
                .repeatForever()
                .start();
        }
    }
}