FirebaseAuth phone number verification in Sketchware

To create a login activity using Firebase Auth phone number verification method in Sketchware, follow the steps given below. This method uses Firebase authentication service for creating login.

1. In your Firebase account, go to Firebase authentication.
2. In Firebase authentication web set-up, go to SIGN-IN method, and enable Phone.

3. Go to Project settings in your Firebase project and copy the Web API Key, Project ID, and App ID.
4. Paste the Project ID, App ID, and Web API Key in your project in Sketchware, in the Firebase settings.

5. In main.xml add two EditText edittext1 and edittext2, and two Buttons button1 and button2 as shown in the image below.


6. On the MainActivity page add an Intent i. Also add a FirebaseAuth component fa.

7. Create a new page success.xml with a Button button1.

8. In onCreate event of MainActivity, if user is logged in move to SuccessActivity. Use blocks as shown in image below.
9. Create two more blocks, sendVerificationCode and verifyCode.

10. Create three String variables phone, codeSent, and code.

11. In more block sendVerificationCode, use blocks as shown below.

The codes used are:
com.google.firebase.auth.PhoneAuthProvider.getInstance().verifyPhoneNumber(phone, 60, java.util.concurrent.TimeUnit.SECONDS, this, mCallbacks);
}

com.google.firebase.auth.PhoneAuthProvider.OnVerificationStateChangedCallbacks mCallbacks = new com.google.firebase.auth.PhoneAuthProvider.OnVerificationStateChangedCallbacks() {
@Override
public void onVerificationCompleted(com.google.firebase.auth.PhoneAuthCredential phoneAuthCredential) {
showMessage("Verification completed");
}
@Override
public void onVerificationFailed(com.google.firebase.FirebaseException e) {
showMessage(e.toString());
}
@Override
public void onCodeSent(String s, com.google.firebase.auth.PhoneAuthProvider.ForceResendingToken forceResendingToken) {
super.onCodeSent(s, forceResendingToken);
codeSent = s;
}
};

{

12. In more block verifyCode, use blocks and codes as shown in the image below.
The codes used are:
com.google.firebase.auth.PhoneAuthCredential credential = com.google.firebase.auth.PhoneAuthProvider.getCredential(codeSent, code);
signInWithPhoneAuthCredential(credential);
}
private void signInWithPhoneAuthCredential(com.google.firebase.auth.PhoneAuthCredential credential) {
fa.signInWithCredential(credential) .addOnCompleteListener(this, _fa_sign_in_listener);
}

{
Note that in above code 'fa' used twice, is the name of the FirebaseAuth component added in Sketchware.

13. In the event button1 onClick, use block sendVerificationCode.
14. In the event button2 onClick, use block verifyCode.
15. Add event FirebaseAuth onSignInUserComplete. Here use Intent to move to SuccessActivity.

16. In SuccessActivity, add FirebaseAuth component fa.

17. In the event button1 onClick, .
of SuccessActivity, logout FirebaseAuth.
18. Save and run the project.

19. Now download Dev Tools(Android Developer Tools) - Device Info app by trinea.

20. In Dev Tools app, click on App Info - your app. Copy the SHA-1 from here.

21. Go to your project in Firebase console. In project settings click on add fingerprint, and paste the SHA-1 code there.

22. That's all. Now you should be able to login using your phone number.