.net - flowlayoutpanel c# ejemplos

FlowLayoutPanel-Ancho automático para los controles?

Question

¿Es posible hacer que los elementos insertados en FlowLayoutPanel sean del tamaño automático del FlowLayoutPanel? Aquí hay un ejemplo:

Un formulario con 1 FlowLayoutPanel y 3 botones dentro:

si cambio el tamaño del formulario, los controles se ven así: organizan "de izquierda a derecha"

Lo que quiero es esto: los controles deben tener el ancho del FlowLayoutPanel:

¿Alguna idea de como hacer esto? Cambié el FlowDirection y jugué con la propiedad Anchor pero sin suerte.

Por supuesto, podría cambiar el tamaño de los controles en el evento FlowLayoutPanel_Resize, pero quiero agregar unos 500 controles de usuario, lo probé y es lento.

Answer 1

El FlowLayoutPanel organiza los controles de una manera particular, de acuerdo con MSDN :

... para direcciones de flujo vertical, el control FlowLayoutPanel calcula el ancho de una columna implícita desde el control infantil más ancho de la columna . Todos los otros controles en esta columna con propiedades de anclaje o base están alineados o estirados para ajustarse a esta columna implícita. El comportamiento funciona de manera similar para direcciones de flujo horizontal.

No es lo ideal, pero puedes hacerlo de forma nativa, siempre y cuando un control secundario esté configurado con el mismo ancho que el contenedor, y el resto de los controles estén configurados en Dock .

Answer 2

Es una forma simple de hacer esto. Solo enlaza el evento SizeChanged de tu flowLayoutPannel y cambia el tamaño del control que lo contiene. Me gusta:

private void myFlowLayoutPannel_SizeChanged(object sender, EventArgs e)
{
    myFlowLayoutPannel.SuspendLayout();
    foreach (Control ctrl in pnSMS.Controls)
    {
        if (ctrl is Button) ctrl.Width = pnSMS.ClientSize.Width;
    }
    myFlowLayoutPannel.ResumeLayout();
}

Answer 3

Le sugiero que use TableLayoutPanel con una columna en este caso. He encontrado que TableLayoutPanel es mucho más predecible y sólido que FlowLayoutPanel.

Otra opción, si aún desea usar FlowLayoutPanel, es establecer el primer ancho de control al deseado, y usar Dock = Top para todos los demás controles.

Answer 4

Sugiero ... intente jugar con las anclas de los botones ... intente configurarlo como

Button1.Anchor = (AnchoreStyle.Left or AnchoreStyle.Right)

o configurarlo en las propiedades ...

y luego colocarlo dentro de un Panel en lugar de FlowLayoutPanel ...;)

Answer 5

aquí tengo mi clase de StackPanel:

/// <summary>
/// A stackpanel similar to the Wpf stackpanel.
/// </summary>
public class StackPanel: FlowLayoutPanel
{
    public StackPanel(): base()
    {
        InitializeComponent();
        this.ForceAutoresizeOfControls = true;
    }

    private void InitializeComponent()
    {
        this.SuspendLayout();
        //
        // StackPanel
        //
        this.AutoSizeMode = System.Windows.Forms.AutoSizeMode.GrowAndShrink;
        this.WrapContents = false;
        this.ResumeLayout(false);
    }

    /// <summary>
    /// Override it just in order to hide it in design mode.
    /// </summary>
    [Browsable(false)]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
    public new bool WrapContents
    {
        get { return base.WrapContents; }
        set { base.WrapContents = value; }
    }

    /// <summary>
    /// Override it just in order to set its default value.
    /// </summary>
    [DefaultValue(typeof(AutoSizeMode), "GrowAndShrink")]
    public override AutoSizeMode AutoSizeMode
    {
        get { return base.AutoSizeMode; }
        set { base.AutoSizeMode = value; }
    }

    /// <summary>
    /// Get or set a value that when is true forces the resizing of each control.
    /// If this value is false then only control that have AutoSize == true will be resized to
    /// fit the client size of this container.
    /// </summary>
    [DefaultValue(true)]
    public bool ForceAutoresizeOfControls { get; set; }

    protected override void OnSizeChanged(EventArgs e)
    {
        base.OnSizeChanged(e);
        this.SuspendLayout();
        switch (FlowDirection)
        {
            case FlowDirection.BottomUp:
            case FlowDirection.TopDown:
                foreach (Control control in this.Controls)
                    if (ForceAutoresizeOfControls || control.AutoSize)
                        control.Width = this.ClientSize.Width - control.Margin.Left - control.Margin.Right;
                break;
            case FlowDirection.LeftToRight:
            case FlowDirection.RightToLeft:
                foreach (Control control in this.Controls)
                    if (ForceAutoresizeOfControls || control.AutoSize)
                        control.Height = this.ClientSize.Height - control.Margin.Top - control.Margin.Bottom;
                break;
            default:
                break;
        }
        this.ResumeLayout();
    }

    protected override void OnLayout(LayoutEventArgs levent)
    {
        base.OnLayout(levent);

        if (levent != null && levent.AffectedControl != null)
        {
            Control control = levent.AffectedControl;
            if (ForceAutoresizeOfControls || control.AutoSize)
            {
                switch (FlowDirection)
                {
                    case FlowDirection.BottomUp:
                    case FlowDirection.TopDown:
                        control.Width = this.ClientSize.Width - control.Margin.Left - control.Margin.Right;
                        break;
                    case FlowDirection.LeftToRight:
                    case FlowDirection.RightToLeft:
                        control.Height = this.ClientSize.Height - control.Margin.Top - control.Margin.Bottom;
                        break;
                    default:
                        break;
                }
            }
        }
    }
}