[TextBox]Typewriter effect + Justify text align

Get help using Construct 2

Post » Mon Feb 09, 2015 3:06 pm

(my english is not perfect sorry).

Hello hello,

I'm currently working on a visual novel project. Nice little story, with painting, music, few visual effects. Very simple.
Everything worked fine since last week. I have a problem with the text display and can't find a solution.

Exemple (work with Chrome, not firefox).
Capx

- I display the text with a Typewriter effect using Ashley's method.
- For Destination Text, I use a TextBox object so I can add some CSS. I want my text align to be "justify". Didn't find proper solution with simple Text object. (work with Chrome and Node-Kit).

My problem is that the CSS wait the text to be displayed to apply the "text-align : justify" and it make this ugly wraping/jumping effect.

Do you have any idea how to correct that ?

-If I apply "text-align : Justify" to SourceText ? Can I ask to DestinationText to "clone" exactly the same display before adding typewriter effect ?

-Can I apply opacity to each letter or only for the full textbox ? My idea is to set the text to opacity 0% and then the typewriter effect won't add text but simply change opacity letter by letter.

-I was thinking of using a simple sprite black object to mask the text and make it move from left to right to make a fake typewritter effect, but only work on a black (or other color) textbox and if possible I want my textbox to be transparent, on top of very precise and detailed painting :

Image


If you have any idea, please help me, I'm just a nooby graphist who start Construct fews weeks ago :D
B
9
S
2
Posts: 15
Reputation: 625

Post » Mon Feb 09, 2015 3:27 pm

Seems like the approach to use would be to have the full text in there, already justified and then make separate characters visible. Otherwise it will jump as the amount of text changes, that seems inevitable.
B
19
S
6
G
6
Posts: 1,101
Reputation: 5,646

Post » Mon Feb 09, 2015 4:05 pm

I don't think it's possible to have both "text-align: justify" and perfect word wrapping while doing a typewriter effect. At best, you can programmatically insert "newlines" at key points inside your sourceText so that no weird wrapping occurs.
B
54
S
21
G
20
Posts: 871
Reputation: 15,450

Post » Tue Feb 10, 2015 1:39 pm

Somebody wrote:Seems like the approach to use would be to have the full text in there, already justified and then make separate characters visible.


You're probably right, I'm actually searching for this kind of solution if any of you have idea please tell me ;)
B
9
S
2
Posts: 15
Reputation: 625

Post » Mon Apr 06, 2015 9:37 am

Hi, I have insert "newlines" and it works (example is Dutch text)

Text .... Typing Type ..."Pim is een muis. Die muis zoekt kaas."&newline&"Zij gaat naar de kast. In de kast is een doos."&newline&"In de doos ziet zij de kaas. Die is geel."&newline&"Pim eet de kaas op. Haar buik is nu dik."&newline&"Zij heeft pijn. Pim loopt naar het hol."&newline&"Zij ligt op haar bed. Ik eet niet meer zo veel." ...at 1 letter per 0.1 sec
B
8
S
3
Posts: 6
Reputation: 562

Post » Mon Apr 06, 2015 9:57 am

A workaround, although it's a terrible one, would be using the spritefont-plugin on a layer with force own texture and overlay it with a black box with blendmode.
While using the spritefont it's possible to know the width of every letter and adjust the black box's position or width accordingly.

The more I think about it, the more I dislike the idea, actually.. haha..
I told my dentist I had trouble with my teeth and asked her to fix it without looking in my mouth..
B
53
S
16
G
8
Posts: 6,157
Reputation: 19,744

Post » Mon Apr 06, 2015 12:43 pm

thanks for help !

I will try both your method and see if I can make my perfect text engine :)
B
9
S
2
Posts: 15
Reputation: 625

Post » Mon Apr 06, 2015 1:08 pm

Image
B
58
S
23
G
7
Posts: 1,438
Reputation: 10,555

Post » Fri May 08, 2015 11:56 am

how to make a typewriter with raises by word ? pls help...
B
4
Posts: 4
Reputation: 213

Post » Fri May 08, 2015 3:04 pm

@Nalsa ..simple word by word typing...

capx> http://s000.tinyupload.com/index.php?fi ... 1543821910
Image
B
58
S
23
G
7
Posts: 1,438
Reputation: 10,555

Next

Return to How do I....?

Who is online

Users browsing this forum: 99Instances2Go, bambo and 0 guests