{"id":330,"date":"2022-11-28T17:05:08","date_gmt":"2022-11-28T17:05:08","guid":{"rendered":"https:\/\/learnmobiledevelopment.com\/?p=330"},"modified":"2023-01-18T17:01:36","modified_gmt":"2023-01-18T17:01:36","slug":"biometric-authentication-in-xamarin-forms","status":"publish","type":"post","link":"https:\/\/learnmobiledevelopment.com\/index.php\/2022\/11\/28\/biometric-authentication-in-xamarin-forms\/","title":{"rendered":"Implementation Of Biometric Authentication in Xamarin Forms"},"content":{"rendered":"\n

Now a days most of the mobile applications that use biometric authentication to secure data access. This allows users to authenticate via the fingerprint sensor and the face ID on those devices that have these capabilities. In this article, I\u2019m going to show you how to add Biometric Authentication<\/strong> in Xamarin<\/strong> Forms application.<\/p>\n\n\n\n

Let\u2019s Start<\/strong><\/p>\n\n\n\n

In this sample demo we will use Plugin.Fingerprint<\/a><\/strong> nuget package. <\/p>\n\n\n\n

Plugin.Fingerprint<\/strong><\/p>\n\n\n\n

Plugin.Fingerprint enables us to authenticate the user via fingerprint or face id or any other biometric.<\/p>\n\n\n\n

1 – Install Plugin.Fingerprint<\/strong> nuget<\/strong><\/p>\n\n\n\n

\"Xamarin<\/figure>\n\n\n\n

2 – iOS Setup<\/strong><\/p>\n\n\n\n

2.1 – Add “NSFaceIDUsageDescription” to your Info.plist to describe the reason your app uses Face ID<\/strong><\/p>\n\n\n\n

<key>NSFaceIDUsageDescription<\/key>\n<string>Need your face to unlock secrets!<\/string><\/pre>\n\n\n\n
thats it for iOS Let’s move to android<\/strong> setup<\/strong>.<\/p>\n\n\n\n
3 – Android Setup<\/strong><\/p>\n\n\n\n
3.1 – Add “USE_FINGERPRINT” permission in manifest file<\/strong><\/p>\n\n\n\n
<uses-permission android:name=\"android.permission.USE_FINGERPRINT\" \/><\/pre>\n\n\n\n
Set “Resolver<\/strong>” in “OnCreate()<\/strong>” method of MainActivity.cs<\/strong><\/p>\n\n\n\n
CrossFingerprint.SetCurrentActivityResolver(() => Xamarin.Essentials.Platform.CurrentActivity);<\/pre>\n\n\n\n
Now, Setup is completed for android as well.<\/p>\n\n\n\n
4 – Setting up the UI<\/strong><\/p>\n\n\n\n
4.1 – Creating a MainPage.xaml<\/strong><\/p>\n\n\n\n
<?xml version=\"1.0\" encoding=\"utf-8\" ?>\n<ContentPage\n    x:Class=\"XFBiometric.MainPage\"\n    xmlns=\"http:\/\/xamarin.com\/schemas\/2014\/forms\"\n    xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2009\/xaml\">\n\n    <StackLayout>\n        <Frame\n            Padding=\"24\"\n            BackgroundColor=\"#2196F3\"\n            CornerRadius=\"0\">\n            <Label\n                Margin=\"0,20,0,0\"\n                FontSize=\"36\"\n                HorizontalTextAlignment=\"Center\"\n                Text=\"Biometric Sample\"\n                TextColor=\"White\" \/>\n        <\/Frame>\n\n\n        <StackLayout\n            x:Name=\"StackContainer\"\n            Margin=\"0,150,0,0\"\n            IsVisible=\"False\"\n            VerticalOptions=\"CenterAndExpand\">\n\n            <Image\n                x:Name=\"ImgSuccess\"\n                HeightRequest=\"200\"\n                WidthRequest=\"200\" \/>\n\n            <Label\n                x:Name=\"LblMsg\"\n                FontAttributes=\"Bold\"\n                FontSize=\"25\"\n                HorizontalTextAlignment=\"Center\"\n                TextColor=\"Gray\" \/>\n\n        <\/StackLayout>\n\n        <Button\n            x:Name=\"BtnAuthenticate\"\n            Margin=\"0,0,0,50\"\n            Padding=\"20,15\"\n            BackgroundColor=\"#2196F3\"\n            Clicked=\"OnAuthenticateClicked\"\n            CornerRadius=\"30\"\n            FontAttributes=\"Bold\"\n            FontSize=\"20\"\n            HorizontalOptions=\"Center\"\n            Text=\"Authenticate\"\n            TextColor=\"White\"\n            VerticalOptions=\"EndAndExpand\" \/>\n\n    <\/StackLayout>\n<\/ContentPage><\/pre>\n\n\n\n
4.2 – MainPage.xaml.cs<\/strong><\/p>\n\n\n\n
using System;\nusing System.Collections.Generic;\nusing System.ComponentModel;\nusing System.Linq;\nusing System.Text;\nusing System.Threading.Tasks;\nusing Plugin.Fingerprint;\nusing Plugin.Fingerprint.Abstractions;\nusing Xamarin.Forms;\n\nnamespace XFBiometric\n{\n    public partial class MainPage : ContentPage\n    {\n        public MainPage()\n        {\n            InitializeComponent();\n        }\n\n        async void OnAuthenticateClicked(System.Object sender, System.EventArgs e)\n        {\n            var availability = await CrossFingerprint.Current.IsAvailableAsync();\n\n            if (!availability)\n            {\n                StackContainer.IsVisible = false;\n                await DisplayAlert(\"Warning!\", \"No biometrics available\", \"OK\");\n\n                return;\n            }\n\n            var authResult = await CrossFingerprint.Current.AuthenticateAsync(new AuthenticationRequestConfiguration(\"Heads up!\", \"Please validate biometric !!\"));\n\n            if (authResult.Authenticated)\n            {\n                Device.BeginInvokeOnMainThread(() =>\n                {\n                    StackContainer.IsVisible = true;\n                    ImgSuccess.Source = ImageSource.FromFile(\"success.png\");\n                    LblMsg.Text = \"Authentication Successfully !!\";\n                });\n            }\n            else\n            {\n                Device.BeginInvokeOnMainThread(() =>\n                {\n                    StackContainer.IsVisible = true;\n                    ImgSuccess.Source = ImageSource.FromFile(\"cross.jpg\");\n                    LblMsg.Text = \"Authentication Failed !!\";\n                });\n            }\n        }\n    }\n}<\/pre>\n\n\n\n
5 – Result <\/strong><\/p>\n\n\n\n
You can check the full source code here<\/a>.<\/strong><\/p>\n\n\n\n
Happy Coding! \ud83d\ude00<\/strong><\/p>\n\n\n\n
<\/div>\n\n\n\n
You may also like<\/strong><\/p>\n\n\n\n
\n
\n
\"Item<\/a><\/figure>\n<\/div>\n\n\n
How to apply item reordering to CollectionView GridItemsLayout in MAUI<\/p>\n<\/div>\n\n\n\n
<\/p>\n\n\n\n
\n
\n
\"MediaElement<\/a><\/figure>\n<\/div>\n\n\n
How to use MediaElement in Xamarin Forms<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
Now a days most of the mobile applications that use biometric authentication to secure data access. This allows users to authenticate via the fingerprint sensor and the face ID on those devices that have these capabilities. In this article, I\u2019m going to show you how to add Biometric Authentication in Xamarin Forms application. Let\u2019s Start…<\/p>\n","protected":false},"author":1,"featured_media":346,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[11,13,12],"class_list":["post-330","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-xamarin","tag-biometric-authentication-in-xamarin-forms","tag-faceid-authentication-in-xamarin-forms","tag-fingerprint-authentication-in-xamarin-forms"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/posts\/330","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/comments?post=330"}],"version-history":[{"count":22,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/posts\/330\/revisions"}],"predecessor-version":[{"id":761,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/posts\/330\/revisions\/761"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/media\/346"}],"wp:attachment":[{"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/media?parent=330"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/categories?post=330"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/learnmobiledevelopment.com\/index.php\/wp-json\/wp\/v2\/tags?post=330"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}