在 WPF 中使用 MVVM 在视图之间导航

Question

我是 WPF 和 MVVM 的新手。 我正在尝试使用 MVVM 创建登录窗口，但我成功创建了。
这是 Login.xmal 代码。

<Button x:Name="btnLogin" Content="Login" HorizontalAlignment="Left" Margin="51,0,0,10" 
            VerticalAlignment="Bottom" Width="124" Height="57" Grid.Column="1" 
            CommandParameter="{Binding ElementName=txtPassword}" 
            Command="{Binding LoginCommand}"
            >           
    </Button>

    <Button x:Name="btnClose" Content="Close" HorizontalAlignment="Left" Margin="180,0,0,10" 
        VerticalAlignment="Bottom" Width="124" Height="57" Grid.Column="1"    Command="{Binding ExitCommand}">

    </Button>

    <Label Content="User Name" Margin="10,74,0,0" VerticalAlignment="Top" Height="49" 
           VerticalContentAlignment="Center" Grid.Column="1" HorizontalAlignment="Left" Width="130"/>

    <TextBox x:Name="txtUserName" HorizontalAlignment="Right" Height="49" Margin="0,74,10,0" 

             TextWrapping="Wrap"  VerticalAlignment="Top" Width="185" 
             VerticalContentAlignment="Center" Grid.Column="1" FontSize="18">
        <TextBox.Text>
            <Binding Path="Username" Mode="OneWayToSource">
                <Binding.ValidationRules>
                    <ExceptionValidationRule></ExceptionValidationRule>
                </Binding.ValidationRules>
            </Binding>
        </TextBox.Text>
    </TextBox>

    <Label Content="Password" Margin="10,128,0,0" VerticalAlignment="Top" Height="49" 
           VerticalContentAlignment="Center" Grid.Column="1" HorizontalAlignment="Left" Width="130"/>
    <PasswordBox x:Name="txtPassword" HorizontalAlignment="Right"
             Height="49" Margin="0,128,10,0"
          VerticalAlignment="Top" Width="185" 
        VerticalContentAlignment="Center" Grid.Column="1" FontSize="18">

    </PasswordBox>

在此之后，我创建了 viewModeBase.cs 类，我在其中实现了 INotifyPropertyChanged，并将其包含在 LoginViewModel.cs 中... 这是 LoginViewModel.cs 代码

public class LoginViewModel : ViewModelBase
{
    private string m_username;
    public string Username
    {
        get { return m_username; }
        set
        {
            m_username = value;
            OnPropertyChanged("Username");

        }
    }

    private string m_password;
    public string Password
    {
        get { return m_password; }
        set
        {
            m_password = value;
            OnPropertyChanged("Password");
        }
    }
    private DelegateCommand exitCommand;

    public ICommand ExitCommand
    {
        get
        {
            if (exitCommand == null)
            {
                exitCommand =new DelegateCommand(Exit);
            }
            return exitCommand;
        }
    }

    private void Exit()
    {
        Application.Current.Shutdown();
    }

    public LoginViewModel()
    {

    }

    private DelegateCommand<object> loginCommand;
    public ICommand LoginCommand
    {
        get
        {
            if (loginCommand == null)
            {
                loginCommand = new DelegateCommand<object>(Login);
            }
            return loginCommand;
        }
    }



    public void Login(object pPasswordBox)
    {
        try
        {
            if (string.IsNullOrEmpty(Username))
            {
                MessageBox.Show("Username cannot be blank.");                    
                return;
            }

            if (string.IsNullOrEmpty(((PasswordBox)pPasswordBox).Password))
            {
                MessageBox.Show("Password cannot be blank.");                
                return;
            }

            dlUsers odlUsers = new dlUsers();
            bool lResult = odlUsers.UserAuthentication(clsGymManagment.ConnectionString, Username, 
                ((((PasswordBox)pPasswordBox).Password)));
            if (lResult)
            {
                ///TODO: Need code to Hide Login Window and Open New XAML.....
            }
            else
            {
                MessageBox.Show("Username/Password is wrong.");                   
            }
        }
        catch (Exception ex)
        {
            MessageBox.Show(ex.Message);
        }
    }         
}

因为我想隐藏 LOGIN.XAML 文件并打开 UI.XAML 文件..（UI.XAML 你可以考虑任何 XAML 窗口。）... 如果您能帮助我在 UI.XAML 上的 Usercontrol 之间导航，那也会很有帮助

Answer 1

您需要从单独的代码块（例如 App.xaml.cs）控制登录窗口。将 app.xaml 设置为调用代码而不是显示窗口。

让 App_Startup 创建 LoginViewModel，新建一个表单，将表单的数据上下文设置为您的 ViewModel 并显示它。

对表单的更新将更新 ViewModel，当它关闭时它将控制权返回给您的调用代码。

Login.xaml.cs

    private void btnOk_Click(object sender, RoutedEventArgs e)
    {
        if (anything incorrect)
        {
            MessageBox.Show("Enter a username and password");
        }
        else
            DialogResult = true;
    }

App.xaml.cs

Login.DataContext = LoginViewModel;

if (Login.ShowDialog() ?? false)
{
   //Check the LoginViewModel for a correct password. 
}

Answer 2

幸运的是，当您在应用程序内的不同页面中移动时隐藏和显示不同控件的功能已经为您编写好了。见http://msdn.microsoft.com/en-us/library/ms750478.aspx。

导航窗口非常强大，并且可以很容易地进行蒙皮以提供完全不同的外观。见http://alski.net/post/2012/01/13/WPF-Wizards-part-2-Glass.aspx