Touch to scroll layout

Dear all,

I'm working on a game using a layout larger than the playing window. I'd like to be able to scroll the layout left/right with a finger through a touch command.

Programming logic a a little beyond my comprehension so I'd need your help for that.

Kind regards

Laurent

I suppose you want to scroll with a swipe...

This is a bit tricky, I may be able to put up a capx when I get home.

That's it !

Thanks for your help. It will be much appreciated.

If you want to do this for a fullscreen-able game, use scale mode for project and create a invisible object with the "scroll to" behaviour and with the size or your default window size ... the goal is to make this object move and auto scroll the window automatically for you on every tick. For example, if this object "scroll" is centered with X=320 Y:200 (640/400 window size)

On every tick

If Is in touch          -> scroll.X=(Touch.X+320)/2

If not in touch        -> scroll.X=320

The last condition is here to centered the view again when you touch nothing

If I'm guessing right, is this like the scrolling/swiping thing you see in an Ipad? Or is it just a scrolling thing you'll see in a browser? Cause in a browser, when you release the mouse button/mouse scroll, the scrolling stops, but in an Ipad, when you release your finger after swiping it in the screen, the screen still moves until it reaches the other page.

Yes it's true, need more details for good answer ;-p

Well, both would be nice. The first one to navigate on a huge layout, the second as a transition to another layout.

Naelin, thanks for your solution. I thought about it but there's a problem : the big invisible square intercepts the touch command applied to active objects on the layout.

Hmm, you can probably try scaling down that big invisible square and put it maybe on the lower right cornoer or somehting and just have your finger swipe on that certain part of the screen just to check if it would work. If it does, then your next problem is your post above.

Big square "scroll" is done with what kind of object ? ... never use a text object as "scroll" !! ... text objects have strange behaviour making them displayed always on top of all others objects ... so perhaps even intercepting the touch event ! ...

I use a centered invisible empty "Sprite" object as "scroll". To be really sure put this "scroll" sprite object on the bottom of the most bottom layer of the project behind all "active" objects ...

Thanks for this suggestion but I really would love to avoid using this transparents objet. Because, as specified, it intercepts actions on active objects that it overlaps.

Would it be possible to use another approach with, for exemple, recording the absolute position of a click/touch spot on the screen and transmiting its movement to the layout ?

There is a lot of other way to do that but this way seems for me the better and also for scirra (it's a scirra tips)

If you still have a touch problem there is something wrong in your code. i send you a capx file with sample for better understanding ... if you still have problem share/send me your project for debugging.

(edit) LINK to a sample project file for auto scrolling feature ... the touch event is not intercept ... (if piece is touch the rotation of the piece is stop and start again if not).

I was working a little on an 'ipad' like screen scrolling feature, but I was a bit too tired to work it out... There isn't much math but it is a little confusing...

Maybe this afternoon inspiration will strike ;)

Woaw, It's absolutely amazing. Thank you Naelian.

But a few questions :

• is there a way to suppress the white margin that appears left and right of the background image at the en d of panning ?
• is there a way to make pan stop when an object on the scene is dragged ?

Thanks again !

Laurent

Yes laurent, you can set black color to the layer so you will see black instead of white on borders ... if you want something more beautiful use a TiledBackground with texture and put in at the bottom of the layer.

Yes it's possible to make pan stop on piece drag ... overload the event for scrolling and add just under "is in touch" "not is dragging piece" (=> "is dragging piece" ("invert" mode)) ...

I update the sample project with all this settings to show you

always the same link => Here

* Add vertical scrolling and scrolling only if "piece" is not dragging

* Add Black color to layer

* Add TiledBackground with Wave Texture + Sine Opacity wave in/out effect

* Reduce opacity of the turtle sprite to see Sine Opacity wave in/out effect under it.

You can do great things with a few lines as you can see ... you just need more practice !