Show/Hide password using EventTrigger in Xamarin Forms

A common requirement in mobile applications is the ability to show/hide a password field. Googling I discovered that there are many ways to do it, some people create a custom control, others prefer to use a custom renderer, effects, etc.

In this post, I want to show you a very simple way to achieve this by using EventTrigger.

But first,

What’s Event Trigger

An EventTrigger is a kind of Trigger that activates when the associated event of the control occurs. For example, if we want to change a property when a button is clicked (Using the event Clicked) or when the text change (Using the event TextChanged).

How it works

You have to create a new TriggerAction<ViewType> class and in the Invoke method put the code you want to be executed when the EventName specified in XAML occurs.

Let’s create the Show/Hide password trigger

Create a TriggerAction for an ImageButton and when the user clicks on that button I will change the Source of the image button and use the Icon in the ShowIcon/HideIcon properties.

Let’s use it

In the XAML will add the EventTrigger to an ImageButton and set the ShowIcon/HideIcon property, also will set an x:Name, which will be used later in the Entry.

I’ll bind the IsPassword property of the Entry to the Trigger, to hide/show the password.

That’s all! You can check the full source code here.

Happy coding!

You may also like