Why is there a 1px border around Scrollviews on some devices?

[kermit4karate]

I’m testing a mockup of an idea with a large scrollview group containing a single .jpg of 1242 x 6000 px, and when I test it in the simulator on iPhone 4 and 5, I see a small 1px light gray border around the entire scrollview container, but the border does not appear when previewed in the simulator for iPhone 6 and 6 Plus. 

Does anyone know why this is? In the code I’ve changed the background color of the scrollview to black, but the border is still there. 

-- Our ScrollView listener local function scrollListener1( event ) local phase = event.phase local direction = event.direction return true end mainScrollWindow1 = widget.newScrollView { left = 0, top = 0, width = display.contentWidth, height = display.contentHeight, bottomPadding = 0, id = "onBottom", horizontalScrollDisabled = true, verticalScrollDisabled = false, listener = scrollListener1, backgroundColor = { 0, 0, 0 }, hideBackground = false, friction = .92 } mainScrollWindow1.isVisible = true

[kermit4karate]

Last night I tried splitting my larger 6000px tall image within the scrollview into three smaller images of 2000px tall and inserting them into the scrollview group and can confirm that the 1px white border still appears in the simulator for some devices (iPhone 4 and 5, for instance) and not for others (iphone 6, 6 Plus).

Is this something to worry about? 

[rob]

Are you talking about the line on the right hand side?

If so that’s the scroll bar.  You will likely see it on shorter devices because there is something to scroll.

Rob

[kermit4karate]

Hi Rob, 

No, I’m referring to a thin, apparently exactly 1 pixel white line around the entire device screen – not the scrollview container, but like an inside border around the device screen itself. You can see it in the screenshot I sent, which is of an iPhone 4 in the simulator, but that line is not there when I run the simulator for iPhone 6 or 6 Plus. 

I just realized that I see the line on ALL Corona projects in the simulator for certain devices. Here’s another screenshot that better shows it, and I don’t see that line at all when I use the simulator for iPhone 6 and 6 Plus. 

I don’t have an actual iPhone 4 or 5 device to test, but will that line show up on those devices, or is it an anomaly with the simulator? Or could it have to do with my config.lua settings, which are also shown in the screenshot?

[rob]

That border can be thought of as the frame of the phone.  It’s not part of your actual app, but shows where your skin stops and your app starts taking up real-estate.

Rob

[kermit4karate]

Thanks, Rob. To the best of your knowledge, do you know if it appears on an actual iPhone 4 or 5 device like it does on the sim? If it does and it’s in fact gray or white, I could use that info in designing backgrounds. I could use lighter backgrounds to appear to blend more seamlessly with the line.

[rob]

That line is part of the skin.  It will not show on device.  Its purely there to show you where your app ends and the skin begins.  Nothing to worry about here.

Rob

[kermit4karate]

Awesome. Thanks, Rob. Have a great night. 

[kermit4karate]

Last night I tried splitting my larger 6000px tall image within the scrollview into three smaller images of 2000px tall and inserting them into the scrollview group and can confirm that the 1px white border still appears in the simulator for some devices (iPhone 4 and 5, for instance) and not for others (iphone 6, 6 Plus).

Is this something to worry about? 

[rob]

Are you talking about the line on the right hand side?

If so that’s the scroll bar.  You will likely see it on shorter devices because there is something to scroll.

Rob

[kermit4karate]

Hi Rob, 

No, I’m referring to a thin, apparently exactly 1 pixel white line around the entire device screen – not the scrollview container, but like an inside border around the device screen itself. You can see it in the screenshot I sent, which is of an iPhone 4 in the simulator, but that line is not there when I run the simulator for iPhone 6 or 6 Plus. 

I just realized that I see the line on ALL Corona projects in the simulator for certain devices. Here’s another screenshot that better shows it, and I don’t see that line at all when I use the simulator for iPhone 6 and 6 Plus. 

I don’t have an actual iPhone 4 or 5 device to test, but will that line show up on those devices, or is it an anomaly with the simulator? Or could it have to do with my config.lua settings, which are also shown in the screenshot?

[rob]

That border can be thought of as the frame of the phone.  It’s not part of your actual app, but shows where your skin stops and your app starts taking up real-estate.

Rob

[kermit4karate]

Thanks, Rob. To the best of your knowledge, do you know if it appears on an actual iPhone 4 or 5 device like it does on the sim? If it does and it’s in fact gray or white, I could use that info in designing backgrounds. I could use lighter backgrounds to appear to blend more seamlessly with the line.

[rob]

That line is part of the skin.  It will not show on device.  Its purely there to show you where your app ends and the skin begins.  Nothing to worry about here.

Rob

[kermit4karate]

Awesome. Thanks, Rob. Have a great night.