UWP Frame Navigation

Question

I create my MainPage in xaml and it has a Frame that I replace its content navigating to another pages.

Here is my frame inside my MainPage:

<SplitView.Content>
        <Frame x:Name="contentFrame" x:FieldModifier="public"/>
    </SplitView.Content>

I my button click I change it content:

private void createResume_Click(object sender, RoutedEventArgs e)
    {
        contentFrame.Navigate(typeof(CreateResume));
    }

Until now, it works perfect. And the frame content will have the CreateResume.xaml page:

<Grid Background="Black">
    <Grid.RowDefinitions>
        <RowDefinition Height="150"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <TextBlock Text="Full Name:" Foreground="White" FontSize="20" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="5" />
    <TextBox Grid.Column="1" x:Name="fullName" PlaceholderText="Type your full name here" Width="250" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="5" />

    <TextBlock Grid.Row="1" Text="Email:" Foreground="White" FontSize="20" HorizontalAlignment="Right" Margin="5" />
    <TextBox Grid.Row="1" Grid.Column="1" x:Name="email" PlaceholderText="Type your email here" HorizontalAlignment="Left" Width="250" Margin="5" />

    <TextBlock Grid.Row="2" Text="City:" Foreground="White" FontSize="20" HorizontalAlignment="Right" Margin="5" />
    <TextBox Grid.Row="2" Grid.Column="1" x:Name="city" PlaceholderText="Type your city here" HorizontalAlignment="Left" Width="250" Margin="5" />

    <TextBlock Grid.Row="3" Text="State:" Foreground="White" FontSize="20" HorizontalAlignment="Right" Margin="5" />
    <TextBox Grid.Row="3" Grid.Column="1" x:Name="state" PlaceholderText="Type your state name here" HorizontalAlignment="Left" Width="250" Margin="5" />

    <Button Grid.Row="4" Content="Save and Continue" Background="White" Foreground="DarkBlue" FontSize="20" HorizontalAlignment="Right" Click="Button_Click" />
</Grid>

Inside the CreateResume.xaml, I click on my button and I try to call another page to replace the frame content:

MainPage mainPage = new MainPage();
                mainPage.contentFrame.Navigate(typeof(EducationInfo));

At this point I get an error: "An unhandled exception of type 'System.AccessViolationException' occurred"

I made the frame public, so why do I get the Access Violation Exception?

Answer 1

The mainPage is the new page but it dont show in Window.

If you want to Navigate to other page that you should talk to mainPage that you want to navigate and make the mainPage to navigate to other page.

The good way is use MVVM.

The first: you can bind MainPage to MainViewModel and the MainViewModel have to sub viewModel as CreateResumeViewModel and EducationInfoViewModel

I think you can write the ViewModel in the App.xaml

The code is in the App.xaml.Resource

<Application
    x:Class="MehdiDiagram.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MehdiDiagram"
    RequestedTheme="Light">
    <Application.Resources>
        <local:ViewModel x:Key="ViewModel"></local:ViewModel>
    </Application.Resources>
</Application>

And you can bind the ViewModel to MainPage.

<Page
    x:Class="MehdiDiagram.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MehdiDiagram"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    DataContext="{StaticResource ViewModel}"
    mc:Ignorable="d">

And Bind the CreateResumeViewModel to CreateResume.

For ViewModel have two property that the one is CreateResumeViewModel.

Like the MainPage that you can bind the CreateResumeViewModel property to CreateResume.

DataContext="{Binding Source={StaticResource ViewModel},Path=CreateResumeViewModel}"

The CreateResumeViewModel have an event that call to Navigate to other page.

The ViewModel also have an event that call to Navigate to other page.

The code is in ViewModel:

class ViewModel
{
    public ViewModel()
    {
        CreateResumeViewModel.NavigateToPage += (sender, type) =>
        {
            NavigateToPage?.Invoke(sender, type);
        };
    }

    public event EventHandler<Type> NavigateToPage; 

    public CreateResumeViewModel CreateResumeViewModel{ get; set; }=new CreateResumeViewModel;
}

The code is in MainPage.

    public MainPage()
    {
        this.InitializeComponent();
        ViewModel = (ViewModel) DataContext;
        ViewModel.NavigateToPage += ViewModel_NavigateToPage;
    }

    private void ViewModel_NavigateToPage(object sender, Type e)
    {
        Frame.Navigate(e);
    }

You can use the NavigateToPage event in CreateResumeViewModel when it should navigate page.

See: https://github.com/lindexi/UWP/tree/master/uwp/src/Framework