UWP NavigationView set IsPaneOpen false

Question

I Have a navigation view like this:

<NavigationView           
    MenuItemsSource="{Binding HamMneuItems}"
    IsPaneOpen="False"
    Margin="0,0,0,0" 
    Grid.Row="0"
    Grid.RowSpan="2"
    CompositeMode="SourceOver"            
    x:Name="nvSample"
    IsSettingsVisible="True" 
    IsTabStop="False"            
    Header="{Binding Titulo,UpdateSourceTrigger=PropertyChanged,Mode=OneWay}" SelectionChanged="NvSample_SelectionChanged">
    <Frame x:Name="ScenarioFrame"
        Margin="5,0,5,5"
        Grid.Column="0"
        Grid.Row="0"
        Grid.RowSpan="2"
        d:IsHidden="True"/>
</NavigationView>

The property IsPaneOpen is set to false, but it always show the pane opened, y tried setting IsPaneOpen to false at code behind in Page_Loaded event, at navigation view Loaded event with no results.

Now my question is how can I do to show NavigationView in compact mode first time it's showed ?.

or

Where to set IsPaneOpen to Hide pane at code behind ?

Answer 1

In xaml setup a 'Loaded' event

<NavigationView 
    Loaded="nvSample_Loaded" 

In code behind nvSample_Loaded Event:

private void nvSample_Loaded(object sender, RoutedEventArgs e)
{
     nvSample.IsPaneOpen = false;
}

Answer 2

The IsPaneOpen in NavigationView is only a Boolean flag to specify current pane view state, so you can not use it to close the pane at run time. Unfortunately, there isn't an option to close MenuItems at run time at this time may be they do in future, so there is some solutions to close the pane or menu items as follows:

navSample.OpenPaneLength = 0;

and also if you want to hide Menu Toggle Button, do like this:

navSample.IsPaneToggleButtonVisible = false;

The useful link is here for some anther solutions: UWP - Prevent NavigationViewItemHeader from being clipped

Answer 3

In order to start your app with a collapsed menu on the left hand side you could just set:

<NavigationView 
CompactModeThresholdWidth="1" 
ExpandedModeThresholdWidth="100000">

Answer 4

Use PaneDisplayMode="LeftCompact" to show menu compacted. Reference

Answer 5

By Jerry'answer

The bootstrap animation exists a collapsing pane animation.

For a workaround to escape the collapsing animation

xaml

    xmlns:controls="using:MyControls"
    <controls:FixedNavigationView InitialIsPaneOpen="False" x:Name="NavigationView">
        <NavigationView.MenuItems>
            <NavigationViewItem Content="Home" Icon="Home"></NavigationViewItem>
        </NavigationView.MenuItems>
    </controls:FixedNavigationView>

c# code

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace MyControls
{
    public class FixedNavigationView : NavigationView
    {
        public bool InitialIsPaneOpen
        {
            get { return (bool)GetValue(InitialIsPaneOpenProperty); }
            set { SetValue(InitialIsPaneOpenProperty, value); }
        }

        // Using a DependencyProperty as the backing store for InitialIsPaneOpen.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty InitialIsPaneOpenProperty =
            DependencyProperty.Register("InitialIsPaneOpen", typeof(bool), typeof(FixedNavigationView), new PropertyMetadata(true));

        private double _orginOpenPaneLength;
        private Button _togglePaneButton;

        public FixedNavigationView()
        {
            this.Loaded += FixedNavigationView_Loaded;
            this.Unloaded += FixedNavigationView_Unloaded;
        }

        private void FixedNavigationView_Unloaded(object sender, RoutedEventArgs e)
        {
            if (this.InitialIsPaneOpen == false)
            {
                _togglePaneButton.PointerEntered -= _togglePaneButton_PointerEntered;
            }
        }

        protected override void OnApplyTemplate()
        {
            base.OnApplyTemplate();

            if (this.InitialIsPaneOpen == false)
            {
                _orginOpenPaneLength = this.OpenPaneLength;
                this.OpenPaneLength = 40;
            }
        }

        private void FixedNavigationView_Loaded(object sender, RoutedEventArgs e)
        {
            if (this.InitialIsPaneOpen == false)
            {
                this.IsPaneOpen = InitialIsPaneOpen;
                this._togglePaneButton = (Button)GetTemplateChild("TogglePaneButton");
                this._togglePaneButton.PointerEntered += _togglePaneButton_PointerEntered;
            }
        }

        private void _togglePaneButton_PointerEntered(object sender, Windows.UI.Xaml.Input.PointerRoutedEventArgs e)
        {
            if (this.InitialIsPaneOpen == false)
            {
                this.OpenPaneLength = _orginOpenPaneLength;
            }
        }


    }
}