UWP - Splitview define relative value to OpenPaneLength

Question

I'm using the new SplitView control to create a hamburger menu in my UWP app. My question is if I can define a relative or percentage value to its OpenPaneLength property? I want to achieve that the width of the SplitView's Pane is for example 80% of the device's width.

Thank you!

This is the XAML code of the SplitView

<SplitView x:Name="ShellSplitView"
           DisplayMode="Overlay"
           IsPaneOpen="False"
           OpenPaneLength="300">
    <SplitView.Pane>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <RadioButton x:Name="SettingsButton"
                         Grid.Row="1"
                         Content="Settings"
                         Checked="OnSettingsButtonChecked" />
        </Grid>
    </SplitView.Pane>
    <SplitView.Content>...</SplitView.Content>
</SplitView>

score 3 · Accepted Answer · answered Sep 17 '15 at 11:17

3

You just need to monitor whenever the IsPaneOpen flag is set to true, calculate the OpenPaneLength based on its parent container's ActualWidth.

this.SplitView.RegisterPropertyChangedCallback(SplitView.IsPaneOpenProperty, IsPaneOpenPropertyChanged);


private void IsPaneOpenPropertyChanged(DependencyObject sender, DependencyProperty dp)
{
    if (this.SplitView.IsPaneOpen)
    {
        this.SplitView.OpenPaneLength = this.LayoutRoot.ActualWidth * .8;
    }
}

answered Sep 17 '15 at 11:17

Justin XL

38,763
7
88
133

Also, subscribe to resize of parent control... Which may be resized by splitview itself (though, I'm not sure), so add handler to that too... Why they didn't used just relative notation, like "0.5*"? – Aberro Feb 13 '21 at 10:41

UWP - Splitview define relative value to OpenPaneLength

1 Answers1