A custom EditText with a switchable icon which shows or hides the password

Overview

Android Arsenal Download

Deprecated

This library is deprecated now as there is an official way to use the password toggle with the TextInputLayout (inside the support library starting with version 24.2.0).

<android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:passwordToggleEnabled="true">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"/>
</android.support.design.widget.TextInputLayout

For more information check the official docs.

Password EditText

A simple extension to the standard Android EditText which shows an icon on the right side of the field and lets the user toggle the visibility of the password he puts in.

NOTE

Support-library versions 24.2.0 and upwards now have built-in functionality to show an eye icon and toggle password visibility (For more info see docs). You can nevertheless still use this lib, maybe because you want some of the features that the built-in approach does not have.

How does it look like?

alt tag

Usage

For a complete sample you can check out the sample project provided within.

In short: Just include the PasswordEditText instead of the standard EditText and you are good to go.

<com.maksim88.passwordedittext.PasswordEditText
            android:id="@+id/input_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:hint="Password" />

You can also wrap PasswordEditText inside a TextInputLayout to get a material design moving label on top:

<android.support.design.widget.TextInputLayout
        android:id="@+id/input_layout_password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.maksim88.passwordedittext.PasswordEditText
            android:id="@+id/input_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:hint="Password" />
    </android.support.design.widget.TextInputLayout>

Note: be sure to include the design library to use TextInputLayout. (for more details see sample)

You can also use TextInputLayout to achieve an even prettier setError() dialog using setErrorEnabled(true) on the outer TextInputLayout and then calling setError() on it. This underlines the text and shows an error message underneath the text.

Customize

You can add your own custom icons which are shown on the right side of the EditText.

Do this by first adding the custom namespace to your root layout, e.g.:

<LinearLayout
    [...]
    xmlns:app="http://schemas.android.com/apk/res-auto"
    [...]>
</Linearlayout>

After that you can add the icons with the attributes app:pet_iconShow and app:pet_iconHide:

<com.maksim88.passwordedittext.PasswordEditText
    [...]
    app:pet_iconShow="@drawable/..."
    app:pet_iconHide="@drawable/..."
    [...]
/>

You can also set toggle the monospace Font inside the PasswordEditTexts with app:pet_nonMonospaceFont:

<com.maksim88.passwordedittext.PasswordEditText
    [...]
    app:pet_nonMonospaceFont="true"
    [...]
/>

Another customization is to just toggle the visibility of the password when the icon is hovered with app:pet_hoverShowsPw:

<com.maksim88.passwordedittext.PasswordEditText
    [...]
    app:pet_hoverShowsPw="true"
    [...]
/>

If you do not like the alpha, that is set to all the icons, you can disable it using app:pet_disableIconAlpha

NOTE: alpha values are taken from the material design guidelines (https://www.google.com/design/spec/components/text-fields.html#text-fields-password-input)

<com.maksim88.passwordedittext.PasswordEditText
    [...]
    app:pet_disableIconAlpha="true"
    [...]
/>

For a working example of the different customizations check out the activity_main.xml inside the sample project.

Download

The library is available from jcenter(), so all you need to do is include it in your apps build.gradle:

dependencies {
          compile 'com.maksim88:PasswordEditText:v0.9'
  }

Alternatively you can use jitpack.io: More info here: https://jitpack.io/#maksim88/PasswordEditText

Questions?

If you have any questions feel free to open a github issue with a 'question' label

License

Licensed under the MIT license. See LICENSE.

Comments
  • SetError

    SetError

    Hi Maksim,

    I really liked your Password Text Field, but i got a problem using it, once I have called the method setError("some error message"), the show/hide icon, becomes invisible, do you have any idea how to fix that?

    Thanks, and congratulations for this project.

    bug 
    opened by guisantogui 7
  • This library is causing Rendering problem.

    This library is causing Rendering problem.

    When I first used it, it was ok but now, it creating a problem in Rendering. First I thought it might be problem In Studio 2.3 beta version. But after debugging it more, I got the issue. As I removed this lib. everything works fine now. I think there must be some issue in library. Please check it.

    opened by Anandsoni14 6
  • drawableleft remvoves when PasswordEditText option is clicked

    drawableleft remvoves when PasswordEditText option is clicked

    I am using PasswordEditText under TextInputLayout. Here it is my part of code.

    `<android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" >

    <com.maksim88.passwordedittext.PasswordEditText
                            android:id="@+id/password"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:background="@android:color/transparent"
                            android:fontFamily="sans-serif"
                            android:hint="Password"
                            android:drawableLeft="@drawable/ic_key"
                            android:inputType="textPassword"
                            android:padding="8dp"
                            android:textSize="18sp"
                            android:typeface="normal"
                            />
    

    </android.support.design.widget.TextInputLayout>`

    opened by Anandsoni14 4
  • TextInputLayout doesn't show Error anymore after using the PasswordEditText to show/hide the password

    TextInputLayout doesn't show Error anymore after using the PasswordEditText to show/hide the password

    Before clicking on the icon the show/hide the password, the PasswordEditText and TextInputLayout work as expected and is able to show an error. However after clicking on the icon TextInputLayout.setError("error") doesn't work anymore.

    opened by gotti77 4
  • Android support library v.24.2.0 issue

    Android support library v.24.2.0 issue

    After upgraded to Android support library v.24.2.0 icon issue appears. When user starts type password icon jumps to the center of the edit box. Reproduced with support library v.24.2.0 only (especially with com.android.support:design:24.2.0)

    screenshot from 2016-08-17 19-25-20

    opened by AShuba 3
  • android.view.InflateException: Binary XML file line #73: Error inflating class com.maksim88.passwordedittext.PasswordEditText

    android.view.InflateException: Binary XML file line #73: Error inflating class com.maksim88.passwordedittext.PasswordEditText

    I went in and check your PasswordEditText class. It imports import android.support.design.widget.TextInputEditText; which is not resolvable. I thought it's supposed to be android.support.design.widget.TextInputEditText instead?

    More of the stacktrace:

    E/AndroidRuntime: FATAL EXCEPTION: main
                                                                     android.view.InflateException: Binary XML file line #73: Error inflating class com.maksim88.passwordedittext.PasswordEditText
                                                                         at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:757)
                                                                         at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)
                                                                         at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
                                                                         at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
                                                                         at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
                                                                         at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
                                                                         at uk.co.chrisjenx.calligraphy.CalligraphyLayoutInflater.inflate(CalligraphyLayoutInflater.java:60)
                                                                         at android.view.LayoutInflater.inflate(LayoutInflater.java:414)
    
    opened by ericntd 3
  • on start password should by hidden

    on start password should by hidden

    i think like in subject, when open ex. log activity, password should be hidden. i add two lines into your project:

    141 passwordVisible = true; 142 togglePasswordIconVisibility();

    opened by ms666 3
  • JitPack

    JitPack

    @maksim88,

    Could you help me with a problem? I'm trying to publish an library test build to jitpack, but I didn't figure out what's going wrong, I got the error: No releases found. Try a commit or -SNAPSHOT

    Do you know how can I manage this.

    (Yeah, I know, this is not a PasswordEditText related question, but I would be glad if you could help me)

    opened by guisantogui 2
  • switch button triggers copy / paste action?

    switch button triggers copy / paste action?

    every time after switching show/hide status, one paste action is triggered. I'm not sure whether this is a common issue.

    the temp solution is to add android:longClickable="false" for edittext.

    opened by zfdang 2
  • Using `app` namespace for attributes

    Using `app` namespace for attributes

    You should not use generic names for your attributes as this simply may conflict with other existing libs (yes, these shall be fixed too). Make it unique like by adding pet_ prefix to it or so.

    opened by MarcinOrlowski 2
  • Make lib obsolete?

    Make lib obsolete?

    While I understand this may be a bit painful, I suggest to flag this library as obsolete visible way, (i.e. by adding more info in README) as same feature is now provided by TextInputLayout.

    The point here is that abandoning non-standard libs in favors of standard ones is beneficial for everyone (but author of the former :). And since I do not expect you to work on your lib much, it'd be nice to tell the potential users that this dependency can be avoided in favor of standard libs.

    Anyway, thanks for the lib I was using for so long :)

    opened by MarcinOrlowski 1
Releases(v0.9)
  • v0.9(Sep 22, 2016)

  • v0.8(May 29, 2016)

    • Improvements to input type by using TransformationMethod instead of setting an inputType by hand.
    • Saves the cursor position and selection when toggling the inputType
    Source code(tar.gz)
    Source code(zip)
  • v0.7(May 29, 2016)

    • Updates to new versions of support libs and gradle plugin
    • Fixes a bug with state recreation
    • Uses TextInputEditText instead of AppCompatEditText to get rid of a logcat warning
    Source code(tar.gz)
    Source code(zip)
  • v0.6(Mar 21, 2016)

    • Updates support libraries and gradle plugin to newer versions
    • Adds an alpha value to all the icons (you can disable it using disableIconAlpha in XML)
    Source code(tar.gz)
    Source code(zip)
  • v0.5(Mar 4, 2016)

    • NEW: Icon can be just shown when the user hovers over the icon. ACTION_UP hides the PW again.
    • NEW: Monspace font toggleable
    • Additional bugfixes
    Source code(tar.gz)
    Source code(zip)
  • v0.4(Jan 26, 2016)

  • v0.3(Jan 22, 2016)

    • This release changes the names of custom attributes iconShow and iconHide to pet_iconShow and pet_iconHide due to possible naming conflicts when using multiple libraries in your project
    • Removes some not needed icons and xml files from the library dirs
    Source code(tar.gz)
    Source code(zip)
  • v0.2(Jan 18, 2016)

A Material Android password view that toggles password visibility via an eye icon.

8/17/2016: As of about an hour ago, this library is deprecated! Support for password visibility is now included in the Design Support Library in TextI

Lisa Wray 715 Dec 29, 2022
Android form edit text is an extension of EditText that brings data validation facilities to the edittext.

Android Form EditText Android form edit text is an extension of EditText that brings data validation facilities to the edittext. Example App I built a

Andrea 1.5k Dec 14, 2022
Androids EditText that animates the typed text. EditText is extended to create AnimatedEditText and a PinEntryEditText.

AnimatedEditText for Android This repository contains AnimatedEditText and TextDrawable all of which extend the behaviour of EditText and implement fe

Ali Muzaffar 439 Nov 29, 2022
Android library contain custom realisation of EditText component for masking and formatting input text

Masked-Edittext Masked-Edittext android library EditText widget wrapper add masking and formatting input text functionality. Install Maven <dependency

Evgeny Safronov 600 Nov 29, 2022
An Android App example of how to create a custom EditText using DoubleLinkedList Data Structure

DoubleLinkedListEditText Library This is a library to create an EditText based on the Doubly Linked List data structure so that the user can enter cod

Layon Martins 1 Nov 9, 2021
A library to show emoji in TextView, EditText (like WhatsApp) for Android

Discontinued This projected is discontinued. Please consider using other alternative, i.e EmojiCompat. Contact me if you want to continue working on a

Hieu Rocker 3.6k Jan 5, 2023
AutosizeEditText for Android is an extension of native EditText that offer a smooth auto scale text size.

AutoscaleEditText AutosizeEditText for Android is an extension of native EditText that offer a smooth auto scale text size. Latest Version How to use

Txus Ballesteros 354 Nov 28, 2022
A module designed to encapsulate the use of an Android EditText field for gathering currency information from a user. Supports all ISO-3166 compliant locales/currencies.

CurrencyEditText CurrencyEditText is an extension of Android's EditText view object. It is a module designed to provide ease-of-use when using an Edit

Josh Kitchens 335 Dec 25, 2022
A single EditText instead of a classical form. Library that implements flavienlaurent's singleinputform

material-singleinputform A single EditText instead of a classical form. This Library is a library implementation of flavienlaurent's "Single input for

Jan Heinrich Reimer 200 Nov 14, 2022
An extension of Android's TextView, EditText and Button that let's you use the font of your choice

AnyTextView (deprecated) Note: AnyTextView is no longer being maintained. I recommend replacing AnyTextView with the Calligraphy library instead. Frus

Hans Petter Eide 165 Nov 11, 2022
Form validation and feedback library for Android. Provides .setText for more than just TextView and EditText widgets. Provides easy means to validate with dependencies.

android-formidable-validation Form validation and feedback library for Android. Provides .setText for more than just TextView and EditText widgets. Pr

Linden 147 Nov 20, 2022
Add text masking functionality to Android EditText. It will prevent user from inserting not allowed signs, and format input as well.

MaskFormatter MaskFormatter adds mask functionality to your EditText. It will prevent user from inserting not allowed signs, and format input as well.

Azimo Labs 161 Nov 25, 2022
Simple way to create linked text, such as @username or #hashtag, in Android TextView and EditText

Simple Linkable Text Simple way to create link text, such as @username or #hashtag, in Android TextView and EditText Installation Gradle Add dependenc

Aditya Pradana Sugiarto 76 Nov 29, 2022
A single EditText instead of a classical form. Library that implements flavienlaurent's singleinputform

material-singleinputform A single EditText instead of a classical form. This Library is a library implementation of flavienlaurent's "Single input for

Jan Heinrich Reimer 200 Nov 14, 2022
A simple Android Tag EditText

TagEditText A simple Android Tag EditText. Setup The easiest way to add the TagEditText library to your project is by adding it as a dependency to you

HearSilent 15 May 5, 2022
Uma máscara personalizável para EditText, que pode ser adicionada como um TextWatcher.

Custom-Mask-for-EditText ?? ( Máscara personalizável para EditTexts!) Uma máscara customizável que pode ser adicionada aos seus EditTexts, e adaptada

Thyago Neves Silvestre 3 Jun 14, 2022
A Custom TextView with trim text

ReadMoreTextView A Custom TextView with trim text Download To add the ReadMoreTextView library to your Android Studio project, simply add the followin

Borja B. 1.7k Dec 29, 2022
Library project with a custom view that implements the Float Label pattern

AndroidFloatLabel This repository contains an Android library project for Android 4.0+ with a custom view that implements the Float Label pattern (htt

Ian G. Clifton 475 Dec 27, 2022
Custom view to expand long text with view more,less action , you can customize min lines , action color

ExpandableTextView Custom expadable text view Examples : <mostafa.projects.expandabletextview.ExpandableTextView android:layout_wi

Mostafa Gad 8 Jan 25, 2022