Over a million developers have joined DZone.

Drag-scroll DataGrid to celebrate Flex 4.10.0 Release

DZone 's Guide to

Drag-scroll DataGrid to celebrate Flex 4.10.0 Release

· Web Dev Zone ·
Free Resource

This week sees the release of 4.10.0 of the Apache Flex SDK. This includes some important upgrades including native support for Adobe Scout, more than 15 new Spark components and better support for high-resolution devices like the iOS Retina display. There's also Linux support, which is discussed in this article at eWeek.

This release coincides with what I hope is a renaissance for Flex. According to OmPrakash Muppirala, committer and member of the Apache Flex PMC:

We are seeing interest in the Flex development framework increase rapidly. There have been more than a half a million page views in the past 6 months, more than 9000 downloads of the Flex SDK in the past 3 months, and around 130,000 unique visitors to the flex.apache.org website. Since the initial release of Apache Flex at the end of 2012, the interest in the project has grown steadily

The Flex SDK is available from http://flex.apache.org/installer.html.

I spent a quick half hour taking a break from swarm chemistry to play with the new Spark DataGrid. Unlike the older MX version, this supports skinning and smooth-scrolling, and is the perfect candidate for drag-scrolling. 

Skinning allows me to change the appearance and behavior of Flex components really easily. In this case, all I've had to do is hide the scroll bars and add a few event handlers to help rid the world of another fiddly scroll bar unfriendly to Fitts's Law. It's incomplete--there's no indication of where the displayed part is in context of the total data set--but it was a breeze to write and will work on any browser! 

The demo lives here and the source code lives here. The source for the drag-scroll skin is here. Most of the code is copied from the existing code and all I had to write is the ActionScript inside the fx:Script tags.


Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}