Flutter, JS, Java - How to copy text to the clipboard - Example code

The Clipboard is a minimal and independent integration point between all apps in any Operating System to copy text. Having copy functionality saves time of the user to select the desired text. Below you have examples of how to copy text to the clipboard in Flutter, Java Desktop (using AWT), and JavaScript.

Flutter

In Flutter, you can use the `flutter/services.dart` package to interact with the clipboard:

import ‘package:flutter/material.dart’;
import ‘package:flutter/services.dart’;

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text(‘Flutter Clipboard Example’),
),
body: Center(
child: ElevatedButton(
onPressed: () {
Clipboard.setData(ClipboardData(text: “Hello, Clipboard!”));
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(‘Copied to Clipboard’)),
);
},
child: Text(‘Copy Text’),
),
),
),
);
}
}

Web/JavaScript

On the web there are multiple ways to archive copy to clipboard. The more modern API is the Clipbboard: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API.

<!DOCTYPE html>
<html>
<head>
  <title>Clipboard Example</title>
</head>
<body>
  <button onclick="copyToClipboard()">Copy Text</button>
  <script>
    function copyToClipboard() {
      const text = "Hello, Clipboard!";
      navigator.clipboard.writeText(text).then(() => {
        alert('Copied to Clipboard');
      }).catch(err => {
        console.error('Failed to copy text: ', err);
      });
    }
  </script>
</body>
</html>

There are still old browsers out there that do not support the newer APIs: https://caniuse.com/?search=clipboard. To resolve this – you may use older commands with a temporary object:

var textArea = document.createElement(“textarea”);
textArea.value = $0; document.body.appendChild(textArea);
textArea.focus();
textArea.select();
try {
var successful = document.execCommand(‘copy’);
var msg = successful ? ‘successful’ : ‘unsuccessful’;
console.log(‘Fallback: Copying text command was ‘ + msg);
} catch (err) {
console.error(‘Fallback: Oops, unable to copy’, err);
}
document.body.removeChild(textArea);

Java

I’ve personally used – in Vaadin Web apps – the executeJs API and copy to clipboard using JavaScript. But, generally – Java on the Front-End is in decline. Applet (and adove Flash) technologies are gone. Today you must publish your apps to the app stores. On all platforms – you must comply and adapt to security and privacy policies and permissions. Java just didn’t evolve to the modern UI.

Using Java’s AWT package, you can interact with the system clipboard.

import java.awt.datatransfer.*;
import java.awt.Toolkit;

public class ClipboardDemo {

public static void main(String[] args) {
String text = “Hello, Clipboard!”;

// Get the system clipboard
Clipboard clipboard = Toolkit.getDefaultToolkit().getSystemClipboard();

// Create a StringSelection with the text
StringSelection selection = new StringSelection(text);

// Set the clipboard contents
clipboard.setContents(selection, null);

System.out.println(“Text copied to clipboard: ” + text);
}
}

These examples demonstrate how to copy a simple string (“Hello, Clipboard!”) to the clipboard in Flutter, Java Desktop, and JavaScript. It is small, but also – the most low investment utility to increase user experience.