Auto Read SMS Code in Flutter using GetX || Flutter || GetX

hi my name is amar in this video i will discuss how to use sms auto fill in flutter using get x let me show you the output first as you can see here this is the design now if i send the sms then you can see the sms is retrieved and the code is auto captured how to achieve this that portion i will discuss today i have created this project by using the gate cli tool after creating the project in the spec.ml file i have taken these two dependencies sms autofill and timer countdown right now to use this sms autofill in the android we have app then build.gradle here the minimum sdk version must be set to 21 to use the sms autofill right now i will move to the home controller and here i will write some code first of all i will create the object of countdown controller let me give its name as countdown controller equals to countdown controller right next i will create the object of text editing controller now here i will declare a variable where message otp code this will actually receive or this will actually store the code which we will retrieve from the sms and i will initialize it with blank value and i will make it reactive with the help of dot obs fine now to auto retrieve the sms we must need the app signature and to retrieve the sms signature here what i will do is that inside the print by using the sms autofill i will use git app signature this will give us the app signature fine and inside the on ready method what i will do is that i will start the countdown controller dot start and in the on close i need to dispose the text editing controller so i will call text editingcontroller.dispose and i need to unregister the listener that i have done inside the on close method fine now what i will do i will move to the home view and in the home view i will write the code let me move to the home view in the home view you can see in the body i have taken a padding widget then as a child i have taken a column widget now i have used pin filled autofill this is provided by the sms autofill plugin and here i need to write some code first of all i will use the controller and in the controller i will use the controller which i have created inside the home controller that is the controller.text editing controller fine and in the current code i will set the value controller dot message otp code dot value fine next here i will use on code changed this will be called whenever the sms is auto validated will receive the code and here i will set controller dot message otp code dot value equals to code this means whatever code has been rated from the sms that i will set as a value of message otp code fine and whenever the sms is retrieved i need to stop the countdown controller and so here i need to call controller dot countdown controller dot pause fine after that there is a sized box one more thing here i need to do is that i need to wrap this spin auto fill inside obx let me use obx this and here i need to close the parenthesis fine so the p naught of field is wrapped inside the obs widget and after that there is a size box then we have this countdown this is provided by the plugin timer countdown and here i need to paste this code here you can see in the countdown i have used seconds 15 this means this countdown timer will wait for 15 second and in the build here i have checked if current remaining time equals to equals to 0.0 this means if the count current remaining time is 0 then this if portion will execute and if it is not 0 then this else portion will execute now let me show you the output here you can see that once the countdown timer is 0.0 then this if portion will execute and in the if portion we will get the option to resend the otp as you can see here i have given the text as recent otp and since since this container is wrapped inside the gesture detector in the ontap here i can write the logic to recent otp fine now this portion will execute if and only if the value of current time remaining is 0.0 okay this means the wait time is over and if the timer is running this means the value of current remaining time is not 0.0 then this else portion will execute and in the else portion here i have used this container i have used some decoration and in the child what i have done here i have displayed the ovate time fine let me run the project and let me show you the output yes now you can see in the output when the wait time is running then this container is displayed and this wait time is displayed here now once the wait time is over then you can see this if portion is executing and we are getting this recent otp option okay this is how we can achieve sms autofill in flutter using get x now what will be the format of the sms that you can find in the description of my video and the source code also you will find there i hope you have liked my video if you have liked my video please subscribe to my channel thank you so much for watching

Channel: Ripples Code

Views: 15,588

Keywords: flutter getx tutorial, getx tutorial, state management using getx, mastering getx, getx tutorial for beginners, getx tutorial step by step, route management getx, dependency management getx, what is getx, why to use getx, advantages of getx, sms auto fill flutter getx, auto read sms code flutter getx, auto read sms flutter, sms auto fill pugin flutter

Id: 4tYFwx6oJBM

Length: 7min 9sec (429 seconds)

Published: Sat Jul 30 2022