WP8 how to create base-page & use it

Question

I've googled, but did not get any useful resources, so i decided to ask.

Problem :

I have a Windows Phone 8 C#/XAML .NET 4.5 Application, that is going to have several pages (15 - 50) that are all going to have similar look + same datacontext set to one instance of ViewModel:

    --------------------------
    |logo         usermenu(v)|
    --------------------------
    |                        |
    |                        |
    |                        |
    |     ..variable..       |
    |     ..content...       |
    |                        |
    |                        |
    --------------------------

Question :

I can't find anything usable in this matter, could someone explain how to do it?

(I'm a rookie - meaning that I'm grateful for any useful information, but much more for the explanation for dummies)

• How to create a base-page/ancestor to derive my pages from?

• Is there a way to set a datacontext in ancestor?

• How to use that base-page/ancestor?

P.S.: In case you're wondering why I want to have pages with same datacontext, there is more written about it in This question I asked before

Answer 1

It sounds like your probably taking the wrong approach here.

Rather than have 15-50 identical pages with the same data context, have one page and vary the DataContext. This will be much simpler than having lots of pages which all descend from the same base.
This is, of course, dependent upon how variable your actual content is.

In terms of your specific questions:

• Pages are classes like any other and so inheritance is defined in the same way. Just make sure you specify the ancestor in the cs and xaml file.

• You can't set the datacontext in the ancestor to be different to the actual instance and if you just set it in the ancestor it won't be available to the instance. You need to set the DataContext in the instance.

• Something like this:

A non-visual (more on this in a moment) base page

namespace SO19398590
{
    using Microsoft.Phone.Controls;

    public class MyBasePage : PhoneApplicationPage
    {
    }
}

An actual page that inherits from this.
cs:

public partial class MainPage : MyBasePage
{
    public MainPage()
    {
        InitializeComponent();
    }
}

xaml (partial):

<so19398590:MyBasePage
    x:Class="SO19398590.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:so19398590="clr-namespace:SO19398590"
    SupportedOrientations="Portrait">

    <Grid x:Name="LayoutRoot" Background="Transparent">
        <!-- put stuff here -->
   </Grid>

</so19398590:MyBasePage>

Note that this is a base page with no visuals and I am aware that you asked for visual inheritance from the base class.
Unfortunately there is a very poor story with Windows Phone when it comes to visual page inheritance. The tooling (designers) doesn't like it and it's very easy to get into problems that are awkward to diagnose.

A better approach would be to use [multiple instances of] one page but load different user controls depending on the data you want to display.
A slightly more complicated alternative but which still allows for a standard page navigation experience is to use a custom PhoneApplicationFrame and include the common UI elements there.

Sorry this is quite a generic answer but the "best" solution will depend on what is actually going in the space you define as "variable content".