How to recenter UserControl(s) in Window

Question

We have BaseDialogView with next xaml code:

<Window x:Class="Test.BaseDialogView"       
    Height="475"       
    WindowStartupLocation="CenterOwner"       
    SizeToContent="Height"
    ResizeMode="CanResize"
    SizeChanged="Window_SizeChanged">
  <ContentControl Content="{Binding ContentPage}" />
</Window>

BaseDialogViewModel class:

public class BaseDialogViewModel : AbstractNotifyPropertyChangedItem
{
    private UserControl contentPage;
    public UserControl ContentPage
    {
        get { return this.contentPage; }
        set
        {
            if (this.contentPage != value)
            {
                this.contentPage = value;
                this.RaisePropertyChanged(() => this.ContentPage);
            }
        }
    }
}

The usage is very simple:

BaseDialog dialog = new BaseDialog();
BaseDialogViewModel dialogVm = new BaseDialogViewModel();

dialog.Owner = Application.Current.MainWindow;
dialog.DataContext = dialogVm ;

dialogVm.ContentPage = new ActivationView();
dialogVm.ContentPage.DataContext = new ActivationViewModel();

So basically once you have an instance of BaseDialog, you just set ContentControl (by setting dialog.ContentPage and dialog.ContentPage.DataContext).

ActivationView is very simple. For example:

 <UserControl x:Class="Test.ActivationView" d:DesignHeight="400" d:DesignWidth="700" MaxWidth="700">
    <Grid> .... what ever you need
 </UserControl>

The problem is that different UserControls windows are set, which have different width and height. When the first UserControl is shown it's place in the center of the MainWindow, which is ok. Then each new userControl is shown, but it's not centered. How do I center the BaseDialog window for each usercontrol?

I tried this (BaseDialogView):

private void Window_SizeChanged(object sender, SizeChangedEventArgs e)
{
  Window w = sender as Window;
  this.Top = (Application.Current.MainWindow.Height - w.ActualHeight) / 2;
}

but does not work ok (Some usercontrols are still not pixel centered). I also tried adding this to BaseDialogView Xaml

<Window .... VerticalAlignment="Center">

but it seems to be working only for initial instance.

A general note: a view-model should not contain any view items. Your BaseDialogViewModel class contains a property of type UserControl which breaks the MVVM pattern. — dymanoid
I agree, thank you for this, but the code was developed by someone else. Although there must be some pattern for template window — broadband
@broadband that's a good opportunity for you to fix it and do it correctly then. Part of the issue you're having here is your wonky use of the platform. I think what you're looking for is a dependency property that is bound in your xaml. Doing this work in the view model creates a lot of unnecessary code that makes it hard to diagnose — Anthony Russell
Is having a reference to control (UserControl, TextBlock, . . ) from view model a bad thing. I mean we violate the mvvm pattern? View model must have only reference to controls values (textblock value) or actions (button command) — broadband

Denis Schaf Denis Schaf · Accepted Answer · 2019-03-04T14:58:32

First of you should really consider propperly implementing the MVVM pattern. It will make your live easier, also instead of centering the element manually in the size change event you should set its owner and WindowStartupLocation by using

Window win = new Window();
win.Content = new MyUserControl();
win.Owner = this;
win.WindowStartupLocation = WindowStartupLocation.CenterOwner;

Instead of having one window where you keep changing the content i would consider having different windows..but that may vary on your specific case

How to recenter UserControl(s) in Window

1 Answers