aframe-gif-component
v0.2.0
Published
A-Frame GIF Component to display GIF animation as a material for A-Frame VR.
Downloads
10
Maintainers
mayognaiseReadme
AFrame GIF Component
A gif controller for A-Frame VR. Requires aframe-gif-shader.
Inspired by @gtk2k's awesome sample.
Method
Global method
play()
Play gif animation
entity.play()pause()
Pause gif animation
entity.pause()Custom method
togglePlayback()
Toggle playback. if the gif is paused, play and pause if it's playing.
entity.components.gif.togglePlayback()nextFrame()
Go to next frame. Useful if it's paused.
entity.components.gif.nextFrame()paused()
Returns if it is paused.
const paused = entity.components.gif.paused() // true or falseUsage
Browser Installation
Install and use by directly including the browser files:
<head>
<title>My A-Frame Scene</title>
<script src="https://aframe.io/releases/0.2.0/aframe.min.js"></script>
<script src="https://rawgit.com/mayognaise/aframe-gif-shader/master/dist/aframe-gif-shader.min.js"></script>
<script src="https://rawgit.com/mayognaise/aframe-gif-component/master/dist/aframe-gif-component.min.js"></script>
</head>
<body>
<a-scene>
<a-entity geometry="primitive:box" material="shader:gif;src:url(nyancat.gif);" gif=""></a-entity>
</a-scene>
</body>NPM Installation
Install via NPM:
npm i -D aframe-gif-shader aframe-gif-componentThen register and use.
import 'aframe'
import 'aframe-gif-shader'
import 'aframe-gif-component'