Previewing within a Navigation Page - UXDivers/Gorilla-Player-Support GitHub Wiki

By default Gorilla previews pages without using any sort of page container, e.g. Navigation Page. Since Gorilla version 0.9.1.2 it is possible to specify which pages should be previewed within a Navigation Page. That way you get a precise preview of how your app will look like and you can also see stuff like the page Title or ToolbarItem.

Through the Gorilla.json file, it is possible to specify which pages should be previewed within a Navigation Page.

{
	"navigationPage" : {
		"all" : true | false,
		"exclude": ["Page1.xaml"],
		"include" : ["Page2.xaml"]
	}
}

Semantics:

  • all property by default is false. If set to true, all pages will be wrapped within a Navigation Page.
  • exclude property is a list of XAML file names. Those files will be excluded from the wrapping. This property is intended to be used when all is set to true.
  • include property is a list of XAML file names. Using this property you can pick individually which files should be wrapped within a Navigation Page.

Now, let's assume we have an app with the following structure:

   MyApp
    |_ App.xaml
    |_ Views
       |_ Clients.xaml
       |_ Customers.xaml
       |- Orders.xaml
       |_ Welcome.xaml
    |_ Gorilla.json    

The following settings would wrap all pages within a Navigation Page.

{
	"navigationPage" : {
		"all" : true 
	}
}

The following settings would wrap all pages, expect the Welcome.xaml, within a Navigation Page.

{
	"navigationPage" : {
		"all" : true,
		"exclude": ["Welcome.xaml"]
	}
}

The following setting will wrap Clients.xaml, Customers.xaml and Orders.xaml within a Navigation Page.

{
	"navigationPage" : {
		"include": ["Clients.xaml", "Customers.xaml", "Orders.xaml"]
	}
}