How to use Truecaller SDK as a sign-in method in a Flutter | Truecaller SDK Flutter | Codementor

In this tutorial, step by step process how to add truecaller SDK as Sign in a method in a flutter. it will help users, to quickly sign in & without adding any info in it, you need to just click on the Continue Button. truecaller SDK flutter is easy to Add.

Why are we using Truecaller as Sign in?

Because truecaller sign-in the method is Fast & Quick without manually adding mobile number & user information like FirstName, LastName If the user has the Truecaller app installed in the device. & Truecaller Does not charge Anything for it (Free).

Truecaller SDK Flutter

Steps for Plugin Integration as Follow:

Step 1.Generate the Partner Key:

Why do we need the Partner key because we need to register our app on Truecaller developer Account So that truecaller SDK will work on the Flutter app first Visit the Truecaller Developer Website, the Link is here

then fill the Form & create Account in Truecaller developer Website

After registration you will get mail, Click on the Verify account

After creating an Account you need to click on the Add Application

Follow the Below Steps for generating Partner Key

Step B. Android Package Name

For Windows : keytool -list -v -keystore C:\Users\YOURUSERPROFILENAME.android\debug.keystore -alias androiddebugkey -storepass android -keypass android

For Mac : keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

Step D. SMS retriever hash code(does not Required)

Because we not building Full Stack Truecaller SDK Flutter App.

after fill up the Form it look like this:

Okay so you get a Partner Key then Need to Add the key into the Android manifest file As Below:

Step 2.App key Configuration:

and Add Following Code in the Manifest File:

xmlns:tools="http://schemas.android.com/tools"

As Shown in the images:

Step 3. Add FlutterfragmentActivity to work Truecaller SDK Flutter:

Note:- To work the Flutter_truecaller plugin you need to add FragmentActivity to Activity.

If you receive Any error Like: com.example.flutter_truecaller_example.mainactivity cannot be cast to androidx.fragment.app.fragmentactivity

Then you need to do this step. Change FlutterActivity to FlutterFragmentActivity in MainActivity.kt. Shown in the image:-

For this project, we are will Need flutter_truecaller **Package. **

Let’s Start the Tutorial on Truecaller SDK Flutter

If you Don’t know how to Create a Flutter app, check out the Getting started with Flutter official tutorial.

First, you will need to add the package flutter_truecaller to Pubspec.yaml

In the dependencies: section of your pubspec.yaml, add the following lines as **Shared preferences: **

flutter_truecaller: ^0.3.1

Now run the **Flutter package get ** in your terminal which we’ll install `` flutter_truecaller package.

Now first thing you Need to Get Instance of the Truecaller Package, so add new line in the main.dart file.

final FlutterTruecaller truecaller = FlutterTruecaller();

Add the following imports to your main.dart file As:

import 'package:flutter_truecaller/flutter_truecaller.dart';

After that we will initilize the TrueCaller SDK in the initState as:

@override void initState() { super.initState(); getTruecallerProfile(); } Future getTruecallerProfile() async { truecaller.initializeSDK( sdkOptions: FlutterTruecallerScope.SDK_OPTION_WITH_OTP, footerType: FlutterTruecallerScope.FOOTER_TYPE_ANOTHER_METHOD, consentMode: FlutterTruecallerScope.CONSENT_MODE_POPUP, ); }

as for now main.dart file will look like this:

import 'package:flutter/material.dart'; import 'package:flutter_truecaller/flutter_truecaller.dart'; void main() => runApp( MaterialApp( home: MyApp(), debugShowCheckedModeBanner: false, ), ); class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { final FlutterTruecaller truecaller = FlutterTruecaller(); @override void initState() { super.initState(); getTruecallerProfile(); } Future getTruecallerProfile() async { truecaller.initializeSDK( sdkOptions: FlutterTruecallerScope.SDK_OPTION_WITH_OTP, footerType: FlutterTruecallerScope.FOOTER_TYPE_ANOTHER_METHOD, consentMode: FlutterTruecallerScope.CONSENT_MODE_POPUP, ); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Color(0xFFEC5161), centerTitle: true, title: Text( 'Truecaller sample App', ), ), body: Center() ); } }

In scaffold body, we will need Column & in that column we will add Text Widget & Raised Button for Truecaller Sign in

Center( child: Padding( padding: const EdgeInsets.all(8.0), child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.stretch, children: [ Center( child: Text( 'Login Or Signup Using', style: TextStyle(fontSize: 17), ), ), SizedBox( height: 20, ), RaisedButton( color: Color(0xFFEC5161), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(30), ), onPressed: () async { await truecaller.getProfile(); FlutterTruecaller.manualVerificationRequired .listen((required) { if (required) { Navigator.of(context).pushReplacement( MaterialPageRoute(builder: (_) => VerifyMobileNumber())); } else { Navigator.of(context).pushReplacement( MaterialPageRoute(builder: (_) => HomePage())); } }); }, child: Container( height: 50, child: Center( child: Text( 'Mobile Number'.toUpperCase(), style: TextStyle(color: Colors.white, fontSize: 18), ), ), ), ), ], ), ), ),

we are going to Create new dart file where we will verify Non truecaller user Using truecaller SDK Flutter, so for that Create verify_mobile_number.dart file

//verify_mobile_number.dart import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_truecaller/flutter_truecaller.dart'; import 'package:truecaller_flutter_app/home_page.dart'; class VerifyMobileNumber extends StatefulWidget { @override _VerifyMobileNumberState createState() => _VerifyMobileNumberState(); } class _VerifyMobileNumberState extends State<VerifyMobileNumber> { final TextEditingController _mobile = TextEditingController(); final TextEditingController _firstName = TextEditingController(); final TextEditingController _lastName = TextEditingController(); final TextEditingController _otp = TextEditingController(); final FlutterTruecaller caller = FlutterTruecaller(); bool otpRequired = false; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Verify non truecaller'), ), body: SingleChildScrollView( child: Column( children: <Widget>[ Padding( padding: const EdgeInsets.all(8.0), child: TextField( controller: _mobile, keyboardType: TextInputType.phone, decoration: InputDecoration(labelText: "Mobile"), ), ), OutlineButton( onPressed: () async { otpRequired = await caller.requestVerification(_mobile.text); setState(() {}); }, child: Text("Verify"), ), Padding( padding: const EdgeInsets.all(8.0), child: TextField( controller: _firstName, decoration: InputDecoration(labelText: "First Name"), ), ), Padding( padding: const EdgeInsets.all(8.0), child: TextField( controller: _lastName, decoration: InputDecoration(labelText: "Last Name"), ), ), if (otpRequired) Padding( padding: const EdgeInsets.all(8.0), child: TextField( controller: _otp, keyboardType: TextInputType.number, decoration: InputDecoration(labelText: "OTP"), ), ), OutlineButton( onPressed: () async { if (otpRequired) await caller.verifyOtp( _firstName.text, _lastName.text, _otp.text); else { await caller.verifyMissedCall( _firstName.text, _lastName.text); await Future.delayed(Duration(seconds: 3)); Navigator.of(context).pushReplacement( MaterialPageRoute(builder: (_) => HomePage())); } }, child: Text("Submit"), ), //Developer Point of View StreamBuilder<String>( stream: FlutterTruecaller.callback, builder: (context, snapshot) => Text(snapshot.data ?? ''), ), StreamBuilder<FlutterTruecallerException>( stream: FlutterTruecaller.errors, builder: (context, snapshot) => Text(snapshot.hasData ? snapshot.data.errorMessage : ''), ), StreamBuilder<TruecallerProfile>( stream: FlutterTruecaller.trueProfile, builder: (context, snapshot) => Text(snapshot.hasData ? snapshot.data.firstName + " " + snapshot.data.lastName : ''), ), ], ), ), ); } }

At last, we will create a home_page.dart file. & below is the Code for the home_page.dart file

import 'package:flutter/material.dart'; class HomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Color(0xFFEC5161), centerTitle: true, title: Text( 'HomePage', ), ), body: Center( child: Text( "HomePage", style: Theme.of(context).textTheme.headline4, ), ), ); } }

The Post How to use Truecaller SDK as a sign-in method in a Flutter | Truecaller SDK Flutter appeared first on AllTechSavvy

Originally published at https://www.codementor.io.