How to use Truecaller SDK as a sign-in method in a Flutter | Truecaller SDK Flutter
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).
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 A. App Name
- you can give Any name like example flutter truecaller app
Step B. Android Package Name
- you can find Android Package Name in **android ** Folder, android > app > src > build.gradle
Step C. Debug signing certificate SHA-1
- Go to Folder C:\Program Files\Java\jdk-13.0.1\bin
- replace name folder with cmd & press Enter After that Black windows is going to open LIke Below Image
- Type Command as Follow:
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
- Change YOURUSERPROFILENAME with your Desktop Name for Example watch below image..
- Then Click enter you can find out SHA1 Key in cmd
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:
<meta-data android:name="com.truecaller.android.sdk.PartnerKey" android:value="YOUR_PARTNER_KEY_HERE"/>
and Add Following Code in the Manifest File:
<uses-sdk tools:overrideLibrary="com.truecaller.android.sdk"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>
<uses-permission android:name="android.permission.READ_CALL_LOG"/>
<uses-permission android:name="android.permission.ANSWER_PHONE_CALLS"/>
<uses-permission android:name="android.permission.CALL_PHONE"/>
<uses-permission android:name="android.permission.INTERNET"/>
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.
- you can find Android Package Name in **android ** Folder, android > app > src >main>kotlin> MainActivity.kt
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.
Installation
InstallationFirst, 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,
),
),
);
}
}
You can see the full source code of the project here.
Enjoyed the Tutorial? Please leave a LIKE 
to show your support and appreciation
If you have a question about anything in the Tutorial, Please leave me a comment and I’ll do my best to answer it.
The Post How to use Truecaller SDK as a sign-in method in a Flutter | Truecaller SDK Flutter appeared first on AllTechSavvy
