killerthawne
killerthawne

Reputation: 124

Last element of Grid doesn't occupy all the available space of parent

I'm trying to add items in a Grid using its Grid.columndefinition property. Everything works well except that the last element (which in this is AutoSuggestBox) doesn't occupy all the available space. Here is my code

<Grid>
      <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <Button x:Name="MainMenuBtn" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" Grid.Column="0"/>
        <Button x:Name="BackBtn" FontFamily="Segoe MDL2 Assets" Content="&#xE72B;" Grid.Column="1"/>
        <Button x:Name="ForwardBtn" FontFamily="Segoe MDL2 Assets" Content="&#xE72A;" Grid.Column="2"/>
        <Button x:Name="StopRefreshBtn" FontFamily="Segoe MDL2 Assets" Content="&#xE7C3;" Grid.Column="3"/>
        <AutoSuggestBox x:Name="URLtb" FontFamily="Calibri" HorizontalContentAlignment="Stretch"
          PlaceholderText="Search or type URL" QueryIcon="Find"
            Grid.Column="4"/>             

  </Grid>

There's a styling property associated with AutoSuggestBox and Flyout menu with first button which I have not included here, for the sake of simplicity.

The resultant output of above codes looks similar to, enter image description here

I tried making use of stackpanel and relativepanel as well but neither of them work as expected. A little google search veils there is lastchildfill property in dockpanel in wpf, is there any similar thing present in uwp as well ?

Upvotes: 0

Views: 69

Answers (1)

Jessica
Jessica

Reputation: 2067

You got all the column width definitions wrong. First four should be set to Auto and the last *.

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

Upvotes: 1

Related Questions