some progress in adding hamburger menu

App.xaml.cpp

@@ -5,7 +5,6 @@
 
 #include "pch.h"
 #include "DirectXPage.xaml.h"
-#include "AppShell.xaml.h"
 
 using namespace VBA10;
 

BasicPage.xaml

@@ -0,0 +1,16 @@
+<Page
+    x:Class="VBA10.Views.BasicPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:NavigationMenuSample.Views"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d">
+
+    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
+          EntranceNavigationTransitionInfo.IsTargetElement="True">
+
+        <TextBlock Style="{ThemeResource TitleTextBlockStyle}" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Your App Content"/>
+
+    </Grid>
+</Page>

BasicPage.xaml.cpp

@@ -0,0 +1,25 @@
+//
+// BasicPage.xaml.cpp
+// Implementation of the BasicPage class
+//
+
+#include "pch.h"
+#include "BasicPage.xaml.h"
+
+using namespace VBA10::Views;
+
+using namespace Platform;
+using namespace Windows::Foundation;
+using namespace Windows::Foundation::Collections;
+using namespace Windows::UI::Xaml;
+using namespace Windows::UI::Xaml::Controls;
+using namespace Windows::UI::Xaml::Controls::Primitives;
+using namespace Windows::UI::Xaml::Data;
+using namespace Windows::UI::Xaml::Input;
+using namespace Windows::UI::Xaml::Media;
+using namespace Windows::UI::Xaml::Navigation;
+
+BasicPage::BasicPage()
+{
+	InitializeComponent();
+}

BasicPage.xaml.h

@@ -0,0 +1,24 @@
+//
+// BasicPage.xaml.h
+// Declaration of the BasicPage class
+//
+
+#pragma once
+
+#include "BasicPage.g.h"
+
+namespace VBA10
+{
+	namespace Views
+	{
+		/// <summary>
+		/// An empty page that can be used on its own or navigated to within a Frame.
+		/// </summary>
+		[Windows::Foundation::Metadata::WebHostHidden]
+		public ref class BasicPage sealed
+		{
+		public:
+			BasicPage();
+		};
+	}
+}

DirectXPage.xaml

@@ -3,12 +3,118 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:VBA10"
+    xmlns:controls="using:VBA10.Controls"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d">
 
-
+    <Page.Resources>
+    <DataTemplate x:Key="NavMenuItemTemplate" x:DataType="local:NavMenuItem">
+        <Grid>
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="48" />
+                <ColumnDefinition />
+            </Grid.ColumnDefinitions>
+            <!-- Showing a ToolTip and the Label is redundant.  We put the ToolTip on the icon.
+                     It appears when the user hovers over the icon, but not the label which provides
+                     value when the SplitView is 'Compact' while reducing the likelihood of showing
+                     redundant information when the label is shown.-->
+            <FontIcon x:Name="Glyph" FontSize="16" Glyph="{x:Bind SymbolAsChar}" 
+                      VerticalAlignment="Center" HorizontalAlignment="Center"
+                      ToolTipService.ToolTip="{x:Bind Label}"
+                      Foreground="White"/>
+            <TextBlock x:Name="Text" Grid.Column="1" Text="{x:Bind Label}"
+                       Foreground="White"/>
+        </Grid>
+    </DataTemplate>
+    </Page.Resources>
+
+
     <SwapChainPanel x:Name="swapChainPanel">
+
+            <!-- Adaptive triggers -->
+            <VisualStateManager.VisualStateGroups>
+                <VisualStateGroup>
+                    <VisualState>
+                        <VisualState.StateTriggers>
+                            <AdaptiveTrigger MinWindowWidth="720" />
+                        </VisualState.StateTriggers>
+                        <VisualState.Setters>
+                            <!--<Setter Target="RootSplitView.DisplayMode" Value="CompactInline"/>
+                            <Setter Target="RootSplitView.IsPaneOpen" Value="True"/>-->
+                            <Setter Target="RootSplitView.OpenPaneLength" Value="256"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState>
+                        <VisualState.StateTriggers>
+                            <AdaptiveTrigger MinWindowWidth="0" />
+                        </VisualState.StateTriggers>
+                        <VisualState.Setters>
+                            <!--<Setter Target="RootSplitView.DisplayMode" Value="Overlay"/>-->
+                            <Setter Target="RootSplitView.OpenPaneLength" Value="150"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateManager.VisualStateGroups>
+
+            <!-- Top-level navigation menu + app content -->
+            <SplitView x:Name="RootSplitView"
+                   DisplayMode="Inline"
+                   OpenPaneLength="100"
+                   IsTabStop="False"
+                       >
+                <SplitView.Pane>
+                    <RelativePanel Background="#FF4D3A89">
+                        <!-- A custom ListView to display the items in the pane.  The automation Name is set in the ContainerContentChanging event. -->
+                        <controls:NavMenuListView x:Name="NavMenuList"
+                                              TabIndex="3"
+                                              Margin="0,48,0,0"
+                                              ContainerContentChanging="NavMenuItemContainerContentChanging"
+                                              ItemContainerStyle="{StaticResource NavMenuItemContainerStyle}"
+                                              ItemTemplate="{StaticResource NavMenuItemTemplate}"
+                                              ItemInvoked="NavMenuList_ItemInvoked">
+                            <!--<controls:NavMenuListView.Header>
+                                --><!-- Using this custom back navigation button until the system-provided back button is enabled. --><!--
+                                <Button x:Name="BackButton"
+                                    TabIndex="2"
+                                    Style="{StaticResource NavigationBackButtonStyle}"
+                                    IsEnabled="{x:Bind AppFrame.CanGoBack, Mode=OneWay}"
+                                    HorizontalAlignment="{Binding ItemsPanelRoot.HorizontalAlignment, ElementName=NavMenuList}"
+                                    Click="BackButton_Click"/>
+                            </controls:NavMenuListView.Header>-->
+                        </controls:NavMenuListView>
+                    </RelativePanel>
+
+                </SplitView.Pane>
+
+                <!-- OnNavigatingToPage we synchronize the selected item in the nav menu with the current page.
+                 OnNavigatedToPage we move keyboard focus to the first item on the page after it's loaded. -->
+                <Frame x:Name="frame">
+                   <!--Navigating="OnNavigatingToPage"
+                   Navigated="OnNavigatedToPage"-->
+
+                    <Frame.ContentTransitions>
+                        <TransitionCollection>
+                            <NavigationThemeTransition>
+                                <NavigationThemeTransition.DefaultNavigationTransitionInfo>
+                                    <EntranceNavigationTransitionInfo/>
+                                </NavigationThemeTransition.DefaultNavigationTransitionInfo>
+                            </NavigationThemeTransition>
+                        </TransitionCollection>
+                    </Frame.ContentTransitions>
+                </Frame>
+            </SplitView>
+
+            <!-- Declared last to have it rendered above everything else, but it needs to be the first item in the tab sequence. -->
+            <ToggleButton x:Name="TogglePaneButton"
+                      TabIndex="1"
+                      Style="{StaticResource SplitViewTogglePaneButtonStyle}"
+                      IsChecked="{Binding IsPaneOpen, ElementName=RootSplitView, Mode=TwoWay}"
+                      Unchecked="TogglePaneButton_Checked"
+                      AutomationProperties.Name="Menu"
+                      ToolTipService.ToolTip="Menu" 
+                        />
+
     </SwapChainPanel>
 
   <Page.BottomAppBar>

DirectXPage.xaml.cpp

@@ -9,8 +9,14 @@
 #include "EmulatorFileHandler.h"
 #include "SelectROMPane.xaml.h"
 
+#include "NavMenuItem.h"
+#include "NavMenuListView.h"
+#include "BasicPage.xaml.h"
+
+
 using namespace std;
 using namespace VBA10;
+using namespace VBA10::Controls;
 
 using namespace Platform;
 using namespace Windows::Foundation;
@@ -37,6 +43,13 @@ using namespace Windows::UI::ViewManagement;
 
 extern bool enableTurboMode;
 
+DirectXPage^ DirectXPage::_current;
+
+Frame^ DirectXPage::AppFrame::get()
+{
+	return frame;
+}
+
 DirectXPage::DirectXPage():
 	m_windowVisible(true),
 	m_coreInput(nullptr)
@@ -107,6 +120,14 @@ DirectXPage::DirectXPage():
 	//// Run task on a dedicated high priority background thread.
 	//m_inputLoopWorker = ThreadPool::RunAsync(workItemHandler, WorkItemPriority::High, WorkItemOptions::TimeSliced);
 
+	// Declare the top level nav items
+	navlist = ref new Vector<NavMenuItem^>();
+	navlist->Append(
+		ref new NavMenuItem(
+			"Basic Page",
+			Symbol::Contact,
+			TypeName(Views::BasicPage::typeid)));
+	NavMenuList->ItemsSource = navlist;
 	//load settings
 	auto settings = ApplicationData::Current->LocalSettings->Values;
 
@@ -276,6 +297,8 @@ void DirectXPage::OnSwapChainPanelSizeChanged(Object^ sender, SizeChangedEventAr
 
 
 
+
+
 void DirectXPage::StartROM_Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e)
 {
 	////pause emulator 
@@ -326,7 +349,76 @@ void DirectXPage::StartROM_Click(Platform::Object^ sender, Windows::UI::Xaml::Ro
 	selectRomPopup->SetValue(Canvas::TopProperty, 100);
 	selectRomPopup->IsOpen = true;
 	this->loadingDialogOpen = true;
+}
+
+
+
+
+/// <summary>
+/// Navigate to the Page for the selected <paramref name="listViewItem"/>.
+/// </summary>
+/// <param name="sender"></param>
+/// <param name="listViewItem"></param>
+void DirectXPage::NavMenuList_ItemInvoked(Object^ sender, ListViewItem^ listViewItem)
+{
+	auto item = (NavMenuItem^)((NavMenuListView^)(sender))->ItemFromContainer(listViewItem);
+
+	if (item != nullptr)
+	{
+		if (item->DestPage.Name != AppFrame->CurrentSourcePageType.Name)
+		{
+			AppFrame->Navigate(item->DestPage, item->Arguments);
+		}
+	}
+}
 
+/// <summary>
+/// Callback when the SplitView's Pane is toggled open or close.  When the Pane is not visible
+/// then the floating hamburger may be occluding other content in the app unless it is aware.
+/// </summary>
+/// <param name="sender"></param>
+/// <param name="e"></param>
+void DirectXPage::TogglePaneButton_Checked(Object^ sender, RoutedEventArgs^ e)
+{
+	CheckTogglePaneButtonSizeChanged();
+}
+
+/// <summary>
+/// Check for the conditions where the navigation pane does not occupy the space under the floating
+/// hamburger button and trigger the event.
+/// </summary>
+void DirectXPage::CheckTogglePaneButtonSizeChanged()
+{
+	if (RootSplitView->DisplayMode == SplitViewDisplayMode::Inline ||
+		RootSplitView->DisplayMode == SplitViewDisplayMode::Overlay)
+	{
+		auto transform = TogglePaneButton->TransformToVisual(this);
+		auto rect = transform->TransformBounds(Rect(0, 0, (float)TogglePaneButton->ActualWidth, (float)TogglePaneButton->ActualHeight));
+		_togglePaneButtonRect = rect;
+	}
+	else
+	{
+		_togglePaneButtonRect = Rect();
+	}
 
-
+	TogglePaneButtonRectChanged(this, TogglePaneButtonRect);
 }
+
+/// <summary>
+/// Enable accessibility on each nav menu item by setting the AutomationProperties.Name on each container
+/// using the associated Label of each item.
+/// </summary>
+/// <param name="sender"></param>
+/// <param name="args"></param>
+void DirectXPage::NavMenuItemContainerContentChanging(ListViewBase^ sender, ContainerContentChangingEventArgs^ args)
+{
+	if (!args->InRecycleQueue && args->Item != nullptr && dynamic_cast<NavMenuItem^>(args->Item) != nullptr)
+	{
+		args->ItemContainer->SetValue(Windows::UI::Xaml::Automation::AutomationProperties::NameProperty, ((NavMenuItem^)args->Item)->Label);
+	}
+	else
+	{
+		args->ItemContainer->ClearValue(Windows::UI::Xaml::Automation::AutomationProperties::NameProperty);
+	}
+}
+

DirectXPage.xaml.h

@@ -10,6 +10,9 @@
 #include "Common\DeviceResources.h"
 #include "VBA10Main.h"
 
+#include "NavMenuItem.h"
+#include "NavMenuListView.h"
+
 
 using namespace Platform;
 using namespace Platform::Collections;
@@ -34,6 +37,33 @@ namespace VBA10
 		void SaveInternalState(Windows::Foundation::Collections::IPropertySet^ state);
 		void LoadInternalState(Windows::Foundation::Collections::IPropertySet^ state);
 
+		//from AppShell
+		property Windows::UI::Xaml::Controls::Frame^ AppFrame
+		{
+			Windows::UI::Xaml::Controls::Frame^ get();
+		}
+
+	//from AppShell
+	internal:
+		/// <summary>
+		/// An event to notify listeners when the hamburger button may occlude other content in the app.
+		/// The custom "PageHeader" user control is using this.
+		/// </summary>
+		event TypedEventHandler<DirectXPage^, Rect>^ TogglePaneButtonRectChanged;
+		property Rect TogglePaneButtonRect
+		{
+			Rect get() { return _togglePaneButtonRect; }
+		private:
+			void set(Rect value) { _togglePaneButtonRect = value; }
+		}
+
+		static property DirectXPage^ Current
+		{
+			DirectXPage^ get()
+			{
+				return _current;
+			}
+		}
 
 
 	private:
@@ -78,6 +108,17 @@ namespace VBA10
 		bool m_windowVisible;
 		void AppBarButton_Click_1(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
 		void StartROM_Click(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
+
+		//from AppShell
+		void NavMenuList_ItemInvoked(Object^ sender, ListViewItem^ e);
+		void TogglePaneButton_Checked(Object^ sender, RoutedEventArgs^ e);
+		void CheckTogglePaneButtonSizeChanged();
+		void NavMenuItemContainerContentChanging(ListViewBase^ sender, ContainerContentChangingEventArgs^ args);
+
+		Vector<NavMenuItem^>^ navlist;
+		Rect _togglePaneButtonRect;
+
+		static DirectXPage^ _current;
 	};
 }