Good evening all. In a game I am working on, I have a world map that is inserted into a scroll view. When the user navigates to world map, I wrote a piece of code that automatically centers the map on the last location the player has explored. My problem is that when the last explored area is near the edge of the map, it scrolls beyond the edge of the map, revealing the black background. Is there anyway I can make it so that the scroll view cannot go beyond the world map inside of it? Like, for example, making the scroll view the same size as the world map image?
If you have set the width/height for the scrollView, you will also need to apply a mask to it, so that it ‘really works’ (based on my experience in v1.x).
The mask can be a simple mask.
I am looking at the API and I don’t see any option for setting a mask. Can you give me a quick explanation? Here is my setup for the scroll view. From what I understand, the width / height is the portion of the screen that the view takes up.
local options_for_scroll_view = {
id = “scroll_view”,
top = 0,
left = 0,
width = display.contentWidth,
height = display.contentHeight,
scrollWidth = display.contentWidth,
scrollHeight = display.contentHeight,
backgroundColor = {255,255,255,0},
topPadding = 0,
bottomPadding = 0,
leftPadding = 0,
rightPadding = 0,
isLocked = false,
hideScrollBar = true,
isBounceEnabled = true,
}
Hi @gjean011,
If you’re using Graphics 2.0, ScrollViews do not require a mask… the “mask” is automatically set by the width and height, as the docs specify. In your case, do you mean that if the explored point is almost at the very edge of your map, and you center that point in the scroll view, there is black region behind because the map image has no more content?
Brent
That is exactly the problem. I thought ScrollTo() would automatically stop, but I guess not.
A scrollView is inherently “stretchy”; maybe if you turn off bounce that could help, but to fix the problem on your end you could record the extents of the scrollView itself, and then clip your scrollTo() values to never exceed them (right side), or go below them (left side)
Did that and it works fine. Thank you.
As a side question is it also built in that the scroll view cannot be scrolled diagonally?
Correct, our scrollView currently only scrolls in either up/down or left/right at a time.
Rob
If you have set the width/height for the scrollView, you will also need to apply a mask to it, so that it ‘really works’ (based on my experience in v1.x).
The mask can be a simple mask.
I am looking at the API and I don’t see any option for setting a mask. Can you give me a quick explanation? Here is my setup for the scroll view. From what I understand, the width / height is the portion of the screen that the view takes up.
local options_for_scroll_view = {
id = “scroll_view”,
top = 0,
left = 0,
width = display.contentWidth,
height = display.contentHeight,
scrollWidth = display.contentWidth,
scrollHeight = display.contentHeight,
backgroundColor = {255,255,255,0},
topPadding = 0,
bottomPadding = 0,
leftPadding = 0,
rightPadding = 0,
isLocked = false,
hideScrollBar = true,
isBounceEnabled = true,
}
Hi @gjean011,
If you’re using Graphics 2.0, ScrollViews do not require a mask… the “mask” is automatically set by the width and height, as the docs specify. In your case, do you mean that if the explored point is almost at the very edge of your map, and you center that point in the scroll view, there is black region behind because the map image has no more content?
Brent
That is exactly the problem. I thought ScrollTo() would automatically stop, but I guess not.
A scrollView is inherently “stretchy”; maybe if you turn off bounce that could help, but to fix the problem on your end you could record the extents of the scrollView itself, and then clip your scrollTo() values to never exceed them (right side), or go below them (left side)
Did that and it works fine. Thank you.
As a side question is it also built in that the scroll view cannot be scrolled diagonally?
Correct, our scrollView currently only scrolls in either up/down or left/right at a time.
Rob