.NET 元件控件實戰系列 (四) 上：下拉浮動層 DropdownComponent 與可移動元件 MovableComponent

應用場景：多欄下拉框與下拉文字編輯

ComboBox 單欄、無搜尋；TextBox 空間不足。解決方案：點擊下拉 → 顯示浮動層 (可含 DataGridView、RichTextBox 等任意控件)。

三大元件架構

• DropdownComponent：處理下拉顯示/隱藏浮動控件。
• MovableComponent：滑鼠拖曳移動控件 (標題列拖曳視窗)。
• ResizableComponent：滑鼠拖曳邊緣調整大小 (下篇詳述)。

DropdownComponent 實作要點

1. 監聽 ComboBox.DropDown 事件 → 顯示浮動控件。
2. 浮動控件 Leave 事件 → 自動隱藏 (可關閉)。
3. ComboBox.DropDownHeight = 1 隱藏原生下拉框 (設 0 無效)。
4. 計算螢幕絕對座標：遞迴累加 Parent.Left/Top 至 Form，確保浮動層不被容器裁切。
5. 邊界檢查：超出表單右/下邊界時自動向左/上位移，並可選擇自動調整寬度 (FloatControlWidthMode.AutoWidth)。
6. 將浮動控件 Form.Controls.Add() 置於最上層 (BringToFront)，避免被遮擋。
7. 公開 ShowFloatControl/HideFloatControl 供外部程式碼觸發。
8. 提供 FloatControlDisplayChanging/Changed 事件供攔截與擴充。

核心程式碼片段

void TargetComboBox_DropDown(object sender, EventArgs e)
{
    if (m_FloatControl != null) ShowFloatControl(m_TargetComboBox, m_FloatControl);
}

public void ShowFloatControl(Control dropdown, Control floatCtrl)
{
    // 邊界計算、加入 Form.Controls、BringToFront、Select()
    // 觸發 DisplayChanging/Changed 事件
}

MovableComponent 核心邏輯

1. 區分 HandleControl (接收滑鼠事件，如標題列) 與 MovableControl (實際移動目標，如整個 Panel)。
2. MouseEnter 依 MoveableDirection (All/Horizontal/Vertical) 設定游標 (SizeAll/SizeWE/SizeNS)。
3. MouseDown 記錄 Control.MousePosition。
4. MouseMove (左鍵) 計算位移 → 更新 MovableControl.Location，依方向限制 X/Y。
5. MouseLeave 恢復預設游標。

IExtenderProvider 讓子控件可選擇響應

• 實作 CanExtend (判斷是否為 HandleControl 後代)、Get/SetHandleMove。
• 設計時自動為子控件新增 MovableComponent1.HandleMove 布林屬性。
• 標題列圖示/文字設 true，關閉按鈕設 false，避免點擊關閉卻觸發拖曳。

原始碼下載

https://www.bianceng.net/dotnet/201212/730.htm