问题描述
所以我正在制作一个小游戏,我希望让飞行恐龙物体出现供用户销毁。我希望使用我拥有的导入 gif 渲染飞行物体。它在语法上会是什么样子,我是否需要一些 React 库来做到这一点?所以我将飞行恐龙对象作为组件,然后将其导入画布中进行渲染。
Canvas.jsx:
import React from 'react';
import PropTypes from 'prop-types';
import Background from './Background';
import Ground from './Ground';
import CannonBase from './CannonBase';
import CannonShaft from './CannonShaft';
import CannonBall from './CannonBall';
import Currentscore from './Currentscore';
const Canvas = (props) => {
const viewBox = [window.innerWidth / -2,100 - window.innerHeight,window.innerWidth,window.innerHeight];
return (
<svg
id="mini-game-canvas"
preserveAspectRatio="xMaxYMax none"
onMouseMove={props.trackMouse}
viewBox={viewBox}
>
<defs>
<filter id="shadow">
<feDropShadow dx="1" dy="1" stdDeviation="2" />
</filter>
</defs>
<Background />
<Ground />
<CannonShaft rotation={props.angle} />
<CannonBase />
<CannonBall position={{x: 0,y: -100}}/>
<Currentscore score={15} />
</svg>
);
};
Canvas.propTypes = {
angle: PropTypes.number.isrequired,trackMouse: PropTypes.func.isrequired,};
export default Canvas;
飞行恐龙组件:
import React from 'react';
import PropTypes from 'prop-types';
import dino from './assets/dino.gif'
const FlyingDino = (props) => {
};
export default FlyingDino;
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)