Copy TextField text to System clipboard | Actionscript (AS2 + AS3) Tutorial

Google Buzz

Overview

Integrating the clipboard of the operating system with your flash projects is sometimes essential. It’s a very simple and boils down to one basic method… System.setClipboard(). I’ve found a couple other things help the user experience though, such as selecting the text that gets copied and giving the user some sort of feedback to let them know that the text was successfully copied. Here’s a simple way to do it. Have any suggestions to make it better?

I’ve included an as2 version as well as as3. I’ve promised myself to migrate to as3, so I’m not coding anything in 2 that I don’t do in 3 also. This was to discourage me from coding in as2 and to encourage me to code as3, but also let me learn by doing it in both to see the actual differences if I was stuck doing a project in as2. I figured this could help others see the differences between the two versions of actionscript a bit easier and make their own migration as well!

Steps

  1. copy to OS clipboard = System.setClipboard(“Text to COPY”) of System.setClipboard(textBoxToCopy.text)
  2. set selection to text that is copied
  3. give user feedback

Examples and Source

AS2

Get Adobe Flash player

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
textBox.textBox.text = "Click this text box to copy the text or click the COPY button below. You will see feedback to the user and this text copied to your clipboard!\n\n"+
'copyButton.onRelease = textBox.onPress = function(){\n\tSelection.setFocus("textBox");\n\tSelection.setSelection(0, textBox.text.length);\n\tSystem.setClipboard(textBox.text);\n\ttrace("copied: "+textBox.text);\n\tfeedback("Text Copied!");\n}';

copyButton.onRelease = textBox.onPress = function(){
  Selection.setFocus("textBox.textBox");
    Selection.setSelection(0, textBox.textBox.text.length);
  System.setClipboard(textBox.textBox.text);
  trace("copied: "+textBox.textBox.text);
  textFeedback("Text Copied!");
}

function textFeedback(theFeedback:String){
  feedback.text = theFeedback;
  setTimeout(function(){feedback.text="";}, 1200);
}

AS3

Get Adobe Flash player

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
textBox.text = "Click this text box to copy the text or click the COPY button below. You will see feedback to the user and this text copied to your clipboard!\n\n"+
'function copyText(e:MouseEvent):void{\n\ttextBox.setSelection(0, textBox.text.length)\n\tSystem.setClipboard(textBox.text);\n\ttrace("copied: "+textBox.text);\n\ttextFeedback("Text Copied!");\n}';

//set it so the textBox selection will show even when textBox has no focus
textBox.alwaysShowSelection = true;

textBox.addEventListener(MouseEvent.CLICK, copyText);
copyButton.addEventListener(MouseEvent.CLICK, copyText);

function copyText(e:MouseEvent):void{
  textBox.setSelection(0, textBox.text.length)
  System.setClipboard(textBox.text);
  trace("copied: "+textBox.text);
  textFeedback("Text Copied!");
}

function textFeedback(theFeedback:String):void {
  feedback.text = theFeedback;
  setTimeout(function(){feedback.text="";}, 1200);
}

Download

Source files: clipboard_as3.fla clipboard_as2+as3.zip

  • del.icio.us
  • Digg
  • email
  • Facebook
  • FriendFeed
  • Google Bookmarks
  • Hexosearch
  • LinkedIn
  • Mixx
  • Print
  • PDF
  • StumbleUpon
  • Technorati
  • Twitter
  • RSS
This entry was posted in tutorial and tagged , , , , , , , , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

14 Comments

  1. Mothmenace
    Posted 17 November 2008 at 12:44 pm | Permalink

    Nice tutorial – many thanks.

    You should include the “import flash.system.*” though.

  2. Posted 3 December 2008 at 2:00 pm | Permalink

    Most helpful – thanks.

    I don’t get the highlighted text effect after copying however – could it me a Mac thing?

    Thanks anyways …

  3. knuckfubuck
    Posted 4 December 2008 at 7:48 pm | Permalink

    Great tutorial. Exactly what I was looking for. Thanks.

  4. Posted 12 December 2008 at 4:33 am | Permalink

    Great work

    Thanks

  5. Posted 29 January 2009 at 5:01 am | Permalink

    Thanks, it helps!

  6. jo
    Posted 11 February 2009 at 9:10 am | Permalink

    hey, this helped me a lot!! thanx so much….rock on!

  7. fakir
    Posted 17 March 2009 at 9:18 am | Permalink

    Thank you!

  8. Joe
    Posted 15 April 2009 at 7:49 am | Permalink

    Thanks! Very well done – exactly what I was looking for. Thanks again, and have an AWESOME week.

    joeFREELANCE

  9. ddee
    Posted 23 April 2009 at 9:16 am | Permalink

    Spot on, great solution!
    Thanks

  10. Joey
    Posted 9 August 2009 at 5:03 pm | Permalink

    Awesome tutorial. And also a big thank’s to Mothmenace who added the import!

    Many thanks

  11. Posted 29 October 2009 at 9:41 am | Permalink

    is there a solution to copy a jpeg into the clipboard using as3

  12. Srikanth
    Posted 22 November 2009 at 4:18 pm | Permalink

    Thanks a lot! Great Tutorial.

    Is there a way to copy the Current URL to the System Clipboard?

  13. Jamus
    Posted 1 February 2010 at 12:14 pm | Permalink

    Awesome. Very helpful.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>