[Tips] コントロールをドラッグで移動する

2015.08.192019.12.02

フォーム上に配置されたコントロールをマウスで移動する方法です。

今回はフォームに配置されたTextBoxをマウスでドラッグできるようにします。

ドラッグ中は、ドラッグしていることがわかるように黒い枠線を表示するようにします。

画面のデザインは以下のようにします。

コードは以下の通りです。

bool _isDraging = false;
 Point? _diffPoint = null;

 private void textBox1_MouseDown(object sender, MouseEventArgs e)
 {
     if (e.Button != MouseButtons.Left)
     {
         return;
     }
     Cursor.Current = Cursors.Hand;
     _isDraging = true;
     _diffPoint = e.Location;

     panel1.Size = textBox1.Size;
     panel1.Location = textBox1.Location;

     panel1.Visible = true;
 }

 private void textBox1_MouseMove(object sender, MouseEventArgs e)
 {
     if (!_isDraging)
     {
         return;
     }

     int x = textBox1.Location.X + e.X - _diffPoint.Value.X;
     int y = textBox1.Location.Y + e.Y - _diffPoint.Value.Y;

     if (x <= 0) x = 0;
     if (y <= 0) y = 0;

     panel1.Location = new Point(x, y);
 }

 private void textBox1_MouseUp(object sender, MouseEventArgs e)
 {
    Cursor.Current = Cursors.Default;
     _isDraging = false;

     panel1.Visible = false;

    if (e.Button != MouseButtons.Left)
     {
         return;
     }

    textBox1.Location = panel1.Location;
 }

■MouseDownイベント
■MouseMoveイベント
■MouseUp

■MouseDownイベント

まず、TextBox上でマウスの左が押された場合はカーソルのアイコンを手のマークに変更します。
また、ドラッグが開始されたということを示すために、_isDragging変数をtrueにします。
マウスの開始位置を_diffPointに格納し、ドラッグ中（MouseMoveイベント）の計算で使用します。
フォームに配置しておいたPanelコントロールはTextBoxの移動中イメージとして使用します。
よって、PanelコントロールのサイズをTextBoxコントロールと同一にして、現在TextBoxが表示されている位置に表示します。

■MouseMoveイベント

if文で現在ドラッグ中かを判断します。
ドラッグ中である場合は、ドラッグ位置にPanelコントロールが表示されるようにXとYの位置を計算します。
マウスの位置がX <= 0とY <= 0の場合は、それ以下の位置にならないように調整しています。

■MouseUp

マウスカーソルの形状を元に戻し、ドラッグが終了されたことを示すために_isDraggingをfalseに設定します。
移動中イメージとして使用していたPanelを非表示にします。
マウスの左ボタン以外のマウスアップは無視しています。
最後にTextBoxの位置が、移動されたPanelの位置になるように設定します。

Please follow and like us: