user2114189
user2114189

Reputation: 450

UWP Load a Page Into A Frame

This is my first time to create a Win10 UWP program. I have a page with Navigation View and a Frame. The NavigationView is a list program for selection. When user click one of the option, the corresponding page will loaded into the frame area. I try the code show below but when I click the item and the corresponding page loaded, the page will filling the whole windows instead of only show in the frame area. It caused the user cannot select another options from the NavigationView. How can I fix the problem?

Thanks a lot!

<Page ...>
    <Grid>
        <NavigationView PaneDisplayMode="Left">
            <NavigationViewItem Content="Item 1" Name="NavigationItem1" />
            ...  // More items here
        </NavigationView>
        <ScrollViewer>
            <Frame Name="ContentFrame"></Frame>
        </ScrollViewer>
    </Grid>
</Page>

In C#

private NavigationItem1_Tapped(object sender, TappedRoutedEventargs e)
{
    ContentFrame.Navigate(typeof(Page_1));
    // Page_1 is a Page Object created in the project
}

Upvotes: 1

Views: 1543

Answers (1)

mm8
mm8

Reputation: 169160

Put the ScrollViewer inside the NavigationView element:

<Page ...>
    <Grid>
        <NavigationView PaneDisplayMode="Left">
            <NavigationView.MenuItems>
                <NavigationViewItem Content="Item 1" Name="NavigationItem1" />
            </NavigationView.MenuItems>
            <ScrollViewer>
                <Frame Name="ContentFrame"></Frame>
            </ScrollViewer>
        </NavigationView>
    </Grid>
</Page>

Using the NavigationView in your UWP applications

Upvotes: 1

Related Questions