Text Effects Pack 1

Phaser 3 Text Effects Pack 1

Here is a pack of 3 Phaser 3 text effects that may be useful in your games.

TypeWriter

Demo

http://phasergames.com/phaser/demos/texteffects/typewriter.html

Usage

var myText = "When in the Course of human events it becomes necessary for one people to dissolve the political bands which have connected them with another and to assume among the powers of the earth, the separate and equal station to which the Laws of Nature and of Nature/'s God entitle them, a decent respect to the opinions of mankind requires that they should declare the causes which impel them to the separation.\nWe hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness. — That to secure these rights, Governments are instituted among Men, deriving their just powers from the consent of the governed, — That whenever any Form of Government becomes destructive of these ends, it is the Right of the People to alter or to abolish it, and to institute new Government, laying its foundation on such principles and organizing its powers in such form, as to them shall seem most likely to effect their Safety and Happiness.";
        var style = {
            'color': 'white',
            'fontSize': '24px',
            'wordWrap': {
                'width': this.sys.game.config.width
            }
        }
        this.tw = new TypeWriter({
            'scene': this,
            'text': myText,
            'speed': .5,
            'style': style
        });

Speed – the lower the number, the faster the text will display.

 

Scrolling Text

Demo

http://phasergames.com/phaser/demos/texteffects/scrollText.html

Usage

var myText = "The scrolling text goes here.";
          var style = {
            fontFamily: "Arial Black", fontSize: 26, color: "#ffffff"
        }
        this.scrollText = new ScrollText({
            'scene': this,
            'text': myText,
            'speed': 10,
            'style': style,
            'y':200
        });
        this.scrollText.getText().setStroke('#2980b9', 6);

Zoom Text

Demo
http://phasergames.com/phaser/demos/texteffects/zoomText.html

Usage

var myText = "When in the Course of human events it becomes necessary for one people to dissolve the political bands which have connected them with another and to assume among the powers of the earth, the separate and equal station to which the Laws of Nature and of Nature's God entitle them, a decent respect to the opinions of mankind requires that they should declare the causes which impel them to the separation.\nWe hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness.";
        var style = {
            'color': 'white',
            'fontSize': '24px',
            'wordWrap': {
                'width': this.sys.game.config.width
            }
        }
        this.zoomText = new ZoomText({
            'scene': this,
            'text': myText,
            'speed':1,
            'style': style
        });

Speed – lower is faster

 

21 Sales