Geek Answers Handbook

WPF XAML and MinWidth and MaxWidth

I have a StackPanel in which I wrapped 7 Rectangles with different widths.

My first rectangle is on the stack, I have defined the width of the minimum and maximum width and one of the other rectangles (see below x: Name = "ToBeCollapsed"), which is minimized by default, BUT is made visible in a certain state in C #.
My problem is that the first rectangle does not stretch to the width of MAX if the "ToBeCollasped" rectangle collapsed. I thought the first rectangle would fill the space up to MAX “755” if the compensated rectangle collapsed.

Am I mistaken in my logic?

My layout is below:

<StackPanel x:Name="RectangleColumns" Width="1840" Orientation="Horizontal"> <Rectangle MinWidth="575" MaxWidth="755" /> <Rectangle Width="315"/> <Rectangle Width="180" /> <Rectangle Width="180"/> <!--If collapsed first rectangle should grow to 755. MinWidth + 180--> <Rectangle x:Name="ToBeCollapsed" Width="180"/> <Rectangle Width="220"/> <Rectangle Width="190"/> </StackPanel>
+5
source share
2 answers

A row with specific column settings will do the trick. I tried this myself, using some fill colors and a smaller width to demonstrate that the first column grows into space when the fifth column collapses:

 <Grid> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <Grid Grid.Row="0" x:Name="RectangleColumns" HorizontalAlignment="Stretch "> <Grid.ColumnDefinitions> <ColumnDefinition MinWidth="200" MaxWidth="400"/> <ColumnDefinition MaxWidth="50"/> <ColumnDefinition MaxWidth="50"/> <ColumnDefinition MaxWidth="50"/> <ColumnDefinition Width="Auto"/> <ColumnDefinition MaxWidth="50"/> <ColumnDefinition MaxWidth="50"/> </Grid.ColumnDefinitions> <Rectangle Grid.Column="0" Fill="Aqua" MinWidth="200" MaxWidth="400" /> <Rectangle Grid.Column="1" Fill="Blue" Width="50"/> <Rectangle Grid.Column="2" Fill="Aqua" Width="50" /> <Rectangle Grid.Column="3" Fill="Blue" Width="50"/> <Rectangle Grid.Column="4" Fill="Pink" Width="300" Name="toBeCollapsed"/> <Rectangle Grid.Column="5" Fill="Aqua" Width="50"/> <Rectangle Grid.Column="6" Fill="Blue" Width="50"/> </Grid> <Button Grid.Row="1" Content="Toggle Visibility" Name="ButtonToggle" /> </Grid>

Code, just to demonstrate:

  public MainWindow() { InitializeComponent(); ButtonToggle.Click += ButtonToggleOnClick; } private void ButtonToggleOnClick(object sender, RoutedEventArgs routedEventArgs) { toBeCollapsed.Visibility = toBeCollapsed.Visibility == Visibility.Collapsed ? Visibility.Visible : Visibility.Collapsed; }
+3
source

Always keep an eye on the node:

In WPF, each LayoutControl is a Grid - or playable with a Grid - but it uses different definitions of columns or rows and Alignment .

Stackpanel is a grid that contains the following setting (horizontal):

  • Column designation for each added Auto size control
  • All Added Child Controls HorizontalAligment is Center
  • Additional column definition with * Width

And the way cookies get clogged.

Auto-size allocates space based on the size of the content that is inside the column or row.

As a rule, this is the minimum possible size: /

So +1 for @Bradley Uffner

Use a Grid where the Columndefinition for the Min / Max Rectangle parameter is * .

0
source

More articles:


All Articles