Rich UI でのドラッグ・アンド・ドロップ

ユーザーがある場所からウィジェットをドラッグして別の場所にドロップできるように、コードを作成することができます。さらに広範囲に、ユーザーが位置を保持している場合のシングル・マウスダウン・イベント、その後のマウス移動イベント、およびシングル・マウスアップ・イベントなどのユーザー・イベントに、コードで応答できます。ドラッグ・アンド・ドロップで表現されるすべてのランタイム・タスクを実現できます。Rich UI では動作は定義されません。

ドラッグ・アンド・ドロップ・コードを作成するには、ウィジェット宣言で 3 つのプロパティーを指定し、対応するプロパティー値で参照される関数を記述します。例えば、以下にボタンの宣言を示します。
b1 Button { 
   text = "Button 1", position="absolute",	x=10, y=10,
   onStartDrag = start, onDrag = drag, onDropOnTarget = drop};

以下に、ドラッグ・アンド・ドロップを可能にする 3 つのプロパティーを示します。

以下に、ワークスペースに取り込むことのできる例を示します。
import com.ibm.egl.rui.widgets.TextField;

handler MyHandler type RUIHandler{initialUI =[myTextField]}
   myTextField TextField{text = 
                   "What a drag!", position = "absolute", x = 110, y = 210, width = 120, 
                   onStartDrag = start, onDrag = drag, onDropOnTarget = drop};
   dx, dy int;

   function start(myWidget Widget in, x int in, y int in) returns(boolean)
      dx = x - myWidget.x;
      dy = y - myWidget.y;
      return(true);
   end

   function drag(myWidget Widget in, drop Widget in, x int in, y int in)
      myWidget.x = x - dx;
      myWidget.y = y - dy;
   end

   function drop(widget Widget in, drop Widget in, x int in, y int in)
   end
end  
start 関数は、マウス・ポインターの位置とウィジェットの左上隅との差を計算します。その計算を使用する効果は、操作の間中、マウス・ポインターがウィジェット上の同じ位置に表示されることです。この効果を確認するには、コードを 2 回実行して、いずれもウィジェットの右下隅 をクリックしてドラッグ・アンド・ドロップ・オペレーションを開始します。
  1. 示したようにコードを実行します。
  2. drag 関数内のステートメントに次の代入を行った後でのみ、コードを実行してください。
       myWidget.x = x;
       myWidget.y = y;

追加の例が、『Rich UI Shadow』にあります。


フィードバック