Search the Community

Just wanted to share a little function I created with anyone who needs to dynamically generate multistroked text. I'm using it to generate text like this: There are some things I added that can be stripped out: - I am adding hair spaces to space the letters out further. - I had problems with text.setShadow with the font I was using so had to make my own, - I added a hole filler that puts a bullet in the middle of where a capital C appears so that the back stroke doesn't show through. If you can think of any ways to improve or expand on this code I'd be interested to hear // I'm only adding 2 strokes here but you can add more by adding items to the last 2 arrays.// Just make sure that the widest strokes are first in that array because I didn't add code to sort automatically.var myText = multistroke(Number(i + 1) + '. ' + levelNames[key], '20px bpreplaybold', '#FFF', ['#231f20', '#a8bf38'], [11, 7]);btn.add(myText);// returns a group of text objects that simulates text with mutliple strokesfunction multistroke(chars, font, fill, stroke, strokeThickness) { var multistroked = game.add.group(); // add letter spacing // copy spaces from https://www.cs.tut.fi/~jkorpela/chars/spaces.html var charCopy = ''; for (var c = 0; c < chars.length; c++) { charCopy += chars.charAt(c) + ' '; // hair space } chars = charCopy.substr(0, charCopy.length - 1); // add strokes based on lenght of stroke array for (var i = 0; i < stroke.length; i++) { // add shadow // shadow was being cropped into a box for some reason so can't use text.setShadow(-3, 3, 'rgba(0,0,0,0.5)', 0, true, false); // likely a custom font glitch like if (!i) { var shadow = game.add.text(-strokeThickness[i] / 2 - 2, -strokeThickness[i] / 2 + 2, chars, { font: font, fill: fill }); shadow.stroke = stroke[i]; shadow.strokeThickness = strokeThickness[i]; shadow.alpha = 0.25; multistroked.add(shadow); } // hack to fill in holes that show the outside stroke in the middle of uppercase Cs using 2 hair spaces and a bullet if (i == stroke.length - 1) { if (chars.indexOf('C') != -1) { var holeFiller = game.add.text(0, 0, chars.split('C').join('  •'), { font: font, fill: stroke[i] }); multistroked.add(holeFiller); } } // add stroked text var text = game.add.text(-strokeThickness[i] / 2, -strokeThickness[i] / 2, chars, { font: font, fill: fill }); text.stroke = stroke[i]; text.strokeThickness = strokeThickness[i]; multistroked.add(text); } return multistroked;}