Skip navigation
soul-mapp
Currently Being Moderated

Swipe to next image? - xml - Spark List component

Apr 3, 2013 5:54 AM

Hi.. everyone

 

i have a problem, can anyone help.. Ive made a gallery using xml and the sparks list component. that displays images in a horz list which ofcourse can be clicked to see the larger image, but then ofcourse to view the  next image you have to hit the back button and then select another.

How can i swipe on the large image for move to the next item  without having to go back to list.    Thanks.

 

here is what ive got so far..

 

<?xml version="1.0" encoding="utf-8"?>

<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

        xmlns:s="library://ns.adobe.com/flex/spark"

        title="Page {id1}"

        destructionPolicy="never"

        actionBarVisible="true"

        viewActivate="init()">

   

    <fx:Script>

        <![CDATA[

            import valueObjects.Bookpage;

            [Bindable]private var id1:String;

            [Bindable]private var thumbimage:String;

            [Bindable]private var largeimage:String;

           

            private function init():void

            {

                pgImage.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);

                this.addEventListener( TransformGestureEvent.GESTURE_SWIPE, handleSwipe );

                var thisbpage:Bookpage = data as Bookpage;

                id1 = thisbpage.id;

                largeimage = thisbpage.largeimage;

            }

           

            private function onZoom(event:TransformGestureEvent):void

            {

                var mySprite:Sprite = pgImage as Sprite;

                if(mySprite.scaleY.valueOf() >= 1)

                {

                    mySprite.scaleX *= event.scaleX;

                    mySprite.scaleY *= event.scaleY;

                }

                else

                {

                    mySprite.scaleX = 1;

                    mySprite.scaleY = 1;

                }

            }

           

            private function handleSwipe(event:TransformGestureEvent):void

            {

                // Swipe was to the right

                if (event.offsetX == 1 ) {

                    // push the PreviousView without any data using default

                  some help here. pls ..swipe to prev image if any

                   

                }

                    // Swipe was to the left

                else if (event.offsetX == -1 ) {

                    // push the NextView withour any data using

                    some help here. pls ..swipe to next in list

                }   

               

                // Swipe was to the down

                if (event.offsetY == 1 ) {

                    // push the PreviousView without any data using default

                    // ViewTransition

                    this.actionBarVisible = true;

                }

                    // Swipe was to the up

                else if (event.offsetY == -1 ) {

                    // push the NextView withour any data using

                    this.actionBarVisible = false;

                }

            }

        ]]>

    </fx:Script>   

   

    <fx:Declarations>

        <s:SlideViewTransition id="slideUp" duration="300" direction="up" transitionControlsWithContent="false"/>

    </fx:Declarations>

   

    <s:states>

        <s:State name="portraitPhone" stateGroups="phone,portrait"/>

        <s:State name="landscapePhone" stateGroups="landscape,phone"/>    

    </s:states>   

   

    <s:actionContent>

        <s:HGroup>

        <s:Button icon="assets/qsearch.png" click="navigator.popView(slideUp)"/>

        <s:Button icon="assets/prev.png"/>

        <s:Button icon="assets/next.png"/>

        </s:HGroup>

    </s:actionContent>

   

   

    <s:Scroller x="0" y="0" width="100%" height="100%" >

        <s:HGroup>

            <s:Image id="pgImage" left="0" top="11" source="assets/gallery/{largeimage}"  />

        </s:HGroup>

    </s:Scroller>

 

</s:View>

 

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points