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

时间:2013-05-28 04:19:20

标签: wpf mvvm mvvm-light

我是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之间导航

,它也会很有帮助

2 个答案:

答案 0 :(得分:2)

您需要从单独的代码块控制登录窗口,例如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. 
}

答案 1 :(得分:1)

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

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