6 Replies Latest reply on Sep 6, 2006 5:20 PM by thunder.scripts

    Editable text inside draggable movie clip

    thunder.scripts
      I am dinamically creating textfields inside movie clips. Those movie clips are all dragabble (startDrag).

      The problem is that those textfields are supposed to be editable (input type) but once I attach startDrag to them, it's impossible for them to get the focus, hence they are not editable. I tried manually setting the focus on release, but it didn't work (Selection.setFocus(_root.movieclip.textfield)).

      Any help will be rrrrreally appreciated :D
        • 1. Re: Editable text inside draggable movie clip
          Rothrock Level 5
          This is the classic the-child-of-a-parent-clip-isn't-receiving- insert-mouse-event-here problem. Since the text field is inside the parent movieclip there is no pixel of the textfield that isn't also a pixel of the parent. So there is no place to click that won't be intercepted by the onPress or whatever handler it is – I don't think it is the startDrag per se, maybe I"m wrong?

          In any event probably the easiest solution would be to add another clip. Create a parent clip, create a "background" clip inside the parent, and create your text field inside the parent, but at a higher depth than the background clip. Then attach your event handler to the background clip, but tell it to this._parent.startDrag(). Should work just fine.
          • 2. Editable text inside draggable movie clip
            thunder.scripts Level 1
            Thanks for your answer!
            I think I understood what you said, but the dragging doesn't work. I've attached the code I used.

            EDIT: the code is inside a loop to create many elements, that's why I named the movieclip "mc"+i.
            • 3. Re: Editable text inside draggable movie clip
              Rothrock Level 5
              Well there does have to be some pixels in the bg clip! (Got to tease you just a bit, because I run into this ALL the time.)

              Some how folks don't take the method at its word. createEmptyMovieClip() does just that. It creates and empty movie clip. There are no pixels in it so there is nothing to onPress.

              Also I've got a little trick for you – you didn't ask for it, but it is still free. :)

              If you use the MovieClip class' method for createEmptyMovieClip() it will return a reference to the newly create clip. You can assign that reference to a variable and use it again and again. To my eye it makes the code easier to read and maintain. So your code would change to something like:

              var curClip=this.createEmptyMovieClip("mc"+i,1000+i);
              curClip.createEmptyMovieClip("bg",100);
              curClip.createTextField("myText",2,20,20,"auto","auto");
              curClip.myText.text="default value";
              curClip.bg.onPress=function(){
              this._parent.startDrag();
              }
              and so on.

              Also I personally think getNextHighestDepth() is a disaster waiting to happen so I personally never use it.
              • 4. Re: Editable text inside draggable movie clip
                thunder.scripts Level 1
                I think I understood what you said, but it's still not working.

                I drew a rectangle inside bg (using beginFill, lineTo, etc) and indeed, the dragging works when I click on any part of it. But it does not work when I press on the textfield itself, even though the rectangle is in the background. Changing levels gave me the same old problem: non-editable text.

                I need to be able to drag the textfields by clicking on themselves. Any ideas for that?
                • 5. Re: Editable text inside draggable movie clip
                  Rothrock Level 5
                  Oh. I don't think you can. Since the input field relies on the ability of the user to click into it I think it will always intercept the mouse event if it can. And otherwise something else will intercept it and then you won't be able to do the input.

                  There may be some very involved ways to develop some hitTesting and timers and so forth to make it work. But simply from a functionality perspective I'm not sure that the end user will understand it all.

                  Generally I think that there should be some border or background that the user will understand is "the draggable" part. If you are trying to emulate something like textboxes in Microsoft Word you will need to make something where you enter text edit mode with a double click and/or box/frame edit mode to do things like move it around.

                  This is going to get a lot more complex, but is also totally doable, but the functionality really needs to be worked out clearly before you begin. It is kind of like the story about forgetting that you started out to drain the swamp when you're up to your behind in alligators!
                  • 6. Re: Editable text inside draggable movie clip
                    thunder.scripts Level 1
                    Yeah, I started thinking about that when I last posted.

                    I finally decided I would just add a small bullet in one corner as a hotspot to drag the textfield.

                    Thanks for everything!