react-scrolling-text

1.0.0 • Public • Published

react-scrolling-text

Gif

As seen in Minecraft!

Gif Minecraft Gameplay Gif Minecraft

Installation

npm i --save react-scrolling-text

Usage

Default Props

import RandomTextGenerator from 'react-scrolling-text';
...
<RandomTextGenerator
  charList={['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']}
  text={'Please include text prop'}
  interval={10}
  timePerChar={200}
/>

Props

Prop Name Data Type Required? Default Value Description
charList Array No ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'] Random characters to display when scrolling
text String No 'Please include text prop' The final text to display
interval Number No 10 # of milliseconds between each change of random scrolling character
timePerChar Number No 200 # of milliseconds it takes to move on to next character when scrolling

Warning!!!

There are no styles included! This component will inherit from its parent

Minecraft example from above

The font being used is Press Start 2P

render(){
  return(
    <RandomText
      charList={['é', 'ä', 'í', 'ƒ', 'ñ', '*', 'π', '[', ']', 'k', '¥', 'å']}
      text={'Hello World!'}
      interval={20}
      timePerChar={200}
    />
  );
}

Todo (hopefully)

  • Include Regular Expressions into charList prop

/react-scrolling-text/

    Package Sidebar

    Install

    npm i react-scrolling-text

    Weekly Downloads

    3

    Version

    1.0.0

    License

    ISC

    Last publish

    Collaborators

    • tylerstanish