Login Page in Xamarin Forms

Question

User316425 posted

Hi guys,

I am really new to Xamarin so help is much appreciated :)

Here are my questions:

1. I am wondering since i read the other thread about creating a login module which it says "push the login page modal on the navigation stack and pop it when you logged in" ? Is that how we create login in Xamarin?

2. So what's the difference between Question 1 Vs Creating a new login activity in the PCL and make that activity first to run on App.Xaml.cs , and after the login is successfull, we direct them to our Main Page (In my case i use MasterDetailPage Forms for the main page) ?

3. How to store login state, so when users did login once, they do not need to enter login credentials everytime they open the app until they clear the cache in options?

Kind Regards, Kevin

Answer 1

User2148 posted

Usually I suggest not to add a LoginPage inside a NavigationStack.

To save the "login state" you can use Properties https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/application-class/#Properties_Dictionary

Then in your App.cs you should take a look to your property

protected override void OnStart()
{
        // Handle when your app starts
        Debug.WriteLine ("OnStart");

    if (Application.Current.Properties.ContainsKey("isLogged"))
    {
        var id = Application.Current.Properties ["isLogged"] as bool;
        // do something with id
        if(id) // isLogged
            MainPage = MyMasterDetailPage();
        else
            MainPage = MyLoginPage();
    }
}

protected override void OnSleep()
{
        // Handle when your app sleeps
        Debug.WriteLine ("OnSleep");
}

protected override void OnResume()
{
        // Handle when your app resumes
        Debug.WriteLine ("OnResume");

    if (Application.Current.Properties.ContainsKey("isLogged"))
    {
        var id = Application.Current.Properties ["isLogged"] as bool;
        // do something with id
        if(id) // isLogged
            MainPage = MyMasterDetailPage();
        else
            MainPage = MyLoginPage();
    }
}

And in your Login Page, when user is logged, you have to save the state

Application.Current.Properties ["isLogged"] = true;

Answer 2

User316425 posted

Thank you @AlessandroCaliaro. Your explanation is what i've been looking for. So to be clear, does the Application.Current.Properties value resets everytime i close the app (not closing by pressing the home button)? or does it save the value until i clear the cache or uninstall the app?

Next, how to add the properties ("isLogged") to the application properties, i assume that is a variable inside the application properties of some sort am i correct?

Regards, Kevin

Answer 3

User2148 posted

The Properties dictionary is saved to the device automatically. Data added to the dictionary will be available when the application returns from the background or even after it is restarted.

Answer 4

User316425 posted

Thank you @AlessandroCaliaro. Last question, how to add the ("isLogged") properties to this dictionary, because "isLogged" here is somekind of variable inside the dictionary if i am not mistaken by what you meant.

Regards, Kevin

Answer 5

User2148 posted

It's simply a string. Write what you want. Mickey Mouse, Springsteen, Captain American

Answer 6

User328763 posted

This looks like a great idea @AlessandroCaliaro but what do you do in MyLoginPage to trigger OnResume?

@AlessandroCaliaro said: Usually I suggest not to add a LoginPage inside a NavigationStack.

To save the "login state" you can use Properties https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/application-class/#Properties_Dictionary

Then in your App.cs you should take a look to your property

protected override void OnStart()
{
      // Handle when your app starts
      Debug.WriteLine ("OnStart");

  if (Application.Current.Properties.ContainsKey("isLogged"))
  {
      var id = Application.Current.Properties ["isLogged"] as bool;
      // do something with id
      if(id) // isLogged
          MainPage = MyMasterDetailPage();
      else
          MainPage = MyLoginPage();
  }
}

protected override void OnSleep()
{
      // Handle when your app sleeps
      Debug.WriteLine ("OnSleep");
}

protected override void OnResume()
{
      // Handle when your app resumes
      Debug.WriteLine ("OnResume");

  if (Application.Current.Properties.ContainsKey("isLogged"))
  {
      var id = Application.Current.Properties ["isLogged"] as bool;
      // do something with id
      if(id) // isLogged
          MainPage = MyMasterDetailPage();
      else
          MainPage = MyLoginPage();
  }
}

And in your Login Page, when user is logged, you have to save the state

Application.Current.Properties ["isLogged"] = true;

Answer 7

User2148 posted

I don't understand...

Answer 8

User328763 posted

I thought maybe you were using OnResume to set the MainPage after login but I understand now that this is just so that the user stays logged in after resume.

What are you doing in MyLoginPage when the user clicks 'login' - do you just leave the mainpage set as the login page?

Answer 9

User2148 posted

And in your Login Page, when user is logged, you have to save the state

Application.Current.Properties ["isLogged"] = true;

then set MainPage to new YourMainPage

Answer 10

User328763 posted

I understand setting the state, this is fine. How do you do:

"then set MainPage to new YourMainPage"

I don't seem to have access to MainPage in a content page

Answer 11

User2148 posted

Application.Current.MainPage = new MyMainPage();

Answer 12

User328763 posted

Argh! thank you I just couldn't find it, I had to use:

Application.Current.MainPage = new NavigationPage(new MainPage(""));

otherwise I lose the title bar on the main page.

Answer 13

User369433 posted

Do not put code in OnStart and in OnResume. Just put code in App.cs constructor. It's sufficient and it's easier to debug later. I don't like to have code divided between OnStart, OnResume and constructor. You never know what part of code is running first.

Answer 14

User328763 posted

For the solution proposed above, code is required in OnResume otherwise login is only checked when the app first starts and will fail when the app sleeps and resumes. The OnStart code could be moved to the constructor.

Answer 15

User379962 posted

var id = Application.Current.Properties ["isLogged"] as bool;

This errors me :neutral:

Answer 16

User384637 posted

@AlessandroCaliaro said: Usually I suggest not to add a LoginPage inside a NavigationStack.

To save the "login state" you can use Properties https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/application-class/#Properties_Dictionary

Then in your App.cs you should take a look to your property

protected override void OnStart()
{
      // Handle when your app starts
      Debug.WriteLine ("OnStart");

  if (Application.Current.Properties.ContainsKey("isLogged"))
  {
      var id = Application.Current.Properties ["isLogged"] as bool;
      // do something with id
      if(id) // isLogged
          MainPage = MyMasterDetailPage();
      else
          MainPage = MyLoginPage();
  }
}

protected override void OnSleep()
{
      // Handle when your app sleeps
      Debug.WriteLine ("OnSleep");
}

protected override void OnResume()
{
      // Handle when your app resumes
      Debug.WriteLine ("OnResume");

  if (Application.Current.Properties.ContainsKey("isLogged"))
  {
      var id = Application.Current.Properties ["isLogged"] as bool;
      // do something with id
      if(id) // isLogged
          MainPage = MyMasterDetailPage();
      else
          MainPage = MyLoginPage();
  }
}

And in your Login Page, when user is logged, you have to save the state

Application.Current.Properties ["isLogged"] = true;

@AlessandroCaliaro did your code is applicable for iOS also? Is it any add on for iOS project?

Answer 17

User2148 posted

Yes , why not?

Answer 18

User384637 posted

@AlessandroCaliaro said: Yes , why not?

@AlessandroCaliaro if users clear the phone cache/data/restart phone, is it our app still in logged in mode?

Answer 19

User2148 posted

I think properties are cleared when you clear data. You should try...