“DerpText” by derpmonster83
This module is intended to be used for anyone that is looking for a Typewriter effect or a simple solution to embed images. I wrote this with modern RichText in mind.
You can find it here: Roblox Library
For additional help, consider joining this Discord server: derp's ROFLcopter
Why did I make this?
The original RichText module, created by Defaultio, is a really great solution, and is the inspiration and model for this module. That being said, it has shown its age with a lack of typing, no support for modern RichText, and incompatibility with TextLabels that are a descendant of a frame with UIScale inside of it.
This module aims to fix all of those issues, while also adding a few more features.
Documentation
This module is INCREDIBLY simple to use. All you have to is require it, and then pass in some RichText text and it will do all the work for you.
New tags:
<br> - Adds a breakline to your string
Example: <br>
<img />
Example: <img id="14219595" size="350,150" />
Properties:
- id='number' - (required) - id of your image
- size='number,number' - (optional) - Vector2 (in pixels)
- color='string' - (optional) - hex code color for your image
<animation></animation> - Animates the encapsulated text
Example: <animation style='greenfade' repeats='true'>Hi, you are awesome!</animation>
Properties:
- style='string' - (optional) - Define the style of your animation
- animationLength='number' - (optional) - How long the animation will player
- repeats='true' - (optional) - Will the animation repeat once it completes?
- timeBetweenStep='number' - (optional) - How much time it will take before each letter appears
- step='word | letter | all' - (optional) - Define if you want to skip word by word or letter by letter
Current styles:
- appear (default)
- fade
- wiggle
- swing
- spin
- rainbow
- greenfade
To add your own animations, simply clone an existing animation and create your own function.
When defining the module, you have a ton of choices you *can* make about how you'd like
to style your text, This is optional, but it gives you some room to make the text
look how you want:
type RichTextOptions = {
HorizontalAlignment: Enum.HorizontalAlignment,
VerticalAlignment: Enum.VerticalAlignment,
FallbackAnimationStyle: string,
FallbackAnimationRepeats: boolean,
FallbackAnimationLength: number,
FallbackAnimationStep: AnimationStep,
DefaultTextSize: number,
DefaultFont: Font,
DefaultTimeBetweenStep: number,
TextStrokeColor: Color3,
TextStrokeTransparency: number,
Transparency: number,
TextColor: Color3,
LineSpacing: number, -- in pixels
WordSpacing: number, -- in pixels
LetterSpacing: number -- in pixels
}
Snippets
Basic Usage:
local DerpText = require(path.to.DerpText)
local myFrame = script.Parent -- path to a frame that the text will reside in
local derpTextObj = DerpText.new(myFrame, [[
This is the <b>best</b> <font color='#00ffff'>burrito</font>, I've ever eaten.
<br>
<br>
YUM <i>YUM</i> YUM
]])
derpTextObj:Play()
output: https://gyazo.com/54a70aab9f861e94bfb203ea12486fbb
Animating and embedding images:
local DerpText = require(path.to.DerpText)
local myFrame = script.Parent -- path to a frame that the text will reside in
local derpTextObj = DerpText.new(myFrame, [[
This is the <b>best</b> burrito, I've ever eaten.
<br>
<br>
<animation style='rainbow' repeats='true'>
YUM YUM YUM
<br>
<br>
<img size='100,100' id='15335953809' />
</animation>
]])
derpTextObj:Play()
output: https://gyazo.com/8dad7153045d41262d37048dea71565b
What’s next?
I have two more goals for this module:
- Add a status variable and signal that will communicate the current status of your DerpTextObj
- Add a waitAfterAnimation property to animation tags that will
- I plan on recording a YouTube video of me using the module in a practical sense (in a real game). Stay tuned for that!
Final notes
I hope you find great use with this module, and if you have a feature suggestion or a bug report, feel free to add it in this thread, or message me directly on the DevForum.
I plan on updating this module as reports are made, or feature requests that I deem are worthwhile are made. I will not be making this module more complex than it has to be, as it should really just be a tool for you.
Finally, I figure that some basement dweller is going to come onto this thread and say something like “WHY SHOULD I USE THIS?” or “TAKE A LOOK. THIS MODULE DOES THE SAME THING!” I do not care, and if you do not want to use it, you do not have to. I open-sourced this so others could use this module because a lot of people have asked, not to try and “sell” this module for you to use. Feel free to use the text module of your choice, bro.