WPF Communication from Page/Frame to Window

Question

I've built a simple WPF app which navigates through pages in a frame, but one of the frames is a picture viewer and I want it so that if someone double clicks on the picture that it goes full screen (i.e. outside the frame).

What's the best way to do this in WPF?

Answer 1

You should be able to create yourself a custom RoutedUICommand, maybe called "EnterFullScreen", which you raise from within your Page that represents the image viewer. You simply hook a CommandBinding up to this in the main Window so that whenever that command is fired, you react. Obviously you'll need the opposite as well, "ExitFullScreen", so that each Page can perhaps offer it's own UI for exiting full screen mode.

Here's what the code might look like for definining and hooking up the commands:

public partial class MyWindow : Window
{
    public static readonly RoutedUICommand EnterFullScreenCommand = 
        new RoutedUICommand("Enter fullscreen mode", 
                            "EnterFullScreen", 
                            typeof(MyWindow));
    public static readonly RoutedUICommand ExitFullScreenCommand = 
        new RoutedUICommand("Exit fullscreen mode", 
                            "ExitFullScreen", 
                            typeof(MyWindow));

    public MyWindow()
    {
        this.InitializeComponent();

        this.CommandBindings.Add(
            new CommandBinding(MyWindow.EnterFullScreenCommand,
                               (sender, args) =>
                               {
                                   // logic to go fullscreen here
                               },
                               (sender, args) =>
                               {
                                   args.CanExecuted = 
                                       // am I already fullscreen?
                               }));

        this.CommandBindings.Add(
            new CommandBinding(MyWindow.ExitFullScreenCommand,
                               (sender, args) =>
                               {
                                   // logic to exit fullscreen here
                               },
                               (sender, args) =>
                               {
                                   args.CanExecuted = 
                                       // am I fullscreen right now?
                               }));

    }

And then in your Page you would simply use this command like so:

<Button Command="{x:Static myNS:MyWindow.EnterFullScreenCommand}" />