Scrollview 2.0 Positioning Problems

I am keep having problems getting things to position correctly in the scrollView widget.  I will be honest, it probably is my lack of understanding on how to position things for multiple devices.  I am using the ultimate config file with a screen res of 320 X 480.  I can’t seem to get the x and y positions to be in the same spot on all devices in the simulator.  Can someone look at the following code and let me know where I am going wrong.  I can adjust the contentGroup height to align it properly on one device and it will be way off on another.  Thanks for any help.

--------------------------------------------------------------------------------- -- -- scene\_help2.lua -- Instruction screen rewrite --------------------------------------------------------------------------------- local widget = require( "widget" ) local storyboard = require( "storyboard" ) local scene = storyboard.newScene() local ui = require( "ui" ) local device = require("device") local fontManager = require("FontManager") -- forward define functions local createScroller local createContent --------------------------------------------------------------------------------- -- BEGINNING OF THE IMPLEMENTATION --------------------------------------------------------------------------------- local background local scrollerGroup local font if device.isSimulator then font = system.nativeFont else font = "Berlin Sans FB Demi" end function scene:createScene(event) local sceneGroup = self.view scrollerGroup = display.newGroup() background = display.newImageRect("graphics/gfx\_blue\_background\_backbtn.png", 360, 570) background.x = display.contentCenterX background.y = display.contentCenterY sceneGroup:insert(background) scrollerGroup = createScroller() sceneGroup:insert( scrollerGroup ) createTitleBar(sceneGroup) createBackButton(sceneGroup) end function scene:enterScene(event) end function scene:exitScene(event) --Reset Scroller to top on scene exit. scroller:scrollTo( "top" , { time = 0 } ) end function scene:destroyScene(event) end function createScroller() local scrollerContent = createContent() scroller = widget.newScrollView{ width = 320, height = 480, hideBackground = true, friction = .5, --scrollWidth = 320, scrollHeight = 480, maskFile = "graphics/gfx\_mask\_help\_backbtn.png", horizontalScrollDisabled = true, verticalScrollDisabled = false, bottomPadding = scrollerContent.height } scroller:setReferencePoint(display.CenterReferencePoint) scroller.x = display.contentCenterX scroller.y = display.contentCenterY scroller.isHitTestMasked = true print("bottomPadding: ", scroller.bottomPadding) scroller.bottomPadding = scrollerContent.height \* 40 print("bottomPadding: ", scroller.bottomPadding) scroller:insert(scrollerContent) return scroller end function createContent() local contentGroup = display.newGroup() local function createIntro() local group = display.newGroup() local test = ui.newText("Intro Group", 0, 0, font, 20, 255, 255, 255, true) test:setReferencePoint(display.CenterReferencePoint) test.x = display.contentCenterX test.y = display.contentCenterY group:insert(test) return group end local function createGamePlay() local group = display.newGroup() local test = ui.newText("Gameplay Group", 0, 0, font, 20, 255, 255, 255, true) test:setReferencePoint(display.CenterReferencePoint) test.x = display.contentCenterX test.y = display.contentCenterY + 130 group:insert(test) return group end local function createPatterns() local group = display.newGroup() local test = ui.newText("Patterns Group", 0, 0, font, 20, 255, 255, 255, true) test:setReferencePoint(display.CenterReferencePoint) test.x = display.contentCenterX test.y = display.contentCenterY + 260 group:insert(test) return group end local function createWordMods() local group = display.newGroup() local test = ui.newText("Word Mods Group", 0, 0, font, 20, 255, 255, 255, true) test:setReferencePoint(display.CenterReferencePoint) test.x = display.contentCenterX test.y = display.contentCenterY + 390 group:insert(test) return group end local introGroup = createIntro() local gamePlayGroup = createGamePlay() local patternsGroup = createPatterns() local wordModGroup = createWordMods() contentGroup:insert(introGroup) contentGroup:insert(gamePlayGroup) contentGroup:insert(patternsGroup) contentGroup:insert(wordModGroup) contentGroup:setReferencePoint(display.CenterReferencePoint) contentGroup.x = display.contentCenterX contentGroup.y = display.contentCenterY + 20 --

 



 

For anyone out there that might end up with the same issue, I have found out what the problem was.  All objects in the scroller need to be positioned in the scroller without the use of any display.contentXXXXX.  This was causing the objects to move around depending on what device you were using.  Position everything using standard x,y coords, then adjust the whole scroller to where you want everything to show.  This might seem elementary to most, but for the few of us that got stumped by this I hope it helps.

For anyone out there that might end up with the same issue, I have found out what the problem was.  All objects in the scroller need to be positioned in the scroller without the use of any display.contentXXXXX.  This was causing the objects to move around depending on what device you were using.  Position everything using standard x,y coords, then adjust the whole scroller to where you want everything to show.  This might seem elementary to most, but for the few of us that got stumped by this I hope it helps.

Thanks for the post. I had a related problem and this helped me figure out the cause.

John

Thanks for the post. I had a related problem and this helped me figure out the cause.

John