クリップボード変更時のイベント

クリップボード変更に対して、 ClipboardChanged 、 ClipboardChanging 、 ClipboardPasted 、 ClipboardPasting の4つのイベントを使用できます。 ClipboardChanged イベントはクリップボードの変更が起こったとき、および ClipboardChanging イベントはクリップボードが変更されるときに発生します。また、 ClipboardPasted イベントはユーザーがクリップボードから貼り付けたとき、および ClipboardPasting イベントはユーザーがクリップボードから貼り付けるときに発生します。これらのイベントを使用すると、ExcelからSpreadJSへ、ワークシート内およびワークシート間で、テキスト、セルのデータ、画像、チャート、図形、スライサー、カスタムフローティングオブジェクトのコピーおよび貼り付け操作を制御することができます。

また、ソースシートや範囲情報などの値を取得したり、クリップボードの操作がコピーと切り取りのいずれの操作が実行されているかどうかを確認したりすることもできます。

現在、SpreadJSからExcelへのテキスト以外のコピー操作はサポートされていません。

コードの使用

次のサンプルコードは、さまざまなクリップボードイベントを使用します。

<script>
    window.onload = function() {
        // Spreadを初期化します。
        var spread = new GC.Spread.Sheets.Workbook( 'ss', { sheetCount: 1 });

        // クリップボードイベントをバインドします。
        spread.bind(GC.Spread.Sheets.Events.ClipboardChanged, function (sender, args) {
            console.log("ClipboardChanged.");
        });

        spread.bind(GC.Spread.Sheets.Events.ClipboardChanging, function (sender, args) {
            console.log("ClipboardChanging");
        });

        spread.bind(GC.Spread.Sheets.Events.ClipboardPasted, function (sender, args) {
            console.log("ClipboardPasted");
        });

        spread.bind(GC.Spread.Sheets.Events.ClipboardPasting, function (sender, args) {
            console.log("ClipboardPasting");
        });
    };
</script>

使用例

次のケースではクリップボードイベントを使用できます。

ExcelからSpreadJSへのコピーと貼り付け

例えば、Excelに画像、チャート、図形などの複数のオブジェクトがあり、それらのオブジェクトをコピーしてスプレッドシートに貼り付けたいとします。この場合、「allowCopyPasteExcelStyle」プロパティをtrueに設定する必要があります。 ExcelオブジェクトをSpreadJSにコピーする方法については、このトピックを参照してください。

なお、Excel上の画像、チャート、図形などのオブジェクトをコピーした場合は、SpreadJSではすべて画像として処理されます。

次のサンプルコードは、SpreadJS上の画像のみコピーを許可し、Excelなどの外部アプリからSpreadJSに画像をコピーしないように設定します。

<script>
    window.onload = function() {
        // Spreadを初期化します。
        var spread = new GC.Spread.Sheets.Workbook('ss', { sheetCount: 1 });
        // アクティブシートを取得します。
        var activeSheet = spread.getActiveSheet();

        // allowCopyPasteExcelStyleをtrueに設定します。
        spread.options.allowCopyPasteExcelStyle = true;

        // 画像を追加します。
        activeSheet.shapes.addPictureShape("f2", "Capture.PNG", 100, 60, 200, 100);

        // このコードは、外部アプリからSpreadJSへの画像のコピーを防ぎます。
        spread.bind(GC.Spread.Sheets.Events.ClipboardPasting, (e, args) => {
            if ((args.pasteData && args.pasteData.image)) {
                args.cancel = true;
            }
        });
    };
</script>

ワークシート内のコピーと貼り付け

例えば、ワークシート内に画像、チャート、図形などの複数のオブジェクトがあり、画像を除いてすべてのオブジェクトをコピーしてワークシート内に貼り付けたいとします。この場合、クリップボードイベントの「objects」パラメータを使用して、コピーされたオブジェクトが画像かどうかを判断することができます。

以下のコードでは、特定のワークシートからの画像のコピーを防ぎ（ fromSheet パラメータを使用）、誤って切り取り操作をした場合にユーザーに警告する（現在のアクションのタイプを示すGC.Spread.Sheet.ClipboardActionType列挙体を使用）方法を示しています。

// ワークブックとワークシートを構成します。
var spread = new GC.Spread.Sheets.Workbook("ss", { sheetCount: 2 });
var activeSheet = spread.getActiveSheet();

// allowCopyPasteExcelStyleをtrueに設定します。
spread.options.allowCopyPasteExcelStyle = true;

// 画像を追加します。
spread.getSheet(0).pictures.add("f5", " Capture.PNG ", 2, 2, 200, 200);

spread.bind(GC.Spread.Sheets.Events.ClipboardPasting, (e, args) => {
    // このコードは、内部オブジェクトの画像の貼り付けを防ぎます。
    if (args.objects && (args.objects[0] instanceof GC.Spread.Sheets.FloatingObjects.Picture || args.objects[0] instanceof GC.Spread.Sheets.Shapes.PictureShape) && args.fromSheet.name() == "Sheet1") {
        args.cancel = true;
    }
});

spread.bind(GC.Spread.Sheets.Events.ClipboardChanging, (e, args) => {
    // このコードは、偶発的な切り取り操作を防ぎます。
    if (args.action == GC.Spread.Sheets.ClipboardActionType.cut) {
        if (confirm("選択したデータの切り取りを行ってもよろしいですか？") == true) {
            alert("切り取りを実行します。");
        } else {
            alert("切り取りをキャンセルします。");
            args.cancel = true;
        }
    }
});