我正在尝试通过控件包含标题和面板来构建可折叠面板。当有人点击标题时,面板应该折叠/展开。
然而,当我在可折叠面板的主体内添加另一个控件Panel
时,宽度和高度似乎被锁定,因此无法更改。我的理解是禁用AutoSize
允许我自由调整面板的大小,但显然不是。我在这里缺少什么?
internal sealed class CollapsiblePanel : Control
{
private const string DownIconBase64 = "AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAQAQAAAAAAAAAAAAAAAAAAAAAAABAREQCQEREBEBERAJAREQCQEREBEBERAJAREQEQEREAkBERAJAREQEQEREAkBERARAREQCQEREAkBERARAREQCQEREAkBERARAREQEQEREBEBERARAREQEQEREBAYHByQGBwckQEREBEBERARAREQEQEREBEBERARAREQEQEREBEBERAJAREQEQEREBEBERARAREQEQEREBAcHByQBAgLhAQIC4QYHByRAREQEQEREBEBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEQEREBAYHByQBAgLhAQIC/wEBAf8BAgLhBgcHJEBERARAREQEQEREBEBERARAREQCQEREAkBERARAREQEQEREBAYGBiQBAgLhAQIC/wECAt0BAgLfAQEB/wECAuEGBwckQEREBEBERARAREQEQEREBEBERAJAREQEQEREBEBERAQBAgLhAQEB/wECAt8HBwciBwcHIAECAt8BAQH/AQIC4UBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEAQEB/wECAuEGBwciQEREBEBERAQHBwcgAQIC3wEBAf9AREQEQEREBEBERARAREQEQEREAkBERARAREQEQEREBAECAuEGBwckQEREBAYGBiQGBwckQEREBAcHByABAgLfQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERAQGBwckQEREBAYGBiQBAgLhAQIC4QYHByRAREQEBwcHIEBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEQEREBAYHByQBAgLhAQEB/wECAv8BAgLhBgcHJEBERARAREQEQEREBEBERARAREQEQEREAkBERARAREQEQEREBAcHByQBAgLhAQIC/wECAt0BAgLdAQIC/wECAuEGBwckQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERAQBAgLhAQIC/wECAt8HBwciBwgIIAECAt0BAgL/AQIC4UBERARAREQEQEREBEBERARAREQCQEREBEBERARAREQEAQIC/wECAt8HCAgiQEREBEBERAQHCAggAQIC3QECAv9AREQEQEREBEBERARAREQCQEREAkBERARAREQEQEREBAECAuEHBwckQEREBEBERARAREQEQEREBAcICCABAgLdQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERAQGBgYkQEREBEBERARAREQEQEREBEBERARAREQEBwgIIEBERARAREQEQEREBEBERARAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==";
private const string UpIconBase64 = "AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAQAQAAAAAAAAAAAAAAAAAAAAAAABAREQCQEREBEBERAJAREQCQEREBEBERAJAREQEQEREAkBERAJAREQEQEREAkBERARAREQCQEREAkBERARAREQCQEREAkBERARAREQEQEREBAcHByBAREQEQEREBEBERARAREQEQEREBEBERAQGBgYkQEREBEBERARAREQEQEREBEBERAJAREQEQEREBEBERAQBAgLdBwcHIEBERARAREQEQEREBEBERAQGBwckAQIC4UBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEAQIC/wECAt0HBwcgQEREBEBERAQHBwciAQIC3wEBAf9AREQEQEREBEBERARAREQCQEREAkBERARAREQEQEREBAECAuEBAgL/AQIC3QcHByAHCAgiAQIC3wECAv8BAgLhQEREBEBERARAREQEQEREBEBERAJAREQEQEREBEBERAQHBwckAQIC4QECAv8BAgLdAQIC3QECAv8BAgLhBgcHJEBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEQEREBAcHByQBAgLhAQIC/wECAv8BAgLhBwcHJEBERARAREQEQEREBEBERARAREQEQEREAkBERARAREQEQEREBAcICCBAREQEBwcHJAECAuEBAgLhBgcHJEBERAQHBwckQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERAQBAgLdBwgIIEBERAQHBwckBgYGJEBERAQHBwckAQIC4UBERARAREQEQEREBEBERAJAREQCQEREBEBERARAREQEAQEB/wECAt0HCAggQEREBEBERAQGBwciAQIC3wECAv9AREQEQEREBEBERARAREQEQEREAkBERARAREQEQEREBAECAuMBAQH/AQIC3QcICCAHBwciAQIC3wEBAf8BAgLhQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERAQGBgYmAQIC4wEBAf8BAgLdAQIC3QEBAf8BAgLhBgYGJEBERARAREQEQEREBEBERARAREQCQEREBEBERARAREQEQEREBAYGBiYBAgLjAQEB/wECAv8BAgLhBgYGJEBERARAREQEQEREBEBERARAREQCQEREAkBERARAREQEQEREBEBERARAREQEBgYGJgECAuMBAgLhBgcHJEBERARAREQEQEREBEBERARAREQEQEREAkBERAJAREQEQEREBEBERARAREQEQEREBEBERAQGBgYmBwcHJEBERARAREQEQEREBEBERARAREQEQEREBEBERARAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCQEREAkBERAJAREQCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==";
private static readonly Image DownIcon = DownIconBase64.ToImage();
private static readonly Image UpIcon = UpIconBase64.ToImage();
private readonly Button _headerButton;
private readonly Panel _body;
private int _width, _height;
private bool _isCollapsed;
public CollapsiblePanel(string name)
{
_body = new Panel { Dock = DockStyle.Fill, AutoSize = false };
_headerButton = new Button
{
Dock = DockStyle.Top,
Text = name,
TextAlign = ContentAlignment.MiddleLeft,
Image = DownIcon,
ImageAlign = ContentAlignment.MiddleRight,
UseVisualStyleBackColor = false
};
_headerButton.Click += (_, __) =>
{
if (_isCollapsed)
{
Expand();
}
else
{
Collapse();
}
};
Controls.Add(_body);
Controls.Add(_headerButton);
ControlAdded += (_, eArgs) => { _body.Controls.Add(eArgs.Control); };
ControlRemoved += (_, eArgs) => { _body.Controls.Remove(eArgs.Control); };
}
public void Collapse()
{
_width = _body.Width;
_height = _body.Height;
_body.Width = 0;
_body.Height = 0;
_headerButton.Image = UpIcon;
_isCollapsed = true;
}
public void Expand()
{
_body.Width = _width;
_body.Height = _height;
_headerButton.Image = DownIcon;
_isCollapsed = false;
}
}
internal static class Extensions
{
/// <summary>
/// Converts the given <paramref name="base64Input"/> to <see cref="Image"/>.
/// </summary>
public static Image ToImage(this string base64Input)
{
var imageBytes = Convert.FromBase64String(base64Input);
using (var ms = new MemoryStream(imageBytes, 0, imageBytes.Length))
{
return Image.FromStream(ms, true);
}
}
}
答案 0 :(得分:1)
Fill
对接使其能够修复大小。折叠或展开时,您可能想要更改Fill
属性。
public void Collapse()
{
_width = _body.Width;
_height = _body.Height;
_body.Dock = DockStyle.None;
_body.Width = 0;
_body.Height = 0;
_headerButton.Image = UpIcon;
_isCollapsed = true;
}
public void Expand()
{
_body.Width = _width;
_body.Height = _height;
_body.Dock = DockStyle.Fill;
_headerButton.Image = DownIcon;
_isCollapsed = false;
}
答案 1 :(得分:1)
使用像
这样的Visible属性更容易public void Collapse()
{
_body.Visible = false;
_headerButton.Image = UpIcon;
_isCollapsed = true;
}
public void Expand()
{
_body.Visible = true;
_headerButton.Image = DownIcon;
_isCollapsed = false;
}
无需保留_width,_height值来恢复大小。
答案 2 :(得分:0)
将面板的 Dock 属性( _body )设置为无