Reset resizing done by GridSplitter

Question

I'm using GridSplitter from Microsoft.Toolkit.Uwp.UI.Controls. After two columns have been resized by the user using the grid splitter is there a way to reset that resizing and have the column widths of the grid go back to their normal widths before they were resized?

Backstory:

I have a page that displays two user controls next to each other in a grid. I'm using a gridsplitter between them to allow the user to resize the columns.

Based on other interactions the user control being displayed in the grid changes. When I "navigate" (i.e. change the user controls in the grid) I want to reset the column widths to their original value (in my case they start as * and 2*, so I want the columns to reset back to 1/3 and 2/3s size respectively).

What's the best way to reset the column widths of my grid?

Answer 1

If you give your columns names:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="Column1" Width="*"/>
        <ColumnDefinition x:Name="Column2" Width="2*"/>
    </Grid.ColumnDefinitions>
    <!-- ... -->
</Grid>

You can just setup a command or event which in your code-behind does:

Column1.Width = new GridLength(1, GridUnitType.Star);
Column2.Width = new GridLength(2, GridUnitType.Star);

That will reset the column widths and the GridSplitter will continue to work.

I'm assuming here that you've put the GridSplitter in the same column are are using the BasedOnAlignment resize behavior as is done in the Toolkit Sample App.