Skip to content

Instantly share code, notes, and snippets.

@bergwerf
Created April 28, 2017 11:54
Show Gist options
  • Save bergwerf/1b427ad2b1f9770b260dd4dac295b6f0 to your computer and use it in GitHub Desktop.
Save bergwerf/1b427ad2b1f9770b260dd4dac295b6f0 to your computer and use it in GitHub Desktop.
Copy to clipboard for Dart
/// A hack to copy a string to the clipboard.
bool _copyToClipboardHack(String text) {
final textarea = new TextAreaElement();
document.body.append(textarea);
textarea.style.border = '0';
textarea.style.margin = '0';
textarea.style.padding = '0';
textarea.style.opacity = '0';
textarea.style.position = 'absolute';
textarea.readOnly = true;
textarea.value = text;
textarea.select();
final result = document.execCommand('copy');
textarea.remove();
return result;
}
@theindianappguy
Copy link

Awesome worked

@androidseb
Copy link

Thank you very much, this works perfectly!

@deisold
Copy link

deisold commented Apr 4, 2020

I'm running Flutter (Channel master, v1.16.3-pre.56, on Mac OS X 10.15.3 19D76, locale de-DE)
• Flutter version 1.16.3-pre.56
• Framework revision 8857c4cec8 (9 days ago), 2020-03-25 21:21:01 -0400
• Engine revision b235233e9d
• Dart version 2.8.0 (build 2.8.0-dev.17.0 2323087237)

and getting FALSE from the document.execCommand('copy'); (the text is not copied)

Do you guys have any idea?

@bergwerf
Copy link
Author

bergwerf commented Apr 4, 2020 via email

@deisold
Copy link

deisold commented Apr 4, 2020

You mean Flutter Web or for server side?

@bergwerf
Copy link
Author

bergwerf commented Apr 4, 2020

Any HTML website. It uses document from dart:html (which is effectively a proxy for the JavaScript document object). This code is similar to JavaScript snippets to copy text to the clipboard (might only work after events like click to prevent websites from altering the clipboard without the user noticing it).

@ulkaio
Copy link

ulkaio commented Jun 5, 2020

Thanks, this works.

@mahdimaymandi
Copy link

Thanks!

@dngo10
Copy link

dngo10 commented Sep 29, 2020

Thanks. It works on Angular Dart.

Copy link

ghost commented Dec 6, 2020

Thanks. it Works.
But it would be better if its not hacky.
How can we do it using the navigator's clipboard feature?

@bergwerf
Copy link
Author

bergwerf commented Dec 6, 2020

How can we do it using the navigator's clipboard feature?

You can directly access the clipboard API in Dart. Note that you can only alter the clipboard in response to user events (this is a safety measure).

<button id="copy">Copy!</button>
import 'dart:html';

void main() {
  document.querySelector('#copy').onClick.listen((_) {
    window.navigator.clipboard.writeText("Hello, World!");
  });
}

@vakenbolt
Copy link

@bergwerf Thanks for posting a clipboard API example in dart. 💯 🙌 🍻

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment