scrollWidth and scrollHeight in scrollView not working?

[thegdog]

I can stay that setScrollHeight() did work for me in the sense that I could set it to a large value and it would add a bunch of blank space after the end of my content.  But I had to add a lot of more, because if I set it to the how much content was actually in it, it would not scroll to the bottom of that content.  I think their calculations of the scroll height is just wrong.

I logged a bug for the scrollView issues I was seeing.

More information here:

http://forums.coronalabs.com/topic/43969-scrolling-issue-scrollbar-jumps/

[tiago.rodrigues]

I have this problem.

scrollWidth, scrollHeight, scrollView:setScrollWidth() and scrollView:setScrollHeight() does not work!!!

[tiago.rodrigues]

I have this problem.

scrollWidth, scrollHeight, scrollView:setScrollWidth() and scrollView:setScrollHeight() does not work!!!

[tiago.rodrigues]

I have this problem.

scrollWidth, scrollHeight, scrollView:setScrollWidth() and scrollView:setScrollHeight() does not work!!!

[tiago.rodrigues]

I have this problem.

scrollWidth, scrollHeight, scrollView:setScrollWidth() and scrollView:setScrollHeight() does not work!!!

[ryanwenck]

This is my oroginal post:

I have a scrollview that sits 1/3 of the way down my screen and it holds content about twice as long as the screen height.  The user cannot touch the content that sits out of view because the scrollHeight does nothing to adjust the scroll range, neither during instantiation nor after using the setScrollHeight method.  The view snaps back as if I have reach the end limit.  If i disable bounce, the scroll will not scroll at all!

Fixed problem:

I forgot what many other people probably also forgot when they read the docs.  The scrollview automatically updates when you insert object into it.  So if you define the scrollView properties during the createScene function, then load it with content, the scrollView will have readjusted the scrollHeight value automatically, wiping out your original value.

Solution:

Make scrollView object visible to all scene functions with “local scrollViewName”, then in the scene:show function do a setScrollHeight(your value).  The scrollView scrollHeight property will now be adjusted after all content is loaded.

You could also run setScrollHeight after each new entry, that should also work…

[ryanwenck]

This is my oroginal post:

I have a scrollview that sits 1/3 of the way down my screen and it holds content about twice as long as the screen height.  The user cannot touch the content that sits out of view because the scrollHeight does nothing to adjust the scroll range, neither during instantiation nor after using the setScrollHeight method.  The view snaps back as if I have reach the end limit.  If i disable bounce, the scroll will not scroll at all!

Fixed problem:

I forgot what many other people probably also forgot when they read the docs.  The scrollview automatically updates when you insert object into it.  So if you define the scrollView properties during the createScene function, then load it with content, the scrollView will have readjusted the scrollHeight value automatically, wiping out your original value.

Solution:

Make scrollView object visible to all scene functions with “local scrollViewName”, then in the scene:show function do a setScrollHeight(your value).  The scrollView scrollHeight property will now be adjusted after all content is loaded.

You could also run setScrollHeight after each new entry, that should also work…

[prographodeveloper]

“But I had to add a lot of more , because if I set it to the how much content was actually in it, it would not scroll to the bottom of that content.”

same here.

is there a solution for this?

the auto update feature does not always seem to work (although it often does) trying to set the scroll height manually after the content is added, does not work - the call does indeed change the scroll height - but the amount you have to add is wrong. basically i think the height calculation is wrong if you call set scroll height after the content has been added.

[bjsorrentino]

Hi @prographodeveloper,

Perhaps you’re not setting the overall height correctly? After you insert a new object, check the overall “contentHeight” of the view and see if it matches and makes sense regarding what you’ve added:

[lua]

print(myScrollView._view.contentHeight)

[/lua]

Take care,

Brent

[thegdog]

@prographodeveloper,

Are you perhaps in graphics compatibility mode?  When I posted that, it was regarding an app that was originally developed for the 1.0 SDK and had moved to the 2.0 SDK builds and used graphics compatibility mode.

The problem was never fixed that I know of.  I do not have the problem in an app developed using the 2.0 SDK.

(And yes, I do believe that in that graphics compatibility case, their height calculation was very wrong… at least for my app where the content was a lot of text.)

[kadlugan]

Hi All, 

I am seeing a similar sort of problem with the scroll not reaching the end of my defined scroll width. heres my repost of what i wrote in comments of robs original tutorial. the initial setting of the scroll view width doesn’t work, then if you set the external scrollwidth, the scrolling works but the actual scroll distance seems wrong?

Im running build 2511 on mac. graphics 2.0

Do we need to submit a bug report to get this fixed? 

Hi Rob,

Firstly, Thanks for the tutorial. Great to get me started.
I have been playing around with the code for a little bit to look at using a scroll view for a menu system. However in my trials i cannot get the scroll to work the full width of the scrollWidth. For whatever reason the ‘menu’ only gets to about 2.70 x display.contentWidth. Not the full 3 x display.contentWidth.

Is there a maximum width or something else that might be causing this? Am i missing something, or is it a bug. Im running build 2511 on mac. graphics 2.0

cheers
Nick

[lua]

local widget = require( “widget” )

local scrollView

local icons = {}

local numMenuScreens = 3

local circleRadius = 200

local cW = display.contentWidth

local cH = display.contentHeight

local function iconListener( event )

    local id = event.target.id

    local object = event.target

    if ( event.phase == “moved” ) then

        local dx = math.abs( event.x - event.xStart ) 

        if ( dx > 5 ) then

            scrollView:takeFocus( event ) 

        end

    elseif ( event.phase == “ended” ) then

        --take action if an object was touched

    end

    return true

end

local function myShowSlidingMenu( )

    – if ( “ended” == event.phase ) then

        scrollView = widget.newScrollView

        {

            width = cW,

            height = cH,

            scrollWidth = cW * numMenuScreens,

            scrollHeight = 100,

            verticalScrollDisabled = true, – horizontal scrolling only 

            isBounceEnabled = false

        }

        scrollView.x = display.contentCenterX

        scrollView.y = display.contentCenterY

        --generate icons

        for i = 1, numMenuScreens do

            icons[i] = display.newCircle( (i - 0.5 ) * cW, display.contentCenterY, circleRadius )

            print( “Debug comment: icons[i].x” , icons[i].x )

            icons[i]:setFillColor( math.random(), math.random(), math.random() )

            scrollView:insert( icons[i] )

            icons[i].id = i

            icons[i]:addEventListener( “touch”, iconListener )

        end

    – end

    return true

end

myShowSlidingMenu()

print( “Debug comment: my contentWidth” , cW ,“x3” , cW*3)

print("Debug comment: actual content width: ", scrollView._view.contentWidth)

– REMOVE THIS AND THE SCROLL DOESNT GO ALL THE WAY TO END

scrollView:setScrollWidth(cW * numMenuScreens)

print("Debug comment: actual content width after setScrollWidth(): ", scrollView._view.contentWidth)

[/lua]

[kadlugan]

Hi All, 

I am seeing a similar sort of problem with the scroll not reaching the end of my defined scroll width. heres my repost of what i wrote in comments of robs original tutorial. the initial setting of the scroll view width doesn’t work, then if you set the external scrollwidth, the scrolling works but the actual scroll distance seems wrong?

Im running build 2511 on mac. graphics 2.0

Do we need to submit a bug report to get this fixed? 

Hi Rob,

Firstly, Thanks for the tutorial. Great to get me started.

I have been playing around with the code for a little bit to look at using a scroll view for a menu system. However in my trials i cannot get the scroll to work the full width of the scrollWidth. For whatever reason the ‘menu’ only gets to about 2.70 x display.contentWidth. Not the full 3 x display.contentWidth.

Is there a maximum width or something else that might be causing this? Am i missing something, or is it a bug. Im running build 2511 on mac. graphics 2.0

cheers

Nick

[lua]

local widget = require( “widget” )

local scrollView

local icons = {}

local numMenuScreens = 3

local circleRadius = 200

local cW = display.contentWidth

local cH = display.contentHeight

local function iconListener( event )

    local id = event.target.id

    local object = event.target

    if ( event.phase == “moved” ) then

        local dx = math.abs( event.x - event.xStart ) 

        if ( dx > 5 ) then

            scrollView:takeFocus( event ) 

        end

    elseif ( event.phase == “ended” ) then

        --take action if an object was touched

    end

    return true

end

local function myShowSlidingMenu( )

    – if ( “ended” == event.phase ) then

        scrollView = widget.newScrollView

        {

            width = cW,

            height = cH,

            scrollWidth = cW * numMenuScreens,

            scrollHeight = 100,

            verticalScrollDisabled = true, – horizontal scrolling only 

            isBounceEnabled = false

        }

        scrollView.x = display.contentCenterX

        scrollView.y = display.contentCenterY

        --generate icons

        for i = 1, numMenuScreens do

            icons[i] = display.newCircle( (i - 0.5 ) * cW, display.contentCenterY, circleRadius )

            print( “Debug comment: icons[i].x” , icons[i].x )

            icons[i]:setFillColor( math.random(), math.random(), math.random() )

            scrollView:insert( icons[i] )

            icons[i].id = i

            icons[i]:addEventListener( “touch”, iconListener )

        end

    – end

    return true

end

myShowSlidingMenu()

print( “Debug comment: my contentWidth” , cW ,“x3” , cW*3)

print("Debug comment: actual content width: ", scrollView._view.contentWidth)

– REMOVE THIS AND THE SCROLL DOESNT GO ALL THE WAY TO END

scrollView:setScrollWidth(cW * numMenuScreens)

print("Debug comment: actual content width after setScrollWidth(): ", scrollView._view.contentWidth)

[/lua]

[rob]

Go ahead and file one.

Rob

[prographodeveloper]

“But I had to add a lot of more , because if I set it to the how much content was actually in it, it would not scroll to the bottom of that content.”

same here.

is there a solution for this?

the auto update feature does not always seem to work (although it often does) trying to set the scroll height manually after the content is added, does not work - the call does indeed change the scroll height - but the amount you have to add is wrong. basically i think the height calculation is wrong if you call set scroll height after the content has been added.

[bjsorrentino]

Hi @prographodeveloper,

Perhaps you’re not setting the overall height correctly? After you insert a new object, check the overall “contentHeight” of the view and see if it matches and makes sense regarding what you’ve added:

[lua]

print(myScrollView._view.contentHeight)

[/lua]

Take care,

Brent

[thegdog]

@prographodeveloper,

Are you perhaps in graphics compatibility mode?  When I posted that, it was regarding an app that was originally developed for the 1.0 SDK and had moved to the 2.0 SDK builds and used graphics compatibility mode.

The problem was never fixed that I know of.  I do not have the problem in an app developed using the 2.0 SDK.

(And yes, I do believe that in that graphics compatibility case, their height calculation was very wrong… at least for my app where the content was a lot of text.)

[kadlugan]

Hi All, 

I am seeing a similar sort of problem with the scroll not reaching the end of my defined scroll width. heres my repost of what i wrote in comments of robs original tutorial. the initial setting of the scroll view width doesn’t work, then if you set the external scrollwidth, the scrolling works but the actual scroll distance seems wrong?

Im running build 2511 on mac. graphics 2.0

Do we need to submit a bug report to get this fixed? 

Hi Rob,

Firstly, Thanks for the tutorial. Great to get me started.
I have been playing around with the code for a little bit to look at using a scroll view for a menu system. However in my trials i cannot get the scroll to work the full width of the scrollWidth. For whatever reason the ‘menu’ only gets to about 2.70 x display.contentWidth. Not the full 3 x display.contentWidth.

Is there a maximum width or something else that might be causing this? Am i missing something, or is it a bug. Im running build 2511 on mac. graphics 2.0

cheers
Nick

[lua]

local widget = require( “widget” )

local scrollView

local icons = {}

local numMenuScreens = 3

local circleRadius = 200

local cW = display.contentWidth

local cH = display.contentHeight

local function iconListener( event )

    local id = event.target.id

    local object = event.target

    if ( event.phase == “moved” ) then

        local dx = math.abs( event.x - event.xStart ) 

        if ( dx > 5 ) then

            scrollView:takeFocus( event ) 

        end

    elseif ( event.phase == “ended” ) then

        --take action if an object was touched

    end

    return true

end

local function myShowSlidingMenu( )

    – if ( “ended” == event.phase ) then

        scrollView = widget.newScrollView

        {

            width = cW,

            height = cH,

            scrollWidth = cW * numMenuScreens,

            scrollHeight = 100,

            verticalScrollDisabled = true, – horizontal scrolling only 

            isBounceEnabled = false

        }

        scrollView.x = display.contentCenterX

        scrollView.y = display.contentCenterY

        --generate icons

        for i = 1, numMenuScreens do

            icons[i] = display.newCircle( (i - 0.5 ) * cW, display.contentCenterY, circleRadius )

            print( “Debug comment: icons[i].x” , icons[i].x )

            icons[i]:setFillColor( math.random(), math.random(), math.random() )

            scrollView:insert( icons[i] )

            icons[i].id = i

            icons[i]:addEventListener( “touch”, iconListener )

        end

    – end

    return true

end

myShowSlidingMenu()

print( “Debug comment: my contentWidth” , cW ,“x3” , cW*3)

print("Debug comment: actual content width: ", scrollView._view.contentWidth)

– REMOVE THIS AND THE SCROLL DOESNT GO ALL THE WAY TO END

scrollView:setScrollWidth(cW * numMenuScreens)

print("Debug comment: actual content width after setScrollWidth(): ", scrollView._view.contentWidth)

[/lua]

[kadlugan]

Hi All, 

I am seeing a similar sort of problem with the scroll not reaching the end of my defined scroll width. heres my repost of what i wrote in comments of robs original tutorial. the initial setting of the scroll view width doesn’t work, then if you set the external scrollwidth, the scrolling works but the actual scroll distance seems wrong?

Im running build 2511 on mac. graphics 2.0

Do we need to submit a bug report to get this fixed? 

Hi Rob,

Firstly, Thanks for the tutorial. Great to get me started.

I have been playing around with the code for a little bit to look at using a scroll view for a menu system. However in my trials i cannot get the scroll to work the full width of the scrollWidth. For whatever reason the ‘menu’ only gets to about 2.70 x display.contentWidth. Not the full 3 x display.contentWidth.

Is there a maximum width or something else that might be causing this? Am i missing something, or is it a bug. Im running build 2511 on mac. graphics 2.0

cheers

Nick

[lua]

local widget = require( “widget” )

local scrollView

local icons = {}

local numMenuScreens = 3

local circleRadius = 200

local cW = display.contentWidth

local cH = display.contentHeight

local function iconListener( event )

    local id = event.target.id

    local object = event.target

    if ( event.phase == “moved” ) then

        local dx = math.abs( event.x - event.xStart ) 

        if ( dx > 5 ) then

            scrollView:takeFocus( event ) 

        end

    elseif ( event.phase == “ended” ) then

        --take action if an object was touched

    end

    return true

end

local function myShowSlidingMenu( )

    – if ( “ended” == event.phase ) then

        scrollView = widget.newScrollView

        {

            width = cW,

            height = cH,

            scrollWidth = cW * numMenuScreens,

            scrollHeight = 100,

            verticalScrollDisabled = true, – horizontal scrolling only 

            isBounceEnabled = false

        }

        scrollView.x = display.contentCenterX

        scrollView.y = display.contentCenterY

        --generate icons

        for i = 1, numMenuScreens do

            icons[i] = display.newCircle( (i - 0.5 ) * cW, display.contentCenterY, circleRadius )

            print( “Debug comment: icons[i].x” , icons[i].x )

            icons[i]:setFillColor( math.random(), math.random(), math.random() )

            scrollView:insert( icons[i] )

            icons[i].id = i

            icons[i]:addEventListener( “touch”, iconListener )

        end

    – end

    return true

end

myShowSlidingMenu()

print( “Debug comment: my contentWidth” , cW ,“x3” , cW*3)

print("Debug comment: actual content width: ", scrollView._view.contentWidth)

– REMOVE THIS AND THE SCROLL DOESNT GO ALL THE WAY TO END

scrollView:setScrollWidth(cW * numMenuScreens)

print("Debug comment: actual content width after setScrollWidth(): ", scrollView._view.contentWidth)

[/lua]

[rob]

Go ahead and file one.

Rob

[nickwhite125]

I had the exact some problem. 

I solved it by calling the scrollView:setScrollWidth (or Height) after inserting the objects. 

Piece of Cake!!!