Skip to content

Instantly share code, notes, and snippets.

@bergwerf
Created April 28, 2017 11:54
Show Gist options
  • Select an option

  • Save bergwerf/1b427ad2b1f9770b260dd4dac295b6f0 to your computer and use it in GitHub Desktop.

Select an option

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
Copy Markdown

Awesome worked

@androidseb

Copy link
Copy Markdown

Thank you very much, this works perfectly!

@deisold

deisold commented Apr 4, 2020

Copy link
Copy Markdown

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

bergwerf commented Apr 4, 2020 via email

Copy link
Copy Markdown
Author

@deisold

deisold commented Apr 4, 2020

Copy link
Copy Markdown

You mean Flutter Web or for server side?

@bergwerf

bergwerf commented Apr 4, 2020

Copy link
Copy Markdown
Author

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

ulkaio commented Jun 5, 2020

Copy link
Copy Markdown

Thanks, this works.

@mahdimaymandi

Copy link
Copy Markdown

Thanks!

@dngo10

dngo10 commented Sep 29, 2020

Copy link
Copy Markdown

Thanks. It works on Angular Dart.

ghost commented Dec 6, 2020

Copy link
Copy Markdown

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

@bergwerf

bergwerf commented Dec 6, 2020

Copy link
Copy Markdown
Author

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
Copy Markdown

@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