The name already exists in the tree, In Windows Phone 8.1 apps development

See more:

Windows-Phone-8.1

I am creating windows phone app in VS 2013 with version WP 8.1.
I am creating Menu Navigation control using drawer layout control for Windows Phone 8.1 from NuGet,

1. Right Click on Add Reference -> Manage NuGet Packages -> Add "DrawerLayout" text in Search box.
2. Select "DrawerLayout For Windows Phone 8.1" and click on Install button.

I have created user control to use it commonly from all the pages to navigating.
My XAML Design for User is given below -

<usercontrol>
x:Class="Sample.Controls.DrawerNavigation"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dwLayout="using:DrawerLayout"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<grid x:name="RootLayout" xmlns:x="#unknown">
<grid.rowdefinitions>
<rowdefinition height="Auto">
<rowdefinition height="*">

<!-- Title Bar -->
<grid x:name="TitleBar" removed="Orange" grid.row="0" height="30">
<grid.columndefinitions>
<columndefinition width="Auto"> <columndefinition width="*">

<Image x:Name="DrawerIcon"
Margin="5,5,0,5"
Grid.Column="0"
Source="/Assets/drawer_icon_1.png"
HorizontalAlignment="Left"
Tapped="DrawerIcon_Tapped"
Grid.ColumnSpan="2" />
<textblock x:name="txtHeader">
Grid.Column="2"
Foreground="White"
VerticalAlignment="Center"
FontSize="15"
Margin="35,0,0,-5"
Height="23"/>

<!-- Drawer Layout -->
<dwlayout:drawerlayout xmlns:dwlayout="#unknown">
Grid.Row="1"
x:Name="DrawerLayout"
removed="Transparent">
<!--MainPage -->
<grid x:name="MainFragment" removed="Transparent">

<grid x:name="ListFragment" removed="White">
<scrollviewer>
<grid>
<grid.rowdefinitions>
<rowdefinition height="Auto">
<rowdefinition height="40">
<rowdefinition height="40">
<rowdefinition height="40">
<rowdefinition height="40">
<rowdefinition height="40">
<rowdefinition height="40">

<grid x:name="grdMenu1" removed="Transparent">
Grid.Row="0" Tapped="Menu1_Tapped">
<stackpanel margin="5">
Orientation="Horizontal">
<Image x:Name="imgMenu1"
Height="20" Width="20"
Source="ms-appx:///Assets/Menu1.png"
Stretch="UniformToFill" />
<textblock x:name="Menu1">
Grid.Row="0"
Text="Menu1"
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"/>


<grid x:name="grdMenu2">
removed="Transparent" Grid.Row="1" Tapped="Menu2_Tapped" >
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu2" Height="20" Width="20" Source="ms-appx:///Assets/Menu2.png" Stretch="UniformToFill" />
<textblock x:name="Menu2" grid.row="0">
Text="Menu2"
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"
/>


<grid x:name="grdMenu3" removed="Transparent" grid.row="2" tapped="Menu3_Tapped">
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu3" Height="20" Width="20" Source="ms-appx:///Assets/Menu3.png" Stretch="UniformToFill" />
<textblock x:name="Menu3" grid.row="0" text="Menu3">
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"/>


<grid x:name="grdMenu4" removed="Transparent" grid.row="3" tapped="Menu4_Tapped">
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu4" Height="20" Width="20" Source="ms-appx:///Assets/Menu4.png" Stretch="UniformToFill" />
<textblock x:name="Menu4" grid.row="0" text="Menu4">
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black" />


<grid x:name="grdMenu5" removed="Transparent" grid.row="4" tapped="Menu5_Tapped">
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu5" Height="20" Width="20" Source="ms-appx:///Assets/Menu5.png" Stretch="UniformToFill" />
<textblock x:name="Menu5" grid.row="0" text="Menu5">
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"/>


<grid x:name="grdMenu6" removed="Transparent" grid.row="5" tapped="Menu6_Tapped">
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu6" Height="20" Width="20" Source="ms-appx:///Assets/Menu6.png" Stretch="UniformToFill" />
<textblock x:name="Menu6" grid.row="0" text="Menu6">
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"/>


<grid x:name="grdMenu7" removed="Transparent" grid.row="6" tapped="Menu7_Tapped">
<stackpanel margin="5" orientation="Horizontal">
<Image x:Name="imgMenu7" Height="20" Width="20"
Source="ms-appx:///Assets/Menu7.png" Stretch="UniformToFill" />
<textblock x:name="Menu7" grid.row="0">
Text="Menu7"
Margin="10 0 0 0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontSize="12"
Foreground="Black"/>









It Source Code Is as given Below -

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Core;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The User Control item template is documented at http://go.microsoft.com/fwlink/?LinkId=234236

namespace Sample.Controls
{
public sealed partial class DrawerNavigation : UserControl
{
public DrawerNavigation()
{
this.InitializeComponent();
Loaded += Navigation_Loaded;
}

async void Navigation_Loaded(object sender, RoutedEventArgs e)
{
await Windows.UI.ViewManagement.StatusBar.GetForCurrentView().HideAsync();
DrawerLayout.InitializeDrawerLayout();
Windows.Phone.UI.Input.HardwareButtons.BackPressed += HardwareButtons_BackPressed;
}

void HardwareButtons_BackPressed(object sender, Windows.Phone.UI.Input.BackPressedEventArgs e)
{
if (DrawerLayout.IsDrawerOpen)
{
DrawerLayout.CloseDrawer();
e.Handled = true;
}
else
{
Application.Current.Exit();
}
}

private async void Menu1_Tapped(object sender, TappedRoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu1)));
}

private async void Menu2_Tapped(object sender, TappedRoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu2)));
}

private async void Menu3_Tapped(object sender, RoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu3)));
}

private async void Menu4_Tapped(object sender, RoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu4)));
}

private async void Menu5_Tapped(object sender, RoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu5)));
}

private async void Menu6_Tapped(object sender, RoutedEventArgs e)
{
await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => (Window.Current.Content as Frame).Navigate(typeof(Menu6)));
}

private void Menu7_Tapped(object sender, RoutedEventArgs e)
{
Application.Current.Exit();
}

private void DrawerIcon_Tapped(object sender, TappedRoutedEventArgs e)
{
if (DrawerLayout.IsDrawerOpen)
{
DrawerLayout.CloseDrawer();
}
else
{
DrawerLayout.OpenDrawer();
}
}
}
}

My Question is that when i am navigating from one page to another page first time it navigating properly, but next time If i select same page again it throwing below error from DrawerLayout.dll

For ex. Suppose Navigating Menu1 to Menu2.
again try to Move from Menu2 to Menu1 it will generate below exception.

An exception of type 'System.ArgumentException' occurred in mscorlib.ni.dll but was not handled in user code

WinRT information: The name already exists in the tree: _shadowFragment.

Additional information: The parameter is incorrect.

The name already exists in the tree: _shadowFragment.

If there is a handler for this exception, the program may be safely continued.




One more thing is that if while page navigating both the pages should have grid & stack panel control.

Thanks in advance.
Rohan