PIN keyboard for Xamarin.Forms.
Add the following NuGet package: https://www.nuget.org/packages/FormsPinView/
OR
add FormsPinView.Core, FormsPinView.iOS, and FormsPinView.Droid to your solution.
Initialize iOS and Android renderers:
// iOS:
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
...
global::Xamarin.Forms.Forms.Init();
PinItemViewRenderer.Init();
}
// Android:
protected override void OnCreate(Bundle bundle)
{
...
global::Xamarin.Forms.Forms.Init(this, bundle);
PinItemViewRenderer.Init();
}
Add PinView
to your page:
...
xmlns:local="clr-namespace:FormsPinView.Core;assembly=FormsPinView.Core"
...
<local:PinView
HorizontalOptions="CenterAndExpand"
VerticalOptions="CenterAndExpand"
TargetPinLength="4"
Validator="{Binding ValidatorFunc}"
Success="Handle_Success" />
PinView
is MVVM-ready, so you can bind the following properties:
Property | Type | Description | Default | Required |
---|---|---|---|---|
Validator |
Func<IList<char>, bool> |
Function to check entered PIN | null |
Yes |
PinLength |
int |
The PIN length | 4 | No |
SuccessCommand |
ICommand |
Invoked when the correct PIN is entered | null |
No |
ErrorCommand |
ICommand |
Invoked when an incorrect PIN is entered | null |
No |
ClearAfterSuccess |
bool |
Indicates whether the entered PIN should be cleaned or not after it was confirmed as correct | true | No |
BorderColor |
Color |
View tint color. | Gray | No |
Color |
Color |
View basic color. | Black | No |
RippleColor |
Color |
View touch-effect color. | Gray | No |
AbsoluteLayout
instead of Grid
, no XAMLGrid
to AbsoluteLayout
BorderColor
, Color
, and RippleColor
EmptyCircleImage
and FilledCircleImage
propertiesTitle
property: now you have to implement it manually in your UIPCL
to Core
.NSInternalInconsistencyException
crash on iOSBSD 2-Clause.