C# WinForms 執行期控件設計器實作 (一)

在 WinForms 應用程式執行期實現類似 Visual Studio 設計器的功能：控制項拖曳建立、自由移動、右鍵刪除、屬性視窗綁定修改。本文提供核心程式碼架構與關鍵事件處理邏輯。

核心功能模組

1. 工具箱面板：包含可拖曳的按鈕原型 (Button)，支援顯示/隱藏切換。
2. 設計畫布：接收拖放 (DragEnter/DragDrop)，建立新控制項並附加事件。
3. 屬性視窗：綁定當前選中控制項，即時編輯 Text 等屬性。
4. 右鍵選單：提供刪除、複製等操作。

關鍵程式碼片段

1. 工具箱按鈕起始拖放

private void ToolboxButton_MouseDown(object sender, MouseEventArgs e)
{
    if (e.Button == MouseButtons.Left)
    {
        var btn = (Button)sender;
        btn.DoDragDrop(btn, DragDropEffects.Copy);
    }
}

2. 畫布接收拖放並建立控制項

private void DesignSurface_DragEnter(object sender, DragEventArgs e)
{
    e.Effect = DragDropEffects.Copy;
}

private void DesignSurface_DragDrop(object sender, DragEventArgs e)
{
    var srcBtn = (Button)e.Data.GetData(typeof(Button));
    var newBtn = new Button
    {
        Text = srcBtn.Text + "--" + _counter++,
        ContextMenuStrip = ctxMenu,
        Parent = designPanel
    };
    // 座標轉換：螢幕 → 畫布用戶區
    var pt = designPanel.PointToClient(MousePosition);
    newBtn.Location = pt;

    // 附加共用事件處理器
    newBtn.Click += Control_Click;
    newBtn.MouseDown += Control_MouseDown;
    newBtn.MouseMove += Control_MouseMove;
    newBtn.MouseUp += Control_MouseUp;

    designPanel.Controls.Add(newBtn);
}

3. 控制項拖曳移動邏輯 (共用事件)

Point _dragOffset;
Control _draggingCtrl;

private void Control_MouseDown(object sender, MouseEventArgs e)
{
    if (e.Button == MouseButtons.Left)
    {
        _draggingCtrl = (Control)sender;
        _dragOffset = new Point(e.X, e.Y);
        _draggingCtrl.Capture = true;
    }
}

private void Control_MouseMove(object sender, MouseEventArgs e)
{
    if (_draggingCtrl != null)
    {
        var pt = _draggingCtrl.PointToScreen(new Point(e.X, e.Y));
        pt = designPanel.PointToClient(pt);
        pt.Offset(-_dragOffset.X, -_dragOffset.Y);
        _draggingCtrl.Location = pt;
    }
}

private void Control_MouseUp(object sender, MouseEventArgs e)
{
    _draggingCtrl = null;
}

4. 屬性視窗綁定

private void Control_Click(object sender, EventArgs e)
{
    var ctrl = (Control)sender;
    propertyGrid.SelectedObject = ctrl; // 或手動綁定 TextBox.Text = ctrl.Text
    lblPropertyTitle.Text = ctrl.Name + " 屬性";
}

5. 右鍵刪除

private void MenuItem_Delete_Click(object sender, EventArgs e)
{
    _selectedControl?.Dispose();
    _selectedControl = null;
}

擴充方向

• 序列化/反序列化：將設計器狀態儲存為 JSON/XML，下次載入還原。
• 對齊網格/吸附線：移動時計算與其他控制項邊緣距離，自動對齊。
• Z-Order 管理：置頂/置底/上移/下移。
• 多選與群組：Ctrl+Click 多選，框選區域，群組移動。
• 自訂控制項設計器：實作 IDesigner 整合進 VS 設計期。

此架構為輕量級執行期設計器奠定基礎，可根據業務需求逐步擴充為完整的低代碼/報表設計平台。