open child window inside a parent window in wpf using MVVM

Question

I have a window called "DashBoard" window. This window appears after user sucessfully logs in. Now I wanted to open child window called "Memberlist"inside the Dashboard when user select an option from menu item. User should not be able to pullout "Memberlist" window from "Dashboard" window.

DashboardView.xmal (Parent Window)

<Window x:Class="MyProject.DashboardView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="My Project: Dashboard" Height="600" Width="800" WindowState="Maximized"    
    WindowStartupLocation="CenterOwner">
    <Grid>
    <Menu Height="23" HorizontalAlignment="Left" Name="menu1" VerticalAlignment="Top" 
Width="44">
        <MenuItem Header="_File" >
            <MenuItem Header="View Memberlist…" Command="{Binding 
Path=DisplayMemberlistCommand}" />
</MenuItem>
</Menu>
</Grid>
</Window>

MemberlistView.xaml (Child Window)

<Window x:Class="MyProject.MemberlistView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:toolkit="http://schemas.microsoft.com/wpf/2008/toolkit"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="View Memberlist" Height="400" Width="806">
<Grid>
    <Grid Height="383" Width="1179">
     <toolkit:DataGrid x:Name="dgMemberlist" 
                      ItemsSource="{Binding Path=MemberList}"
                      AutoGenerateColumns="False" Margin="21,57,422,106"
                      SelectedItem="{Binding Path=SelectedMemberItem, 
UpdateSourceTrigger=PropertyChanged}">
            <toolkit:DataGrid.Columns> 
                <toolkit:DataGridTextColumn Header="Export ID" Width="100"   
Binding="{Binding MemberfullName}" IsReadOnly="True" />

 </toolkit:DataGrid.Columns>
        </toolkit:DataGrid>

</Grid>
 </Grid>
</Window>

DashboardViewModel.cs

private ICommand _displayMemberlistCommand;
public ICommand DisplayMemberlistCommand
    {
        get
        {
            if (_displayMemberlistCommand == null)
                _displayMemberlistCommand = new RelayCommand(a=>DoDisplayMemberlist(), 
p=>true);
            return _displayMemberlistCommand;
        }
        set
        {
            _displayMemberlistCommand = value;
        }
    }


        private void DoDisplayMemberlist() 
        {
            DashboardView dv = new DashboardView();
            MemberlistView mlWindow = new MemberlistView ();
            mlWindow.Owner = Application.Current.MainWindow;
            mlWindow .Show();
        }

Answer 1

I would recommend not referencing the Views in the ViewModel. Instead, create a MemberListViewModel , and use a DataTemplate to display it.

So your DashBoardViewModel would have a

ViewModelBase CurrentView {get; set;}

property, and on ShowMemberListCommand simply sets

CurrentView = new MemberListViewModel();

Your DashboardView would contain

<ContentControl Content="{Binding CurrentView}">
    <ContentControl.Resources>
        <DataTemplate DataType="{x:Type local:MemberViewModel}">
            <local:MemberView />
        </DataTemplate>
    </ContentControl.Resources>
</ContentControl>

As long as CurrentView is null , the control is never visible. Once you execute the command to show the MemberView , CurrentView gets set to a MemberViewModel and the ContentControl gets populated

Answer 2

Since I did not know the technical term, it took me longer to find solution. I was refereeing to MDI (Multiple Document Interface). I found very good example with sample code on this URL http://wpfmdi.codeplex.com/

Answer 3

使MemberListView成为UserControl而不是Window，然后单击菜单将其添加到主窗口内容中。