Skip navigation
Currently Being Moderated

Looking for some Flash tutorials

Apr 19, 2012 10:35 PM

Tags: #website #scroll #bar #actionscript3 #gallery

I'm doing some webstuff in Flash CS5 using actionscript 3, and I could use some help with a couple of things.  Can anyone recommend some tutorials on how to make an effective image gallery?  Like with a picture slider or something?  But ideally nothing overly complicated to do.  I don't wanna just copy and paste code off of a website either, I wanna know how to actually make the code using Flash...maybe even just using the snippets if that's doable. 

 

I'd also like to find a tutorial that'll teach me how to make a scroll bar so I can scan up and down text or images for another part of the project.

 

I'm looking for either video tutorials or written tutorials.

 
Replies
  • Currently Being Moderated
    Apr 20, 2012 4:59 AM   in reply to mentalcase129

    Your best bet for finding tutorials is to search Google using terms specific to you needs.  Try using "AS3 gallery tutorial" and "AS3 custom scrollbar tutorial"

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 25, 2012 2:27 AM   in reply to mentalcase129

    http://theflashconnection.com/book/export/html/186 go through this link you can find vertical custom scroll bar making.

     
    |
    Mark as:
  • Currently Being Moderated
    May 2, 2012 12:00 AM   in reply to mentalcase129

    You can create mask for the movieclip as exactly as in your tutorial. and use below code (I think this is what you want).

     

    For using the below code you should create some user defined components.

    For Horizontal Scroll Bar:  create hscrollBG for scrollbar background and hscroller for scroller.

    For Vertical Scroll Bar: create vscrollBG for scrollbar background and vscroller for scroller.

    mask_mc is mask movieclip  and    content_mc is which the content you want to scroll.

     

    /**** code  ****/

     

    var hscrollbar:MovieClip;

    var vscrollbar:MovieClip;

    if (content_mc.height > mask_mc.height)

       {

        drawVScrollBar();

       }

       if(content_mc.width > mask_mc.width)

       {

        drawHScrollBar();

       }

    private function drawVScrollBar():void
      {
       try
       {
        removeChild(vscrollbar);
       }
       catch (e:Error)
       {

       }
       vscrollbar = new MovieClip();
       addChild(vscrollbar);
       vscrollbar.x = mask_mc.width + 5;        //set scrollbar position
       var bg:vscrollBG = new vscrollBG();
       bg.height = mask_mc.height;
       vscrollbar.addChildAt(bg,0);

       var scroller:vscroller = new vscroller();
       scroller.x = 1;
       scroller.y = 0;
       vscrollbar.addChildAt(scroller,1);
      
       scroller.addEventListener(MouseEvent.MOUSE_UP, sc_mouseup);
       scroller.addEventListener(MouseEvent.MOUSE_DOWN, sc_mousedown);
       stage.addEventListener(MouseEvent.MOUSE_UP, sc_mouseup);
      } 
      private function sc_mousedown(e:MouseEvent):void
      {
       var scroller:MovieClip = vscrollbar.getChildAt(1) as MovieClip;
       scroller.startDrag(false, new Rectangle(1, 0, 0,mask_mc.height- scroller.height));
       scroller.addEventListener(Event.ENTER_FRAME, updateScrollPosition);
      }
      private function sc_mouseup(e:MouseEvent):void
      {
       stopDrag();
       var scroller:MovieClip = vscrollbar.getChildAt(1) as MovieClip;
       scroller.removeEventListener(Event.ENTER_FRAME, updateScrollPosition);
      }
      private function updateScrollPosition(e:Event):void {
       var bg:MovieClip = vscrollbar.getChildAt(0) as MovieClip;
       var scroller:MovieClip = vscrollbar.getChildAt(1) as MovieClip;
       var perc:Number = scroller.y * 100 / (bg.height-scroller.height);
      
       var ypos:Number = ( -perc * ((content_mc.height - mask_mc.height) / 100));
       content_mc.y = ypos;
      }
      private function drawHScrollBar():void
      {
       try
       {
        removeChild(hscrollbar);
       }
       catch (e:Error)
       {

       }
       hscrollbar = new MovieClip();
       addChild(hscrollbar);
       hscrollbar.y = mask_mc.height + 5;
       var bg:hscrollBG = new hscrollBG();
       bg.width = mask_mc.width;
       hscrollbar.addChildAt(bg,0);

       var scroller:hscroller = new hscroller();
       scroller.x = 1;
       scroller.y = 0;
       hscrollbar.addChildAt(scroller,1);
      
       scroller.addEventListener(MouseEvent.MOUSE_UP, hsc_mouseup);
       scroller.addEventListener(MouseEvent.MOUSE_DOWN, hsc_mousedown);
       stage.addEventListener(MouseEvent.MOUSE_UP, hsc_mouseup);
      }
      private function hsc_mousedown(e:MouseEvent):void
      {
       var bg:MovieClip = hscrollbar.getChildAt(0) as MovieClip;
       var scroller:MovieClip = hscrollbar.getChildAt(1) as MovieClip;
       scroller.startDrag(false, new Rectangle(bg.x, bg.y, bg.width - scroller.width,0));
       scroller.addEventListener(Event.ENTER_FRAME, hupdateScrollPosition);
      }
      private function hsc_mouseup(e:MouseEvent):void
      {
       stopDrag();
       var scroller:MovieClip = hscrollbar.getChildAt(1) as MovieClip;
       scroller.removeEventListener(Event.ENTER_FRAME, hupdateScrollPosition);
      }
      private function hupdateScrollPosition(e:Event):void {
       var bg:MovieClip = hscrollbar.getChildAt(0) as MovieClip;
       var scroller:MovieClip = hscrollbar.getChildAt(1) as MovieClip;
       var perc:Number = (scroller.x - bg.x) / (bg.width - scroller.width);  
       var xcounter:Number = ( -perc * (content_mc.width - mask_mc.width));
      content_mc.x = xcounter;
      }

     

    This code is reusable for many applications where we want scrollbar. In this code we can dynamically assign the scrollbars based on the content width and height.

     
    |
    Mark as:

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