How to create master page for Windows8 app using Xaml? - c#

I need to create a Windows8 application but there are multiple elements like progress bar, same app bar and other components that are been used over and over again. In previous application i have been applying these elements in every page. Is there some approach by which I can make a master page and inhert an use it in every page. As we can do in ASP.Net Master page concept?

You have to deal with frames :
<Page x:Name="MainPage">
<Grid x:Name="LayoutRoot">
<Frame x:Name="BasicLayout"/>
<Frame x:Name="SpecificLayout"/>
</Grid>
</Page>
Use BasicLayout to show components that are been used over and over again.
Use SpecificLayout to show your page-specific content (So you don't directly navigate from the "master" Frame, but from the SpecificLayout one).

Here is nice tutorial how to create master page for Windows 8 application
Windows 8 master page tutorial

Related

Xamarin Shell hierarchy with child page

I have specified a trival page structure in a Xamarin Shell v5 app. I have a flyout with flyout items in the following structure:
<FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
<ShellContent>
<local:MainPage...
</ShellContent>
<ShellContent>
<local:Page1...
</ShellContent>
<ShellContent>
<local:Page2...
</ShellContent>
</FlyoutItem>
When I start the app the MainPage is displayed as default. So far so good.
The flyout displays the three pages. Also good.
When I tap on the Page2 flyout, that page is displayed. But a navigation stack isn't created, meaning it also displays the hamburger menu (instead of the back button where the hamburger icon is).
I would like to have Page2 be a "child page" (navigation-wise) so that when a user taps the Page2 flyout a back button is displayed at the top so the user can go back to the Homepage.
I've been reading the documentation backwards and forwards, and can't figure out how to do this in the visual shell hierarchy.
I assume it has to do with routes, but I'm not sure how to specify routes so Page2 becomes a 'sub-page' (or whatever the word is).
Does anyone know how to do this? This applies to both iOS and Android.
I would prefer not to have the tabs displayed at the bottom of the screen as I've seen in many examples. Just a neat, clean flyout menut.
If the pages are still in the Shell hierachical structure(the page2 in the FlyoutItem), the hamburger icon would show always.
You could use the code below to register the pages that do not exist in the Shell visual hierachy. And then when you navigate to these pages, you could use the back button to go back.
Routing.RegisterRoute("page2", typeof(Pages));
Navigate:
await Shell.Current.GoToAsync("page2");
In the end I solved it by using MenuItems instead of FlyoutItems. In the callback for each MenuItem I call Shell.Current.GoToAsync(""); which opens the page as a child, i.e. back navigation can be performed.
And since menu items can be styled (just like flyout items), it looks nice on the device. It's a workaround, but one I'm happy with.

Xamarin Tabbed Page Content Other than Tab

Quick question,
In Xamarin Forms, when using a Tabbed Page, is there any way for there to be content that remains static between the tabs (other than the tabbar itself)?
For example, if I have a TabbedPage with 3 children (say Page1, Page2 and Page3), can I add other children to TabbedPage that are not a part of the tab itself, but elsewhere, and stay there between tabs?
My use for this is I have 3 tabs in my TabbedPage, which is are at the bottom of the page. I would like a settings button in the top-right of each page, without having to create the same content multiple times in each page that is a child of the TabbedPage.
<TabbedPage xlmns="...>
[Content Here that remains between all tabs, but not a part of the tabbar itself]
<local:Page1>
<local:Page2>
<local:Page3>
</TabbedPage>
Is there some way of doing this easily? Or is there some other method?
Thanks for any help.
You need to check this and create your own control template
https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/templates/control-templates/
I would like a settings button in the top-right of each page, without having to create the same content multiple times in each page that is a child of the TabbedPage.
An easy way is using custom control as model. Add the custom control, the button would show in every tabbed pages(page1, page2, page3). If you want to more change on the button, change the custom model, all the changes would show in pages.
Custom Control: ButtonModel
<Button x:Name="btnModel" Text="Button" HorizontalOptions="EndAndExpand" Margin="4,0,8,0"></Button>
Add this in Page1, Page2, Page3
<local:ButtonModel ></local:ButtonModel>
There are a few methods of fixing this. One of these is outlined in another comment very well, however I found that the Xamarin Forms 'Pure' tabs fitted my needs better.
https://www.sharpnado.com/pure-xamarin-forms-tabs/
It was relatively intuitive once I got my head round it and handles integration with mvvm rather well. The tabs need nod span the entire page (other than the tabbar) which is exactly what I wanted.

Open new page outside masterdetailpage

I just new to Xamarin.Form with Prism. I want to load the page in different behavior. The first one I achieve already is in image below.
But I want to do a behavior like below image. Load a new page outside master detail page. How can I do it in prism?
You have figured out how to display the "Hamburger" icon as well as title by doing the following.
NavigationService.NavigateAsync("MasterPage/NavigationPage/DetailsPage")
If a user makes a selection from the actions listed on the master page. For Example, let's say settings.
You have a couple of options here, you can do navigate relatively
NavigationService.NavigateAsync("Settings")
This will navigate to the settings page. This will also display the back button as the second image. Your current page path will be
MasterPage/NavigationPage/DetailsPage/Settings
Now let's say you want the settings page to be the top details page. You have to navigate to it via an absolute path.
MasterPage/NavigationPage/Settings
NavigationService.NavigateAsync("MasterPage/NavigationPage/Settings")
You need to add a new page to the stack, page over existing one. To do that you should do navigation like this:
navigationService.NavigateAsync("Settings")

Deep linking/Navigating to tabbed page in prism not working

I have a master detail page as the root page for my application. As a detail page for that I have a tabbed page. In the tabbed page I have a content page and a navigation page containing one content page. In the master detail's OnNavigatedTo I'm retrieving some organisation data from the cloud and then I want to navigate to a manage organisation page which is the plain content page in the tabbed page.
Using NavigateAsync and a relative uri to the manage organisation page I find that the Tabbed Page OnNavigatedTo is hit twice and then I get an exception such as (simplified) below. I can also see Binding errors in my output showing that elements on my manage organisation page xaml tried to bind to the tabbed page view model.
I'm not sure if this is an issue with the view model auto wire change in 6.2 or if it's a deep linking issue or if I've done something wrong.
"Sequence contains no elements".
at System.Linq.Enumerable.Last[TSource] (IEnumerable`1 source) [0x00079]
at Xamarin.Forms.Platform.Android.AppCompat.NavigationPageRenderer.OnAttachedToWindow () [0x00011]
in C:\BuildAgent\work\aad494dc9bc9783\Xamarin.Forms.Platform.Android\AppCompat\NavigationPageRenderer.cs:189
Using XF 2.3.1.114, Prism.Forms 6.2, I'm not sure if other packages are relevant. If you think so I can include them.
Also interestingly, it works if I try navigate to the content page in the navigation page from the master detail i.e. "TabbedPage/NavigationPage/ContentPage".
Any ideas what the problem might be?
So first thing first, you don't have the proper XAML syntax for your TabbedPage. When defining the default page for a NavigationPage in XAML you must supply the page via the Arguments element:
<views:SimpleNavPage Title="Foo">
<x:Arguments>
<views:NestedContentPage />
</x:Arguments>
</views:SimpleNavPage>
You must also have the proper ctor in your navigation page:
public SimpleNavPage(Page root) : base (root)
{
InitializeComponent();
}
Now, I personally don't recommend navigating within the OnNavigatedTo unless you can absolutely guarantee that you will not be adding that page in another deep link, or navigation scenario. Imagine you start out with NavigateAsync("MainPage") and that has an OnNavigatedTo that does a deep link navigation operation. Now you decide to NavigateAsync("SomeOtherPage") in which it NavigateAsyc("AnotherPage/MainPage/SomeOtherPage/LastPage") from within it's OnNavigatedTo. Now, you will have created an issue because the MainPage.OnNavigatedTO will have kicked off another navigation operation while you are still navigating to the next "SomeOtherPage". You are asking for trouble.

Free Windows phone page memory

I have a simple WP8 app with 2 pages. In MainPage the user can navigate to Page2 to see a couple of images from the net. To do this I use a WebClient
WebClient myWebClient;
myWebClient = new WebClient();
myWebClient.DownloadStringAsync(mywebsite);
myWebClient.DonwloadStringCompleted += new DownloadStringCompletedEventHandler(myWebClient_Completed);
Afther that, I display the images in a StackPanel wrapped inside a ScrollViewer that looks like this
<ScrollViewer>
<StackPanel x:Name= myPanel/>
</ScrollViewer>
When i try to navigate back and forth between the pages, the app crashes after several times. I believe this is a memory leak.
My question is: What are the steps that need to be done when navigating away from Page2?
I tried to unhook the event handler:
myWebClient.DonwloadStringCompleted -=myWebClient_Completed;
and tried to free the Images from the StackPanel:
foreach(var theImage in myPanel.Children){
theImage.Source=null;
}
But it's no use. What am I missing? or maybe the syntax isn't right?
Thanks for help in advance.

Categories

Resources