Merge pull request #2350 from unoplatform/dev/erli/2290-grid-navigator-visibility

docs(NavigationView): Add note regarding Grid for navigation
This commit is contained in:
Agnès ZITTE 2024-06-13 14:23:22 -04:00 коммит произвёл GitHub
Родитель ab95e46200 f065fb6566
Коммит 44e1018ec7
Не найден ключ, соответствующий данной подписи
Идентификатор ключа GPG: B5690EEEBB952194
1 изменённых файлов: 29 добавлений и 42 удалений

Просмотреть файл

@ -28,19 +28,10 @@ Choosing the right control for your navigation needs is important, and one commo
</Grid>
```
* Add a `RowDefinition` to the `Grid`'s `RowDefinitions` collection. This will define the height of the `NavigationView`'s menu.
```xml
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
```
* Add a `NavigationView` control to the `Grid`. This will be the menu for the app.
```xml
<NavigationView Grid.Row="1">
<NavigationView>
...
</NavigationView>
```
@ -53,7 +44,7 @@ Choosing the right control for your navigation needs is important, and one commo
For this tutorial, `Grid` should be placed in the `Content` area.
```xml
<Grid Grid.Row="1">
<Grid>
...
</Grid>
```
@ -75,7 +66,7 @@ Choosing the right control for your navigation needs is important, and one commo
* Inside the `Grid` element of the `NavigationView`, add a `Grid` element to represent the content of each view you can to navigate to.
```xml
<Grid Grid.Row="1">
<Grid>
<Grid>
<TextBlock Text="One"
FontSize="24"
@ -103,7 +94,7 @@ Choosing the right control for your navigation needs is important, and one commo
* Add the `uen:Region.Attached` attached property to each of the following elements:
* The `Grid` element that contains the `NavigationView` and the `Grid` element that contains the content area.
* The `Grid` element that contains the `NavigationView`.
* The `NavigationView` element.
* The `Grid` element that contains the content area.
@ -135,6 +126,9 @@ Choosing the right control for your navigation needs is important, and one commo
uen:Region.Navigator="Visibility"
```
> [!IMPORTANT]
> Even if you're not utilizing the `<Grid>` element to arrange the content (ie, you're navigating between pages defined with routes), you must still include the `<Grid>` element with the `uen:Region.Navigator="Visibility"` and `uen:Region.Attached="True"` attached properties. These properties are essential for enabling the navigator functionality.
* Add the `uen:Region.Name` attached property to each of the `Grid` elements that contain the content area. This will define the name of the view that the `Grid` will represent.
```xml
@ -180,8 +174,7 @@ Choosing the right control for your navigation needs is important, and one commo
* Add a new **Page** item to your app called `ProductsPage` with the following code:
```xml
<Page
x:Class="UsingNavigationView.Views.ProductsPage"
<Page x:Class="UsingNavigationView.Views.ProductsPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Uno.Extensions.Navigation.UI.Samples"
@ -278,13 +271,8 @@ Choosing the right control for your navigation needs is important, and one commo
Background="{ThemeResource MaterialBackgroundBrush}">
<Grid uen:Region.Attached="True">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<NavigationView uen:Region.Attached="true"
Grid.Row="1">
<NavigationView uen:Region.Attached="true">
<NavigationView.MenuItems>
<NavigationViewItem Content="One"
uen:Region.Name="One" />
@ -297,8 +285,7 @@ Choosing the right control for your navigation needs is important, and one commo
</NavigationView.MenuItems>
<Grid uen:Region.Attached="True"
uen:Region.Navigator="Visibility"
Grid.Row="1">
uen:Region.Navigator="Visibility">
<Grid uen:Region.Name="One"
Visibility="Collapsed">
<TextBlock Text="One"