Finding the maximum scroll position of a Spark List

Recently, we had a very important person (at least in my opinion), leave our QA team. Peter deHaan, author of Flex Examples left Adobe for bigger and brighter things. If you are new or old to Flex, you have at some point found yourself on Peter’s Flex Examples blog. Since he has moved on, you’ll probably hear nothing but crickets coming from Flex Examples. (Peter, correct me if I’m wrong!)

So, some of us on the team were thinking that we needed to get our butts in gear and begin blogging on a more frequent basis to fill the void. I’m starting with this very simple example of ‘finding the maximum scroll position of a Spark List’. This is helpful whenever you want to scroll down to the end of a List in your application. I recently had this need when I was building a mobile app.

To find the max scroll position, you should subtract the height or width of the DataGroup from the contentHeight or contentWidth of the DataGroup.

maxVerticalScrollPosition = myList.dataGroup.contentHeight – myList.dataGroup.height;

Here are examples:

Source: MaxScrollPositions.mxml

SWF: MaxScrollPositions.swf

7 responses

  1. It’s nice to hear that the void is going to be filled.
    Joan,
    There is tiny typo in your code snippet: after contentHeight there should be minus “-“.
    thanks,
    Igor

  2. I think you have a typo. Shouldn’t it be this:

    maxVerticalScrollPosition = myList.dataGroup.contentHeight – myList.dataGroup.height;

  3. Nice example, a perfect fit to become a part of “ADOBE ® FLEX ® 4
    Features and Migration Guide” http://help.adobe.com/en_US/Flex/4.0/FeaturesAndMigration/flex_4_features.pdf

    ps
    You should pimp your blog with some WordPress plugin to display inline length ActionScript code samples, for example WP-Syntax http://wordpress.org/extend/plugins/wp-syntax/

  4. Hi Joan,

    It is sad that Peter left indeed.

    These kinds of short examples would also be perfect to add to the Flex Cookbook – http://cookbooks.adobe.com/flex . Recently I started reposting some samples there with a link back to my source post to help give the example a wider audience and also promote my own blog 🙂

  5. @Scottae and Igor, thanks for pointing out my little typo. Its been fixed.

    @JabbyPanda: Thanks for the advice. I haven’t spent too much time thinking about pimping my blog to be more user friendly. Great point.

  6. ScrollBars have a “maximum” property so you can achieve the same result by calling the following:

    departmentList.scroller.verticalScrollBar.maximum

    So, to scroll your list to its maximum:

    departmentList.scroller.verticalScrollBar.value = departmentList.scroller.verticalScrollBar.maximum;

  7. For the good of others, cross posting the link reference from your colleague, Steven Shongrunden “Difficult to reliably scroll a Spark List to the bottom after adding a new (possibly multi-line) item”

    http://flexponential.com/2011/02/13/scrolling-to-the-bottom-of-a-spark-list

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: