Is there a way for a WPF page to keep its style when in a Frame?

Question

I have a WPF page that I've styled like this:

WPF Page Example

When I set the source to the WPF page, it looks like it loads. However, the hatched background style disappears.

WPF Page In Frame Example

The button is just a test on the main Window. The background remains from the Window and the Page background isn't inherited.

Any ideas?

Frame:

<Frame Source="{Binding ProductFrameSource}" Name="frameProducts" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Grid.Column="0" Grid.RowSpan="2" />

private Uri _ProductFrameSource = new Uri("pack://application:,,,/<omitted>.<omitted>.UI;component/Views/Products/<omitted>/Products_<omitted>.xaml");
        /// <summary>
        /// Gets or sets a property indicating the current product page to display
        /// </summary>
        public Uri ProductFrameSource
        {
            get { return _ProductFrameSource; }
            set
            { 
                _ProductFrameSource = value;
                RaisePropertyChanged("ProductFrameSource");
            }
        }

Page Style:

<Style TargetType="{x:Type Page}">
        <Setter Property="Background">
            <Setter.Value>
                <DrawingBrush TileMode="Tile" Viewport="0 0 40 40" ViewportUnits="Absolute" Viewbox="0 0 100 100" ViewboxUnits="Absolute">
                    <DrawingBrush.Drawing>
                        <DrawingGroup>
                            <GeometryDrawing Brush="#FF1C1C1C" Geometry="M 0 0 L 100 0 L 100 100 L 0 100 Z" />
                            <GeometryDrawing Geometry="M  -10 77.5 L 22.5  110
                                               M  -10 52.5 L 47.5  110
                                               M  -10 27.5 L 72.5  110
                                               M  -10  2.5 L 97.5  110
                                               M  2.5  -10 L  110 97.5
                                               M 27.5  -10 L  110 72.5
                                               M 52.5  -10 L  110 47.5 
                                               M 77.5  -10 L  110 22.5">
                                <GeometryDrawing.Pen>
                                    <Pen Brush="#FF908B91" Thickness=".5" />
                                </GeometryDrawing.Pen>
                            </GeometryDrawing>
                        </DrawingGroup>
                    </DrawingBrush.Drawing>
                </DrawingBrush>
            </Setter.Value>
        </Setter>
    </Style>

@HighCore I'm not sure how helpful it will be, but I've edited my post to include the relevant code. — ernest, Feb 04 '13 at 22:01
@HighCore One thing I did saw that I messed up on, was the RaisePropertyChanged method. I was calling the wrong property. But I changed it to the correct one. It didn't resolve the issue. — ernest, Feb 04 '13 at 22:04
I just wanted to make sure you were not doing some weird winforms-like overriding OnRender() and painting the thing manually in code. haha =) — Federico Berasategui, Feb 04 '13 at 22:04
Oh. Right. Thankfully, I've dropped most of my bad WinForms habits ;) — ernest, Feb 04 '13 at 22:06

score 1 · Answer 1 · edited May 23 '17 at 10:26

Where are you defining the Page Style? Is it in App.xaml or in one of the parents of the Page?.

Please take a look here:

page.DataContext not inherited from parent Frame?

Reading that it implies the style will only be inherited if it's put in App.xaml due to the Isolated hosting behaviour.

As to why it works when you start up but not after you change the frame source....this is just a guess but it could be just a bug, or the Isolation isn't active at that point for some reason.

If putting the Style in App.xaml doesn't work or isn't practical then you could put the Style inside a ResourceDictionary defined in a separate .XAML file, and then in your Page create a ResourceDictionary that merges in that .XAML containing your shared style (or do a similar thing in code-behind to place your style into the .Resources dictionary of the Page).

FrameProductsPageStyle.xaml:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">    
<Style TargetType="{x:Type Page}">
        <Setter Property="Background">
            <Setter.Value>
                <DrawingBrush TileMode="Tile" Viewport="0 0 40 40" ViewportUnits="Absolute" Viewbox="0 0 100 100" ViewboxUnits="Absolute">
                    <DrawingBrush.Drawing>
                        <DrawingGroup>
                            <GeometryDrawing Brush="#FF1C1C1C" Geometry="M 0 0 L 100 0 L 100 100 L 0 100 Z" />
                            <GeometryDrawing Geometry="M  -10 77.5 L 22.5  110
                                               M  -10 52.5 L 47.5  110
                                               M  -10 27.5 L 72.5  110
                                               M  -10  2.5 L 97.5  110
                                               M  2.5  -10 L  110 97.5
                                               M 27.5  -10 L  110 72.5
                                               M 52.5  -10 L  110 47.5 
                                               M 77.5  -10 L  110 22.5">
                                <GeometryDrawing.Pen>
                                    <Pen Brush="#FF908B91" Thickness=".5" />
                                </GeometryDrawing.Pen>
                            </GeometryDrawing>
                        </DrawingGroup>
                    </DrawingBrush.Drawing>
                </DrawingBrush>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

In your Page's XAML:

<Page>
<Page.Resources>
    <ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary 
            Source="FrameProductsPageStyle.xaml">
        </ResourceDictionary>
    </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Page.Resources>
</Page>

Use a suitable "pack" URL to reference your XAML resource dictionary depending on whether it is a loose file or part of a component/assembly.

Some links:

Add ResourceDictionary to class library

Yeah. It's in App.xaml. You can see [here](http://i3.minus.com/ibzAF0Sn8wKmfY.PNG). I basically have two XAML files in my "Skins" folder. All of the styles for every control is in those files. They're exactly the same, except for color changes. — ernest, Feb 05 '13 at 15:11
You could be running into the optimization bug....http://stackoverflow.com/questions/5057213/why-does-styles-dont-work-at-runtime-in-wpf-when-using-multiple-mergeddictiona — Colin Smith, Feb 05 '13 at 15:38
Maybe. I added the dummy style line, but it still didn't work. Is there something else beyond just adding the line that I have to do? I looked at those threads, but it sounded as if I should just add that line and it would work. But those guys are creating a resource dictionary in a separate file with the themes. Then referencing the themes in the app.xaml. I'm just adding the theme directly to the app.xaml. [http://i5.minus.com/iQ1xn32Fp8nBU.png](http://i5.minus.com/iQ1xn32Fp8nBU.png) — ernest, Feb 05 '13 at 15:56
As an experiment only, could you refer to your Skin from a ResourceDictionary in your Page itself...just curious if that works or not before exploring other things. — Colin Smith, Feb 05 '13 at 16:02
Sorry it took so long to get back with you. I was focusing on some other things. I removed the resource dictionary from app.xaml and applied it to the page resource dictionary. The behavior is the same. http://i5.minus.com/ib1zxCkt9aa2Vk.png — ernest, Feb 08 '13 at 16:33

Is there a way for a WPF page to keep its style when in a Frame?

1 Answers1