UWP-навигация с использованием Fluent Design - PullRequest
Новая
       23

UWP-навигация с использованием Fluent Design

0 голосов
/ 28 ноября 2018

Как разместить мой контент рядом с свернутой или развернутой навигацией.Я попытался поиграть со свойством Width определения столбца и не могу заставить его работать так, как я хочу. 

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition  />
    </Grid.ColumnDefinitions>

    <controls:NavigationView 
        x:Name="MainNavigation" 
        PaneDisplayMode="Auto"
        IsSettingsVisible="False">

        <controls:NavigationView.MenuItems>
            <controls:NavigationViewItem Icon="Home" Content="Dashboard" Tag="home" />
            <controls:NavigationViewItem Icon="Edit" Content="Debrief" Tag="content" />
            <controls:NavigationViewItem Icon="Calendar" Content="Prefill" Tag="content" />
            <controls:NavigationViewItem Icon="PreviewLink" Content="Report" Tag="content" />
            <controls:NavigationViewItem Icon="Repair" Content="Schedule Maintenance" Tag="content" />
        </controls:NavigationView.MenuItems>

        <controls:NavigationView.PaneFooter>
            <controls:NavigationViewItem Icon="Admin" Content="Administration" Tag="admin" />
        </controls:NavigationView.PaneFooter>

    </controls:NavigationView>

    <Pivot x:Name="rootPivot" Title="Category Title">
        <PivotItem Header="Section 1">
            <!--Pivot content goes here-->
            <TextBlock Text="Content of section 1."/>
        </PivotItem>
        <PivotItem Header="Section 2">
            <!--Pivot content goes here-->
            <TextBlock Text="Content of section 2."/>
        </PivotItem>
        <PivotItem Header="Section 3">
            <!--Pivot content goes here-->
            <TextBlock Text="Content of section 3."/>
        </PivotItem>
    </Pivot>
</Grid>

enter image description here

1 Ответ

0 голосов
/ 28 ноября 2018

Просто поместите свой стержень внутрь "NavigationView.Content" 

<Grid>
        <NavigationView x:Name="MainNavigation" IsSettingsVisible="False">
            <NavigationView.MenuItems>
                <NavigationViewItem Icon="Home" Content="Dashboard" Tag="home" />
                <NavigationViewItem Icon="Edit" Content="Debrief" Tag="content" />
                <NavigationViewItem Icon="Calendar" Content="Prefill" Tag="content" />
                <NavigationViewItem Icon="PreviewLink" Content="Report" Tag="content" />
                <NavigationViewItem Icon="Repair" Content="Schedule Maintenance" Tag="content" />
            </NavigationView.MenuItems>
            <NavigationView.PaneFooter>
                <NavigationViewItem Icon="Admin" Content="Administration" Tag="admin" />
            </NavigationView.PaneFooter>
            <NavigationView.Content>
                <Pivot x:Name="rootPivot"  Title="Category Title">
                    <PivotItem Header="Section 1">
                        <!--Pivot content goes here-->
                        <TextBlock Text="Content of section 1."/>
                    </PivotItem>
                    <PivotItem Header="Section 2">
                        <!--Pivot content goes here-->
                        <TextBlock Text="Content of section 2."/>
                    </PivotItem>
                    <PivotItem Header="Section 3">
                        <!--Pivot content goes here-->
                        <TextBlock Text="Content of section 3."/>
                    </PivotItem>
                </Pivot>
            </NavigationView.Content>
        </NavigationView>
    </Grid>

Вид рабочего стола

Вид планшета

Мобильный просмотр

...