📜 ⬆️ ⬇️

Password Visibility Toggle - Android Support Library, revision 24.2.0

Hello! I bring to the attention of readers the translation of an article about updating Android Support Library and one of its important new component Password Visibility Toggle. The original article can be found here .


I believe that Password Visibility Toggle quite an interesting tool, and quite a simple one that deserves special attention, so I ask for cat.



From myself I want to add that the current Support Library update is considered one of the most ambitious: splitting into several small modules is a definite plus that will help reduce the weight of your .apk file; big API update; a lot of deprecations and a little bugfixes brought us.


The Android Support Library was recently updated with some very interesting changes. I drew attention to Password Visibility Toggle not accidentally: just a few days ago I tried to implement this functionality in my working draft without using any libraries (by the way, Lisa Wray developed an excellent lib ).


I praised it on Twitter .


image

Naturally, this was one of the first things I used, since I needed to immediately update my project.


Here is a very basic tutorial on how to work with it.


First step


The first and most obvious is, of course, to upgrade the Support Library version to 24.2.0. I hope your dependency versions are written in extra properties . If yes, then this means that you need to change the version only in ONE place. If not, then you will have to change the Gradle file as many times as the version occurs.


 supportLibraryVersion = '24.2.0' 

Further


The next step is to create a TextInputEditText and set the inputType to one of the following options: textPassword, numberPassword, textVisiblePassword, or textWebPassword . I tried all 4 types and noticed that the visibility icon appears on all but the textVisiblePassword option, which is pretty obvious, since this option initially sets the default password visibility.


 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" app:passwordToggleContentDescription="@string/description" app:passwordToggleDrawable="@drawable/another_toggle_drawable" app:passwordToggleEnabled="true" app:passwordToggleTint="@color/colorAccent"> <android.support.design.widget.TextInputEditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/password" android:inputType="textPassword"/> </android.support.design.widget.TextInputLayout> </LinearLayout> 

The same code on the author’s gist.github .


There are 5 XML attributes associated with password visibility toggle.


  1. passwordToggleContentDescription allows us to set the string as content description
  2. passwordToggleDrawable allows us to set another icon besides the visibility icon visibility toggle icon
  3. passwordToggleEnabled allows us to determine if we want the password to be switchable. It seems to me that this should be set only if you do not specifically want to make the field switchable.
  4. passwordToggleTint allows us to color the icon in any color. It also works with custom drawable.
  5. passwordToggleTintMode allows us to set the so-called blend mode in which we can apply a tint to the background.

As an ordinary Android UI component in XML, it is also possible to implement this ( passwordToggleContentDescription, passwordToggleDrawable, passwordToggleEnabled, passwordToggleTint and passwordToggleTintMode ) directly with the code: you must create TextInputEditText and call one of these methods.


Remarks


After I implemented this, I expected the visibility icon to be crossed out by default (the link to my tweet is above). The tweet below is from Nick Butcher and even Lisa Wray's liba shows the same thing. I was somewhat disappointed having tried it and found that by default the change in the visibility state of the icon was only a slight blackout instead of strikethrough. This is not obvious enough, in my opinion, as it could lead to confusion, especially for users like me, who have already tried this feature on other platforms and expected the same behavior. I needed to create a custom StateListDrawable and set in the passwordToggleDrawable XML attribute the type of effect I want to achieve.


Tweet about Password Visibility Toggle by Nick Butcher.


Some words are not specifically translated, as I believe that they can distort the perception of the developer. Most words are already considered the norm in our work.


If there are proposals to improve the quality of the translation or something just sounds absurd - criticism is welcome.


That's all, thank you.


PS For the links to gist and twitter, I apologize, I don’t know how they can be directly inserted into the text.


')

Source: https://habr.com/ru/post/308318/


All Articles