IOS and Android Native Scroll in Adobe AIR

Question

I think it would be a great idea to implement the smooth scroll present in native iOS and Android applications for use in Adobe AIR projects.
Currently, the only way to obtain smooth scrolling lists with images is using StageWebView to show the image list in HTML format, and then awkwardly implement some JavaScript / AS3 communication functionality so the list in the StageWebView is interactive and can communicate with the main program. This is excessively complicated and very error prone (I've found some inexplicable JavaScript errors that only happen in the iPad, not in Android, and not in the PC!).
It would be way better to be able to skip all the StageWebView process altogether and being able to use a simple AS3 API to put any sprite/movieclip into a scrollable canvas which can be moved using the iOS native scroll.
Using Flash animation to simulate the scroll in a list with images is too slow in the iPad and gives a bad user experience. iPad users expect the native iPad scroll, not some poor jerky simulation. A native scroll is the only way to go.
And even though I talk about the iPad, this should be applicable to the native Android scroll, too.
Scrolling is a VERY BASIC action in a tablet, so this should be implemented as soon as possible.
Actually, I'm amazed we're already at AIR 3.0 beta, and still after all this time nobody thought of this. All sorts of fancy stuff is being added to AIR (hardware accelerated video, webcam and microphone access, etc...) but still something as basic and important as a smooth scroll, which every tablet user expects, is still not possible in Adobe AIR. We either have to implement some slow Flash animated scroll, or use the extremely complicated StageWebView with JavaScript/AS3 communication approach (I'm using a third party library called StageWebViewBridge for the JS/AS3 interoperations, which is great, but still, it's a far from ideal solution, since it's pretty fiddly and the JavaScript code doesn't always work properly in iOS).

Answer 1

Hi again jackson@mja.
I've given your scroll component a try just for some static texts, and I've found quite a few important bugs:
1. If the referenced sprite/movieclip is shorter than the scrolling area, it starts bouncing infinitely in a quite funny way,
    which renders the component unusable. Sometimes it even happens when the content is not shorter.
2. If your component is used inside another sprite/movieclip which is added dynamically from code ("addChild(mySprite);"),
    it doesn't work and stops with an error, because the EventListener for mouseDownHandler is being added to this.stage
    in the constructor, but a dynamic movieclip doesn't have access to the stage while in the constructor step (unless it is
    already in the stage added in the Flash IDE, such as in your FLA example). To fix this, I've added the following code
    to the ScrollArea() constructor:
this.addEventListener(Event.ADDED_TO_STAGE, init);
this.addEventListener(Event.REMOVED_FROM_STAGE, close);
    And then I've added the following listener functions:
private function init(event:Event):void {
this.removeEventListener(Event.ADDED_TO_STAGE, init);
this.stage.addEventListener(MouseEvent.MOUSE_DOWN, this.mouseDownHandler);
private function close(event:Event):void {
this.stage.removeEventListener(MouseEvent.MOUSE_DOWN, this.mouseDownHandler);
3. Also, the scrollbar is only correctly rendered if the scroll area is located at the up and left corner of the stage. To put text somewhere else, the component must be put inside a movieclip.
4. This is not really important, but I've found the following variables are never user and so I've removed these lines:
var xy:Point = this.localToGlobal(new Point(this.x, this.y));
var wh:Point = this.localToGlobal(new Point(this.width, this.height));
var sign:int = sign(obj[i]);
I hope this can help you improve your classes.
Best regards,
OMA2k