如何在连续动画期间保持 ThreeJS 模型姿势

Question

嗨，我正在开发 3D 头像模型来复制手语姿势。我在搅拌机中为我的头像 hampalmd 和 hamshouldertop 创建了两个单独的操作。在搅拌机中，可以为某些关节而不是全身创建关键帧。因此，通过混合这两个动作，我可以在搅拌器中创建我的标志。然而，在我上传模型的 React- Three Fiber 中，我遇到了一个问题：在转换到新动画时，我的模型会重置到静止位置。如何将 3D 模型的结束状态/姿势保存为下一个动画的开始状态？

import React, { useEffect, useRef } from "react";
import { useGLTF, useAnimations } from "@react-three/drei";
import { useCharacterAnimations } from "../contexts/CharacterAnimations";
import * as THREE from "three";

const Man = (props) => {
  const group = useRef();
  const { nodes, materials, animations } = useGLTF("./models/man.glb");
  const { setAnimations, animationIndex } = useCharacterAnimations();
  const { actions, names } = useAnimations(animations, group);
  console.log(names);

  useEffect(() => {
    setAnimations(names);
  }, [names]);

  useEffect(() => {
    const currentAction = actions[names[animationIndex]];

    // Reset, fade in, and play the animation
    currentAction.reset().fadeIn(0.5).play();
    // Ensure animation plays once
    currentAction.setLoop(THREE.LoopOnce, 1);

    // Pause the animation at the end of the last frame
    currentAction.clampWhenFinished = true;

    // Clean up function to fade out the animation when component unmounts
    return () => {
      currentAction.fadeOut(0.5);
    };
  }, [animationIndex]);


  return (
    <group ref={group} {...props} dispose={null}>
      <group name="Scene">
        <group name="Armature001" rotation={[1.829, 0, 0]}>
          <primitive object={nodes.root} />
          <skinnedMesh
            name="rp_manuel_animated_001_dancing_geo"
            geometry={nodes.rp_manuel_animated_001_dancing_geo.geometry}
            material={materials["rp_manuel_animated_001_mat.005"]}
            skeleton={nodes.rp_manuel_animated_001_dancing_geo.skeleton}
            castShadow
          />
        </group>
      </group>
    </group>
  );
};
export default Man;

useGLTF.preload("./models/man.glb");

我尝试在动画结束后设置 3D 模型的新静止姿势，但遇到错误

// Clean up function to fade out the animation when component unmounts
return () => {
  // Fade out the animation
  currentAction.fadeOut(0.5);

  // Apply the skeleton's pose to the skinned mesh
  group.current.skeleton.applySkeleton(group.current);
};

但是我遇到了错误

类型错误：无法读取 null 的属性（读取“骨架”）

Answer 1

我已经解决了这个问题，这是一个简单的修复。将模型导出为选定格式（fbx、glb ...）时，您必须取消选中“骨架”选项卡下的“重置姿势骨骼”