HarmonyOS鸿蒙Next游戏化卡片掉落系统设计

游戏化掉落系统可以显著提升学习动力，需要合理设计概率和保底机制。

概率掉落与保底机制：

class CardDropService {
  // 基础掉落概率
  private readonly DROP_RATE_CORRECT = 0.15;  // 答对15%
  private readonly DROP_RATE_WRONG = 0.10;    // 答错10%
  private readonly PITY_THRESHOLD = 20;        // 20次保底

  // 计算掉落概率（考虑保底和新手保护）
  private calculateDropRate(
    isCorrect: boolean,
    pityCount: number,
    totalDrops: number,
    totalAnswers: number
  ): number {
    // 新手保护：前10次答题内如果还没掉过卡，第10次必定掉落
    if (totalDrops === 0 && totalAnswers >= 9) {
      return 1.0;
    }

    // 保底机制：连续20次未掉落后必掉
    if (pityCount >= PITY_THRESHOLD) {
      return 1.0;
    }
    // 软保底：接近保底时逐渐提高概率
    let baseRate = isCorrect ? DROP_RATE_CORRECT : DROP_RATE_WRONG;
    if (pityCount >= PITY_THRESHOLD - 5) {
      const bonus = (pityCount - (PITY_THRESHOLD - 5)) * 0.1;
      baseRate = Math.min(1.0, baseRate + bonus);
    }
    return baseRate;
  }

  // 根据稀有度概率选择卡片
  private selectRarity(): CardRarity {
    const random = Math.random();
    const rarities: CardRarity[] = [CardRarity.N, CardRarity.R, CardRarity.SR, CardRarity.SSR];
    const rates = [0.6, 0.3, 0.08, 0.02];  // N:60%, R:30%, SR:8%, SSR:2%
    let cumulative = 0;
    for (let i = 0; i < rarities.length; i++) {
      cumulative += rates[i];
      if (random < cumulative) {
        return rarities[i];
      }
    }
    return CardRarity.N;
  }
}

掉落动画效果：

@Component
export struct CardDropPopup {
  @State cardScale: number = 0;
  @State cardRotateY: number = -180;
  @State cardOffsetY: number = -200;
  @State glowOpacity: number = 0;

  aboutToAppear() {
    // 入场动画：从上方飘落 + 旋转展开
    animateTo({ duration: 600, curve: Curve.EaseOut }, () => {
      this.cardOffsetY = 0;
      this.cardScale = 1;
    });

    // 翻转动画
    setTimeout(() => {
      animateTo({ duration: 500, curve: Curve.EaseInOut }, () => {
        this.cardRotateY = 0;
      });
    }, 300);

    // SR/SSR光效（呼吸动画）
    if (this.droppedCard.card.rarity === CardRarity.SR ||
        this.droppedCard.card.rarity === CardRarity.SSR) {
      animateTo({
        duration: 1000,
        curve: Curve.EaseInOut,
        iterations: -1,
        playMode: PlayMode.Alternate
      }, () => {
        this.glowOpacity = 0.6;
      });
    }
  }
}