Domanda

Come posso limitare la larghezza di un WPF StackPanel verticale per l'elemento più stretto che contiene. La larghezza della StackPanel non deve essere superiore alla larghezza di ogni altro elemento secondario.

È stato utile?

Soluzione

Purtroppo la IValueConverter approccio non sempre funziona; se i bambini vengono aggiunti a StackPanel in modo statico, ad esempio, la collezione bambino sarà vuoto al momento del legame (così ho scoperto). La soluzione più semplice è quella di creare un pannello personalizzato:

public class ConstrainedStackPanel : StackPanel
{
    public ConstrainedStackPanel()
    {
    }

    protected override Size MeasureOverride(Size constraint)
    {
        foreach (var item in this.Children)
        {
            // FrameworkElement has the Width property we care about.
            FrameworkElement element = item as FrameworkElement;
            if (element != null)
                constraint.Width = Math.Min(element.Width, constraint.Width);
        }

        return base.MeasureOverride(constraint);
    }

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        foreach (var item in this.Children)
        {
            // FrameworkElement has the Width property we care about.
            FrameworkElement element = item as FrameworkElement;
            if (element != null)
                arrangeSize.Width = Math.Min(element.Width, arrangeSize.Width);
        }

        return base.ArrangeOverride(arrangeSize);
    }
}

È possibile utilizzare il pannello, come illustrato dal seguente XAML:

<StackPanel Margin="5">
    <TextBlock Text="StackPanel:" FontWeight="Bold" />
    <StackPanel x:Name="panelA">
        <Button Width="100" Content="100" />
        <Button Width="200" Content="200" />
        <Button Width="300" Content="300" />
        <Button Width="400" Content="400" />
    </StackPanel>
    <TextBlock Text="ConstrainedStackPanel:" FontWeight="Bold" Margin="0,10,0,0" />
    <l:ConstrainedStackPanel x:Name="panelB">
        <Button Width="100" Content="100" />
        <Button Width="200" Content="200" />
        <Button Width="300" Content="300" />
        <Button Width="400" Content="400" />
    </l:ConstrainedStackPanel>
</StackPanel>

che renderà qualcosa di simile al seguente:

ScreenShot

Spero che questo aiuta.

Altri suggerimenti

ho provato il legame con la proprietà ActualWidth, anche la creazione di un convertitore per compensare il valore, e questo funziona alla grande con una sola eccezione: come si espande la dimensione del contenitore, la larghezza viene aggiornato correttamente, ma quando per rendere il contenitore più piccolo, la larghezza del contenuto effettivo diventa più piccolo, ma la "larghezza della pagina" di nessun scrollviewers non lo farà. Sono sicuro che c'è un modo per ovviare a questo, ma io non l'ho trovato.

Non è possibile. Un StackPanel orientata verticalmente sarà sempre allocare più larghezza richiesta suoi figli.

Si sarebbe migliore fuori la scrittura di un pannello personalizzato per raggiungere il tuo comportamento desiderato.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top