How to use mvvm to create login page in xamarin forms - xamarin.forms

Question

I'm trying to create login page in xamarin forms using mvvm design pattern
I got and expectation in my code but i don't know the reason
I Created ViewModel page it's code
public class LoginViewModel:ContentPage,INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public User user { get; set; }
private string username;
public string Username
{
get { return username; }
set
{
username = value;
PropertyChanged(this, new PropertyChangedEventArgs("Username"));
}
}
private string password;
public string Password
{
get { return password; }
set { password = value;
PropertyChanged(this, new PropertyChangedEventArgs("Password"));
}
}
public ICommand SubmitCommand { set; get; }
public LoginViewModel()
{
user = new User();
SubmitCommand = new Command(OnSubmit);
}
private async Task<bool> CheckLogin()
{
user = await Services.LoginService.GetUserByUsername(username);
if (user != null)
{
if (user.Password.Trim().Equals(password))
{
return true;
}
else
{
await LoginView.loginView.DisplayAlert("Error", "Invalid Login, try again", "OK");
return false;
}
}
return false;
}
private async void OnSubmit()
{
await CheckLogin();
}
}
}
and MyLoginView.xaml
<ContentPage
xmlns:vm="clr-namespace:PickNgo.ViewModel"
x:Class="PickNgo.View.LoginView"
BackgroundColor="White">
<ContentPage.Content>
<StackLayout>
<StackLayout BackgroundColor="#F27D0C">
<Image HorizontalOptions="Center" WidthRequest="300" Source="logo.png"/>
</StackLayout>
<StackLayout Padding="100,10,100,0">
<Frame CornerRadius="10" BackgroundColor="White" Padding="0" Margin="0">
<Entry x:Name="Email" Text="{Binding Username}" Placeholder="Enter your username"
PlaceholderColor="Black"
Keyboard="Email"
TextColor="Black"/>
</Frame>
<BoxView HeightRequest="10"/>
<Frame CornerRadius="10" BackgroundColor="White" Padding="0" Margin="0">
<Entry x:Name="Password" Text="{Binding Password}" Placeholder="Enter your password"
PlaceholderColor="Black" HeightRequest="40" WidthRequest="40"
IsPassword="True"
TextColor="Black"/>
</Frame>
</StackLayout>
<StackLayout Padding="100,30,100,0">
<Frame CornerRadius="20" BackgroundColor="#FF6600" Padding="0" Margin="0">
<Button Command="{Binding SubmitCommand}" Text="Login" Margin="0" TextColor="White" BackgroundColor="#FF6600"
FontAttributes="Bold" FontSize="Large"/>
</Frame>
</StackLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>
and my login.cs
public partial class LoginView : ContentPage
{
public Action DisplayInvalidLoginPrompt;
public static LoginView loginView;
public LoginView ()
{
InitializeComponent();
}
}
It throw objectSystem.NullReferenceException: Object reference not set to an instance of an object.
in this line
await LoginView.loginView.Navigation.PushModalAsync(new WelcomeView());
when i debug i found loginview is set to null but i don't know why ... any help ?

Answer 1

Its because you haven't initialized LoginView's loginView variable.
To be honest, you really don't need the public static LoginView loginView variable (the class itself is already of type LoginView). If you want to display an alert, simply use PickNgo.App.Current.MainPage.DisplayAlert("", "", "OK"); (assuming PickNgo is the name of your project)