Make a sprite (box shape) always fill the screen

Hi!

I'm developing a plugin-free dialogue system, in which the user can scroll the dialogue history as he wishes.

The way I have been implementing it is that I have a big rectangular sprite, that has the drag and drop behavior (for the scrolling). When a new sentence is added on the screen, it is instantly pinned to the rectangle.

It's working quite nicely already, but I'm not sure about something that might be a simple problem:

I want my rectangular area to always fill the whole screen, so that the user can grab it no matter how much it has been scrolled. I can't simply change it's position, because the sentences are pinned to it. My first idea was to change the size of it, but it seems like I can only grow the size in one direction and then it doesn't cover the other side of the screen.

This would be super easy to do if there was a way to set the coordinates of the four corners of this area, but I'm not sure if there any such possibility in construct?

Edit: Another approach that I was thinking about (I have no idea about if this is feasible) would be to dynamically add "slices" to the top and bottom edges of the rectangle to grow it. Would something like this be possible with containers? In other words, could I make one big container that everything gets pinned to and then keep adding parts to this container to always have it fill the screen?

Edit2: I studied containers a bit more, and that approach will probably not work.

To summarize: is there a clever way to keep dragging a rectangle while always having it cover the whole screen?

Did you try something like this?

set the origin at the top and set height to viewportbottom-sprite.y

Why using this approach, instead of a single Text object?

See the example below:

[attachment=0:2m8e1tre][/attachment:2m8e1tre]

brunopalermo

There are many reasons, like for example I'm destroying the text objects when they get out of the view (and re-creating them when they are entering back) to not have a huge amount of text sitting around doing nothing. I also need to colorize the different sentences with different colors depending on who is speaking.

LittleStain

Could it be that simple! I will try that immediately!

Edit:

LittleStain it seems to work nicely! I'm embarrassed how simple the solution was. Too much staring at the screen and too little sleep.

Dang it, it wasn't so simple after all. On the other hand I'm relieved, because I thought I was just an idiot for not finding this easy solution.

The problem with your solution LittleStain is that when the user scrolls the rectangle downwards, the top part of the screen is no longer covered by it..

So I'm still searching for a solution after all...

Wouldn't that just be a matter of adding the condition if sprite.y<0

and adding actions for when that is not the case?

neutrinox I don't understand why creating several text objects and pinning them to a huge invisible sprite is more effective than having one single text object with some code. By the way, you can just set text to "" when you don't need "a huge amount of text sitting around doing nothing".

And I might be wrong, but I think the number of text objects has a lot more impact on performance, memory, etc, than the ammount of thext on them.

Seriously, man... This approach of yours is definitely not effective. You are already spending time, that you could use to develop your game, to try and correct it. And the worst thing is, it's not even broken. It's just not supposed to be done this way.

brunopalermo I appreaciate your voice of sanity. However, the very first thing I tried was using a single text box for everything, but for reasons I don't remember very well anymore, it couldn't achieve what I needed with just that. One thing that I know for sure was that I couldn't color the individual sentences inside the text box (at least without external plugins). It would be nice if one could use something like html-tags inside the text area to mark different texts for different treatment, but I don't think that's possible. Do you know of a way to color the individual sentences inside a single text area?

But maybe you're right and I should "kill my darlings" (meaning coloring the sentences based on the character speaking), I think I will do some more testing with that approach too. It's just that my admittedly more complicated setup is finally working pretty well, the only detail is the "scroll handle" size, which I'm fairly confident can be solved. I'm also a bit worried about having something like 1000 sentences of text in a layout. Currently there is only about 6 text objects (sentences) at any one moment. It would indeed be interesting to know which way is better for performance (or if there is any effect what so ever). So far I have been getting pretty solid 60fps in that layout on my desktop computer.

LittleStain

It's the adding actions part that is the question mark. I can indeed detect when something should be done (based on the y-position), but I'm not sure what the right action would be. I now have the image point at the top of the scroller, so scaling the object won't help with the upper part of the screen.

Maybe it might be possible to dynamically create another scroll handle object when needed and pin the old one to it. This way it might be possible to keep scrolling with the newly created scroll handle and the old one would follow it. I might give that a try.

EDIT:

I think there would be a very easy solution to this, if the image point used for scaling could be changed dynamically. But that's not possible I assume?

Oh, I see... There's no way to color blocks of text in a text Object. I would love to see an update that included reading a text object content as basic html...

Anyway, you could try a middle point. The drag method I explained might be used with several text objects. If you want to make it easy, just use several instances of the same text object. You can still refer to then individually by UID and the action to drag would affect them all.

Here's a .capx (I removed the controls to stop dragging at the beginning and end of the text):

[attachment=0:14v0vh1s][/attachment:14v0vh1s]

Wow, brunopalermo, that's a very elegant solution! So much simpler than the crazy clusterf*ck I had going on

Thank you very much for such a beautiful solution!