FlowLayoutPanel 是一個流動的物件容器,會將放入的物件按順序自動依照長寬調整內容排列,如果需要固定排列請看上次的 TableLayoutPanel 篇
只是 FlowLayoutPanel 預設不會顯示捲動條,需要加上下面這行才會顯示,不然當視窗變小時某些物件很可能就會點不到
所有可以用的方式為:
需要注意的是需要先把物件放入 FlowLayoutPanel (第二行),不然會拋出下面的錯誤:
另外 SetChildIndex 是從 0 開始,所以上面範例設定為 5 時應該會跑到第 6 個,且如果當前內部物件數量不足,就只會待在最後一個,後面再有其他成員加入時也不會再替換順序。例如設定為第 10 個,但當前只有兩個,就只會排在第二個,等後續加到總共有 10 個時也不會被移動到第 10 個,而是會待在第二個,除非重新指定。
基本示範
FlowLayoutPanel flowLayoutPanel = new()
{
Dock = DockStyle.Fill, // 填滿容器 (最大化)
};
this.Controls.Add(flowLayoutPanel);
Button button = new();
flowLayoutPanel.Controls.Add(button); // 將 button 加入至 flowLayoutPanel 中
只是 FlowLayoutPanel 預設不會顯示捲動條,需要加上下面這行才會顯示,不然當視窗變小時某些物件很可能就會點不到
flowLayoutPanel.AutoScroll = true;
改變排列方向
排列方向可以透過 FlowDirection 屬性變更,預設為 LeftToRight
// flowLayoutPanel.FlowDirection = FlowDirection.LeftToRight;
flowLayoutPanel.FlowDirection = FlowDirection.TopDown; // 左上開始往下
所有可以用的方式為:
- LeftToRight
- TopDown
- RightToLeft
- BottomUp
排列順序
取得當前物件的順序
前面有提到 FlowLayoutPanel 是將放入的物件按順序顯示,那該怎麼指定呢?
Button btn = new();
flowLayoutPanel.Controls.Add(btn);
flowLayoutPanel.Controls.SetChildIndex(btn, 5); // 指定順序
需要注意的是需要先把物件放入 FlowLayoutPanel (第二行),不然會拋出下面的錯誤:
System.ArgumentException: 'child' 不是此父系的子控制項。
at System.Windows.Forms.Control.ControlCollection.GetChildIndex(Control child, Boolean throwException)
at System.Windows.Forms.Control.ControlCollection.SetChildIndexInternal(Control child, Int32 newIndex)
at System.Windows.Forms.Control.ControlCollection.SetChildIndex(Control child, Int32 newIndex)
at WinFormsAppFlowLayoutPanel.Form1..ctor() in C:\Users\ruyut\Documents\RiderProjects\2023\test\WinFormsAppFlowLayoutPanel\WinFormsAppFlowLayoutPanel\Form1.cs:line 23
at WinFormsAppFlowLayoutPanel.Program.Main() in C:\Users\ruyut\Documents\RiderProjects\2023\test\WinFormsAppFlowLayoutPanel\WinFormsAppFlowLayoutPanel\Program.cs:line 14
另外 SetChildIndex 是從 0 開始,所以上面範例設定為 5 時應該會跑到第 6 個,且如果當前內部物件數量不足,就只會待在最後一個,後面再有其他成員加入時也不會再替換順序。例如設定為第 10 個,但當前只有兩個,就只會排在第二個,等後續加到總共有 10 個時也不會被移動到第 10 個,而是會待在第二個,除非重新指定。
取得當前物件的順序
btn.Click += (_, _) =>
{
MessageBox.Show("index: " + flowLayoutPanel.Controls.IndexOf(btn));
};
留言
張貼留言
如果有任何問題或建議,都歡迎留言或來信: a@ruyut.com