1 Reply Latest reply on Sep 21, 2006 4:43 AM by Newsgroup_User

    Simple Custom Text Scroll Bar

    martynrlee
      Hey All,

      Can anyone help me with this:

      I am struggling to find some basic code to use a draggable graphic (.psd) as a scrollbar for a text box. I do however need the scrollbar to control 3 text boxes (all in the same motion, same speed etc) so that I can use rollovers/hyperlinks within the text area that im trying to scroll.

      I have created a window around the text with the z values higher than the text so that the text will scroll 'under' the window.

      All help most appreciated with this one..

      Mart.

        • 1. Re: Simple Custom Text Scroll Bar
          Level 7
          Hi Mart,

          A very simple text scroller can be made by using the scrolltop property
          of the text or field member.

          The total distance that a text or field member can be scrolled is the
          difference between the height of the member and the height of the sprite
          that shows that member on the stage.

          Place a text or field member instance on the stage. Set the member's
          framing property to "fixed".

          You could use a behavior something like this attached to the scroll
          button that you want to use. You will also need a constrainer sprite, a
          bar, to run the scroll button against.

          --------
          property thisSprite -- the slider sprite
          property constrainerSprite -- the constrainer bar sprite
          property spriteToScroll -- the text or field sprite to be
          scrolled
          property totalScrollDistance -- the difference in pixels between the
          member height and the sprite height
          property constrainerHeight -- the height of the constrainer bar
          sprite
          property constrainerBottom -- the bottom locV of the constrainer
          sprite
          property animateMe -- a boolean variable to turn off and
          on the scrolling calculation

          on getPropertyDescriptionList
          myPropList = [:]
          myPropList.addProp(#constrainerSprite,[#comment:"enter the sprite
          channel number for the constrainer line
          sprite:",#format:#integer,#default:""])
          myPropList.addProp(#spriteToScroll,[#comment:"enter the sprite channel
          number for the sprite to be scrolled:",#format:#integer,#default:""])
          return myPropList
          end

          on beginSprite me
          thisSprite = me.spriteNum
          totalScrollDistance = sprite(spriteToScroll).member.height -
          sprite(spriteToScroll).height
          constrainerHeight = sprite(constrainerSprite).height
          constrainerBottom = sprite(constrainerSprite).bottom
          animateMe = false
          sprite(spriteToScroll).member.scrollTop = 0
          end

          on mouseDown me
          animateMe = true
          end

          on mouseUp me
          animateMe = false
          end

          on mouseUpOutside me
          animateMe = false
          end

          on exitFrame em
          if animateMe then
          sprite(thisSprite).locV = the mouseV
          -- get the position of this scroller on the constrainer bar as a
          ratio...
          buttonPosition = (constrainerBottom -
          float(sprite(thisSprite).locV)) / constrainerHeight
          sprite(spriteToScroll).member.scrollTop = totalScrollDistance *
          buttonPosition
          end if
          end
          -------------

          You can have this same scroll button control more than one text or field
          sprite by adding a property for each one, and a property for each one's
          scroll distance. then set the scrolltop for each additional sprite by
          adding new lines to the exitFrame function.

          --
          Rob
          _______
          Rob Dillon
          Adobe Community Expert
          http://www.ddg-designs.com
          412-243-9119

          http://www.macromedia.com/software/trial/