← Back

TouchDesigner でのドラッグ&ドロップについて

Date
2019-09-21

概要

TouchDesignerでのドラッグアンドドロップについて学んでいきます。

[公式Wiki](https://docs.derivative.ca/Drag-and-Drop)

TouchDesignerでのD&D

読み込み可能ファイルのインポート

drop movie

ネットワークエディタに対してTouchDesignerで読み取れるファイル形式をドロップすることで対応するオペレータでそのファイルを読み取れるのはよく知られていると思います。

オペレータをエクスポート

drop op

ネットワークエディタ上にあるオペレータをデスクトップなどにドロップすると対応するファイル形式で保存されます。

ほかのTouchDesignerのネットワークエディタにコピー

drop tdtotd

サンプルファイルから引っ張ってくるときとかに便利 (なぜか接続切れたところがありますが…)

Panel Components でのD&D

上記の例はネットワークエディタ上で行えるものですが自分で作ったUIに対しては自分でカスタマイズしてドラッグアンドドロップに対する処理を行うことができます。

Drop Script

COMPのドロップスクリプトは他のCOMPやファイルがドロップされたときに実行されます。

Drag Script

COMPがドラッグが始まったときに実行されます。

デフォルトでは /sys/drag, /sys/dropになっていますがちょっと解説するには長かったので今回は省略します。

Setting

par

Containerを作り、パラメータのDrag&Dropのタブで以下のように変更します。

取得できる値

Drag

args args[0] ドラッグされたオペレータの名前 args[1] ドラッグされているオペレータのインデックス args[2] ドラッグされているオペレータの数 args[3] オペレータの種類 args[4] ドラッグされているオペレータの親のパス

Drop

args args[0] ドロップされたNodeの名前、CHOPのチャンネル名またはファイル名(ドロップされたものによる) args[1] マウスが離されたときのX座標 args[2] マウスが離されたときのY座標 args[3] ドロップされたもののインデックス args[4] ドロップされたものの総数 args[5] オペレータの種類、又は拡張子 args[6] ネットワークのフルパス、又は args[7] ドラッグされたCOMP

DD example

drag, drop ともに、print(args)と書き込みドラッグアンドドロップをしてみた例

実例

TouchDesignerでUIに動画ファイルやTOXファイルをドラッグアンドドロップして読み込む方法、およびUI上でCOMPをドラッグアンドドロップで操作できるもの

こんな感じの

TD dropBank

ファイル

TD_DD.zip

上で学んだD&Dの知識で実現することができます。 ドロップされたファイルの拡張子やパス、Containerの名前などから行う処理を決めています。 Movie、Toxどちらも対応しているBankになっています。