Search code examples
wpfxaml

Set d:DesignHeight For All Pages

My WPF project consists of many Pages that all load into the same frame. I currently specify d:DesignHeight and d:DesignWidth in the Page tag in each individual file. I would like to just specify it in one place if possible (like a Style).

I tried setting it as a Style in my App.xaml.

<Style x:Key="PageStyle" TargetType="{x:Type Page}">
    <Setter Property="d:DesignHeight" Value="942" />
    <Setter Property="d:DesignWidth" Value="1264" />

The Pages render correctly in the designer, but the code fails to build:

Error: Cannot find the Style Property 'DesignHeight' on the type 'System.Windows.Controls.Page'

How can I set the same d:DesignHeight and d:DesignWidth for several pages in one place?

Solution

  • I'm afraid you can't. The designer properties are not real properties--they are directives that get ignored by the Xaml parser.

    In fact, you can only use them when you explicitly tell the parser to ignore them:

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"

    The mc:Ignorable directive tells the parser to ignore any lookup failures that occur within the given namespaces. If you attempt to reference one of the designer properties without adding the designer namespace to mc:Ignorable, you will get a compile-time error:

    The property 'DesignWidth' does not exist in XML namespace 'http://schemas.microsoft.com/expression/blend/2008'.

    As these are not real properties, you cannot apply them with a Setter, nor can you set them programmatically. Sorry.

    Addendum

    I spent some time investigating other options for setting the width and height in design mode. I tried custom attached properties, subclassing Page, and even overriding the default metadata for Width and Height in design mode. Invariably, I could get each approach working for almost any control except Window and Page. I suspect this is because of the way the designer displays windows and pages using special proxy elements.

    At this point, I am reasonably confident there is no way to make this work with the VS 2017 Xaml designer.