React-scrolling-text NPM

react-scrolling-text

Gif

As seen in Minecraft!

Gif Minecraft Gameplay

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

prop-types webpack

@everything-registry/sub-chunk-2610 @infinitebrahmanuniverse/nolb-react-sc

1.0.0

6 years ago