11 Replies Latest reply on Mar 15, 2014 3:12 PM by kglad

    Drag Scrolling Textbox?

    xp3tp85

      I am looking for the AS3 code for a textbox that scrolls by dragging similar to that on an iPhone. I DO NOT want a scroll bar. I just want to be able to scroll through the text by dragging it up and down or side to side. I haven't found any complete code for this anywhere online so if someone can give me the complete AS3 code for this, that would be awesome! Thanks!

        • 1. Re: Drag Scrolling Textbox?
          moccamaximum Level 5

          you can simply turn off the scrollPolicies of a textArea Component:

           

          //with a TextArea Component instance _ta on stage

           

          _ta.verticalScrollPolicy = "off";

          _ta.horizontalScrollPolicy = "off";

           

          this will hide the UIScrollbar and make the dragging you described available by clicking down inside the textarea and moving your mouse accordingly

          • 2. Re: Drag Scrolling Textbox?
            xp3tp85 Level 1

            I'm not using a Textarea Component. I am using the Text Tool. Is there a way that I could just type the text, convert it to a movie clip, and make it scrollable by dragging? This is for an iPhone app if that helps.

            • 3. Re: Drag Scrolling Textbox?
              kglad Adobe Community Professional & MVP

              yes.

               

              right click your textfield>convert to symbol>movieclip.

               

              add a mousedown listener that adds and enterframe loop which calls a function that scrolls your textfield based on mouse position and add a stage mouseup listener to terminate the loop.

              1 person found this helpful
              • 4. Re: Drag Scrolling Textbox?
                xp3tp85 Level 1

                Could you give me the actionscript for it so that I can copy and paste? I am a beginner with code still.

                • 5. Re: Drag Scrolling Textbox?
                  kglad Adobe Community Professional & MVP

                  var m,b:Number;

                  paramF(10,0,tf.height-10,tf.maxScrollV);

                   

                  tf.addEventListener(MouseEvent.MOUSE_OVER,overF);

                  tf.addEventListener(MouseEvent.MOUSE_OUT,outF);

                  function overF(e:MouseEvent):void{

                      this.addEventListener(Event.ENTER_FRAME,tfF);

                  }

                  function outF(e:MouseEvent):void{

                      this.removeEventListener(Event.ENTER_FRAME,tfF);

                  }

                  function tfF(e:Event):void{

                      tf.scrollV = Math.min(tf.maxScrollV,Math.max(0,Math.round(m*tf.mouseY+b)));

                  }

                   

                  function paramF(x1:Number,y1:Number,x2:Number,y2:Number):void{

                      m = (y1-y2)/(x1-x2);

                      b = y1-m*x1;

                  }

                  1 person found this helpful
                  • 6. Re: Drag Scrolling Textbox?
                    xp3tp85 Level 1

                    Okay, I tried this code but nothing happened on click or drag. Again, I am using the Text Tool, not a textbox. I want it to scroll with my finger as though I were dragging it on an iPhone or Android. Here is a screenshot..

                     

                    Untitled.png

                    • 7. Re: Drag Scrolling Textbox?
                      kglad Adobe Community Professional & MVP

                      here's code for that but you'll probably need to hire someone to implement it in your project.  i took the code from an ios project i made for a client last year/*

                       

                       

                      code.jpg

                      • 8. Re: Drag Scrolling Textbox?
                        xp3tp85 Level 1

                        So if I type this into my ActionScript, it will make the textbox draggable using the mouse? I will try it. I hope it works!

                        • 9. Re: Drag Scrolling Textbox?
                          kglad Adobe Community Professional & MVP

                          no, you have to adapt that to your situation. 

                           

                          in all cases, you'll need a mask for you movieclip and to use that code there are some paramenters you need to define and a tween class (i used tweenlite) to add.

                          • 10. Re: Drag Scrolling Textbox?
                            xp3tp85 Level 1

                            I would have to adapt it, I knew that much already but not how to do that exactly.

                             

                            I am thinking I might just stop trying to make it draggable and just make pages using frames instead. That would be much easier for me, just not for the user. Thank you for the help you have given though! I will definitely come to you if I have other questions!

                            • 11. Re: Drag Scrolling Textbox?
                              kglad Adobe Community Professional & MVP

                              you're welcome.