27 lines
876 B
TypeScript
27 lines
876 B
TypeScript
import { useFrame, useLoader } from "@react-three/fiber";
|
|
import { forwardRef, useImperativeHandle, useRef } from "react";
|
|
import { Mesh, TextureLoader } from "three";
|
|
|
|
const SealCube = forwardRef<Mesh>((props, ref) => {
|
|
const texture = useLoader(TextureLoader, 'niko/img/niko.jpg');
|
|
const meshRef = useRef<Mesh>(null);
|
|
|
|
useImperativeHandle(ref, () => meshRef.current!, []);
|
|
|
|
useFrame((state, delta) => {
|
|
if (meshRef.current) {
|
|
meshRef.current.rotation.x += delta * 0.5;
|
|
meshRef.current.rotation.y += delta * 0.5;
|
|
}
|
|
});
|
|
|
|
return (
|
|
<mesh ref={meshRef} position={[0, 3, 0]} castShadow receiveShadow>
|
|
<boxGeometry args={[0.85, 0.85, 0.85]} />
|
|
<meshBasicMaterial map={texture} depthWrite={true} />
|
|
</mesh>
|
|
);
|
|
});
|
|
SealCube.displayName = 'SealCube';
|
|
|
|
export default SealCube; |