aframe-gif-component

KO | EN

gitlite — search

#javascript #python #hacktoberfest #react #ai #typescript #llm #go #golang #android #machine-learning #rust #deep-learning #linux

aframe-gif-component

★ 24 Open GitHub ↗

A conponent to control GIF for A-Frame VR.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# AFrame GIF Component

**A conponent to control GIF for [A-Frame](https://aframe.io) VR.**

**Requires [`aframe-gif-shader`](https://github.com/mayognaise/aframe-gif-shader).**

**[DEMO](https://mayognaise.github.io/aframe-gif-component/basic/index.html)**

![example](https://raw.githubusercontent.com/mayognaise/aframe-gif-component/master/example.gif)

## Method

### Global method

#### `play()`

Play gif animation

```js
entity.play()
```

#### `pause()`

Pause gif animation

```js
entity.pause()
```

### Custom method

#### `togglePlayback()`

Toggle playback. if the gif is paused, play and pause if it's playing.

```js
entity.components.gif.togglePlayback()
```

#### `nextFrame()`

Go to next frame. Useful if it's paused.

```js
entity.components.gif.nextFrame()
```

#### `paused()`

Returns if it is paused.

```js
const paused = entity.components.gif.paused() // true or false
```

## Usage

### Browser Installation

Install and use by directly including the [browser files](dist):

```html
<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:

```bash
npm i -D aframe-gif-shader aframe-gif-component
```

Then register and use.

```js
import 'aframe'
import 'aframe-gif-shader'
import 'aframe-gif-component'
```

aframe-gif-component

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README