How do I Create a Chat Window

Hey there,

My goal is to create a log of sorts that holds notifications of certain events, player damage, monster deaths, chat, etc. Unfortunately the way I can seem to get the scrolling window is by using a TextBox. More specifically, I want to know if it's possible to edit this bulky ugly white box into something more appealing to the eyes? I mean this really can't be our only option for scroll-able text, is it?

Thank You,

Stephen

I'm thinking about a mask covering the bottom of the textbox, then when the textbox has appended a new line it will go slightly (character height) under so it is covered but seems like nothing was written, then tween it upwards with LiteTween?

Here's a .capx!

https://www.dropbox.com/s/ktfm9hd2f7j28 ... .capx?dl=0

CloveltOc

Loving it so far. Unfortunately once the text window is full it stops scrolling up. Know how to fix this?

Sorry for the late response! Just set the text box's height to 144 to match the correct line-object height ratio.

Nevermind, didn't read what your issue was correctly.

New .capx!

https://www.dropbox.com/s/ktfm9hd2f7j28 ... .capx?dl=0

CloveltOc

Sorry, but I still don't understand how it works and how I can control it. I would like the text to scroll upwards, not down. As well, the first line of text stays at the top. How do I get it to scroll away with the rest of the text?

Well, Tekniko, my idea was to build a foundation so you could understand how to make one that fits your needs, but if it is not clear enough:

The text is constantly lerping towards its origin, but when a new line is appended the text's Y is instantly added the height of a line (in pixels), so even though a new line has been appended, it seems like nothing has changed. The text will lerp towards its origin, and the new line will be uncovered from the mask, that uses substract out (erases all beneath).

No idea why it wasn't scrolling properly when it's vertical allignment was the bottom, but basically all I did to fix it is change it to top and the lerp value. I really can't see where the complicated part is. What do you mean with " the first line of text stays at the top" ? if you add to the append action &time, you can see that is is always scrolling. Again, I changed the vertical allignment only as an example, you can tamper with it all you want.

Hey CloveltOc,

I put all my questions and thought process into a video. Easier to understand.

Look at what is being set at the beginning. It's the mask! It covers the text at the bottom of the bg object so it gives that smooth effect.

I don't even know why when the vertical allignment is in the bottom the text doesn't go on. Tried a few things, but came up with a rather hacky solution that works well no matter how fast you spam it!

https://www.dropbox.com/s/ktfm9hd2f7j28 ... .capx?dl=0

Also, no condition = every tick

Otherwise for the textbox object you should use CSS: http://www.w3schools.com/css/

Modify the properties of the textbox object itself through the HTML standards.

Be sure to use the ID property of the textbox object to identify it, and in your HTML page (on export) make sure to have the appropriate CSS script aimed at that object.

{

background-color: transparent; }

Is likely the CSS property you'll try to set.

Remember we're doing HTML5, so let's take advantage of what the browsers are offering us as well.