Tiny scrollbar in widget.newScrollView

Solar2D Widgets
#1

Sorry to duplicate – I put this in an old thread but I think no one looks at that.

I have a scrollbar problem – tiny 1-2px grey line scrollbar – in build 3607, but the build does not make any difference. Putting in a custom scrollbar makes no difference, no matter how big I make the spritesheet.

So I made my own scrollbar, but am very confused by getContentPosition. I can use the number, but only if I know the max of the number, and that changes in an odd way for different devices. For example, the max of that number is larger on iPhone than on iPad (I am using landscape), not correlated in an obvious way with screen resolution, not predictable by any formula I can come up with. Similarly with the amount of content I put in, no formula I can figure out between different amounts of content.

All padding is set to 0 as required.

Is this a known problem? Is there any way to get the scrollbar to show up with a reasonable width?

#2

Can you provide a visual of the issue? :slightly_smiling_face:

Also, what content scaling are you using?

#3

2048x2732_202087103235
2048x2732_2020871032352732×2049 617 KB

Content scaling from config.lua
content =
{
width = 1080,
height = 1920,
scale = “letterbox”,

And the attempt at custom scrollbar:
local scrollBarOpt = {
width = 50,
height = 50,
numFrames = 3,
sheetContentWidth = 50,
sheetContentHeight = 150
}
M.scrollBarSheet = graphics.newImageSheet( “pics/scrollBar_small.png”, scrollBarOpt )

#4

A few things… there is a no one-size fits all solution, but most Apple devices are 4:3 aspect ratio, so anything multiples of 320 x 480 would have a good fit on those devices:
640x960
960x1440
1280x1920

For the width of the scrollbar you an try creating it as a % of the total content width, though the positioning will still vary depending on the device with different aspect ratio, but you can still get the left border of the screen and align it from there.

For the scroll bar issue, are you referring the that line next to the “Water bathing” index? Don’t know if that’s a scroll bar, but have you tried hiding the scroll bar in the properties?

Also, if you’re in the Solar2D Discord server it may be easier to assist you as this one may be a little complicated. :slightly_smiling_face:

#5

I do my apps for all devices, and I picked that aspect ratio as kind of in the middle. I do % of content width and content height in almost every place in the app (except navigation buttons) to get good scaling. Both images look pretty much the same across all devices in the simulator.

2048x2732_20208711329
2048x2732_202087113292732×2049 497 KB

The attached image shows a pseudo-scrollbar that is 50px wide, that is why I picked that size for the custom scrollbar.

Now I understand what you meant by the ‘water bathing’ reference. Sorry for being slow. Yes, that tiny line next to Water Bathing is the scroll bar. It works fine, just too small to see. And it does not change when I change the custom toolbar spritesheet.

I am on Discord as marrella#7176. It certainly is a complicated one.

#6

Here is what the same (as my first image) looks like on a iPhone X. The scrollbar is shorter but still too thin to be useful.

1125x2436_202087112730
1125x2436_2020871127302435×1125 311 KB

BTW, how do I set the size of the scrollbar to % of the screen? The only options I know of are in the spritesheet load, and that has to be the same pixel size as the spritesheet, right? (I tried making the size very large, no effect.)

#7

Just pinged you in Discord. :slightly_smiling_face:

#8

I don’t see a ping. DId you ping dmarques42 or marrella7176? I had to switch to marrella because I already had an account in Discord.

#9

This old thread may help you, see the last post.

#10

Thank you, I did not know of those attributes. But, I tried every combination of that, even frameWidth=500 and no change at all in the scrollbar.

I would very much like for this to work, but whatever I do with the scrollbar, I get the same thin line – or nothing if I leave scrollBarOptions out.

#11

Hello i saw my old thead was picked up on the last comment made by @ernst3 and added some things to it that maybe can still help you. Sorry for not seeing this earlier. That was working only with tableview and my post was incorrect and i could not edit it.
But i downloaded the github files and modified it and it should work now. dont know if you still need this, but i hope it does help for someone.