Skip to content

Commit

Permalink
published 2.0.0
Browse files Browse the repository at this point in the history
  • Loading branch information
davidfig committed Aug 7, 2019
1 parent 0c7cb06 commit 7996ee9
Show file tree
Hide file tree
Showing 24 changed files with 1,676 additions and 49,847 deletions.
50 changes: 32 additions & 18 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,50 +13,64 @@ Features:
## Rationale
I needed a scrollbox for the UI of my game and since I had this nifty pixi-viewport, I figured it wouldn't be much work to create it. Five hours later and I realized I was a bit off on my estimates. Hopefully others will find it useful.

## Migration from v1 to v2
Scrollbox no longer exports a default object. Instead you need to use:

```js
const Scrollbox = require('pixi-scrollbox').Scrollbox
```
or
```js
import { Scrollbox } from 'pixi-scrollbox'
```
There were some minor name changes to the fade options. See documentation.

## Simple Example
```js
var PIXI = require('pixi.js');
var Viewport = require('pixi-scrollbox');
const PIXI = require('pixi.js')
const Scrollbox = require('pixi-scrollbox').Scrollbox

// create the scrollbox
var scrollbox = new Scrollbox({ boxWidth: 200, boxHeight: 200});
const scrollbox = new Scrollbox({ boxWidth: 200, boxHeight: 200})

// add a sprite to the scrollbox's content
var sprite = scrollbox.content.addChild(new PIXI.Sprite(PIXI.Texture.WHITE));
sprite.width = sprite.height = 500;
sprite.tint = 0xff0000;
const sprite = scrollbox.content.addChild(new PIXI.Sprite(PIXI.Texture.WHITE))
sprite.width = sprite.height = 500
sprite.tint = 0xff0000

// add the viewport to the stage
var app = new PIXI.Application();
document.body.appendChild(app.view);
app.stage.addChild(scrollbox);
const app = new PIXI.Application()
document.body.appendChild(app.view)
app.stage.addChild(scrollbox)
```

## Usage

## Installation
```
npm i pixi-scrollbox pixi-viewport
npm i pixi-scrollbox pixi-viewport pixi.js
```
or
```
yarn add pixi-scrollbox pixi-viewport
yarn add pixi-scrollbox pixi-viewport pixi.js
```

Note: pixi-viewport and pixi.js are listed as peerDependency, which means you will need to manually install them if they're not already installed (this is to ensure you don't have two versions of these libraries). My instructions above assume you have pixi.js installed (otherwise why would you be looking at this library).
Note: pixi-viewport and pixi.js are listed as peerDependency, which means you will need to manually install them if they're not already installed (this is to ensure you don't have two versions of these libraries).

or [download the latest build from github](https://github.com/davidfig/pixi-scrollbox/releases)
```html
<script src="/external-directory/pixi.js"></script>
<script src="/external-directory/pixi-viewport.min.js"></script>
<script src="/external-directory/scrollbox.min.js"></script>
<script src="/external-directory/pixi-viewport.js"></script>
<script src="/external-directory/scrollbox.js"></script>
<script>
var Scrollbox = new PIXI.extras.Scrollbox(options);
const Scrollbox = new Scrollbox(options)
</script>
```

## API Documentation
[https://davidfig.github.io/pixi-scrollbox/jsdoc/](https://davidfig.github.io/pixi-scrollbox/jsdoc/)

## Buy me Coffee
If you use my open source libraries, please consider supporting my efforts at https://patreon.com/davidfig. Even small amounts help!

## license
MIT License
(c) 2018 [YOPEY YOPEY LLC](https://yopeyopey.com/) by [David Figatner](https://twitter.com/yopey_yopey/)
(c) 2019 [YOPEY YOPEY LLC](https://yopeyopey.com/) by [David Figatner](https://twitter.com/yopey_yopey/)
Loading

0 comments on commit 7996ee9

Please sign in to comment.