Android Development Imitation book login box to delete content or display the contents of a password box _android

Jane Book app is a piece of software I like very much. Today I imitated his login box. First figure:

Okay, here's the code, custom Imgedittext inheritance and EditText. Rewrite some methods.

Package Lyf.myimgedittextdemo;
Import Android.content.Context;
Import Android.graphics.Rect;
Import android.graphics.drawable.Drawable;
Import android.text.Editable;
Import Android.text.TextWatcher;
Import Android.util.AttributeSet;
Import android.view.MotionEvent;
Import Android.widget.EditText;
/** * Lyf on 2016/12/6. * Custom EditText to the right with a picture, you can set the Click event/public class Imgedittext extends EditText implements Textwatcher {//The picture on the left of the control private Drawa
ble leftdrawable = null;
The picture on the right of the control private drawable rightdrawable = null;
Control has focus private Boolean hasfoucs;
Private Imyrightdrawableclick Mightdrawableclick; Public Imgedittext {This (context, null);} public Imgedittext (context, AttributeSet attrs) {//That The construction method is also very important, without this many attributes can no longer define this in XML (context, Attrs, Android.)
R.attr.edittextstyle); 
Public Imgedittext (context, AttributeSet attrs, int defstyleattr) {Super (context, attrs, defstyleattr); init (); }//Initialize basic picture private void init () {//Get RadioButton Picture collection drawable[] DrAwables = Getcompounddrawables ();
leftdrawable = Drawables[0];
rightdrawable = drawables[2];
Setcompounddrawableswithintrinsicbounds (leftdrawable, NULL, NULL, NULL);
Set the input box to change the content of the listening addtextchangedlistener (this); //Set the size of the display picture public void Setcompounddrawableswithintrinsicbounds (drawable left, drawable top, drawable right, drawable b Ottom) {Super.setcompounddrawableswithintrinsicbounds (left, top, right, bottom); here, just change the back two parameters, a wide one is high, If you want to know why you can find the source code if (left!= null) {left.setbounds (0, 0, m);} if (right!= null) {right.setbounds (0, 0, m);} I F (top!= null) {top.setbounds (0, 0, MB);} if (bottom!= null) {bottom.setbounds (0, 0, MB);} setcompounddr
Awables (left, top, right, bottom); ////When the cursor is selected @Override protected void Onfocuschanged (Boolean focused, int direction, Rect previouslyfocusedrect) {Super.on
Focuschanged (focused, direction, previouslyfocusedrect);
This.hasfoucs = focused; if (focused) {setimagevisible (GetText (). Length () > 0);} else {SetimaGevisible (FALSE); }//Set clear icon to display and hide, call setcompounddrawables for EditText to draw up protected void setimagevisible (Boolean flag) {// If a picture is currently on the right, overwrite the picture on the right, if not, or display the original picture if (Getcompounddrawables () [2]!= null) {rightdrawable = Getcompounddrawables () [2];} if (flag) {Setcompounddrawables (getcompounddrawables () [0], NULL, rightdrawable, NULL);}
else {setcompounddrawables (getcompounddrawables () [0], NULL, NULL, NULL);} Text Box Listener event @Override public void ontextchanged (charsequence text, int start, int lengthbefore, int lengthafter) {if (HASFO
UCS) {if (text.length () > 0) {setimagevisible (true);} else {setimagevisible (false);}}} public void beforetextchanged (charsequence s, int start, int count, int over) {} public void aftertextchanged (Editable s {}/** * because we can't set the click event directly for EditText, so we use the position we pressed to simulate the click event * when we press the position at EditText width-the spacing between the icon and the right of the control-the width of the icon and the width of the * edittext- icon to the right of the control between the spacing we click on the icon, the vertical direction is not considered * (reference http://blog.csdn.net/xiaanming/article/details/11066685/)/@Override public Boolean OntouChevent (Motionevent event) {if (event.getaction () = = motionevent.action_up) {if (Getcompounddrawables () [2]!= null) {Bo Olean touchable = Event.getx () > (GetWidth ()-gettotalpaddingright ()) && (Event.getx () < (getwidth ()-Get
Paddingright ()));
if (touchable) {//Call Click event (External Implementation) Mightdrawableclick.rightdrawableclick ();}
Return Super.ontouchevent (event);
//Set the Click event for the right button, the external call to implement the method public void Setdrawableclick (Imyrightdrawableclick mymightdrawableclick) {
This.mightdrawableclick = Mymightdrawableclick; ///custom interface (to achieve the right picture Click event) public interface Imyrightdrawableclick {void Rightdrawableclick ()}//Allow external modifications to the right display picture public void SE Trightdrawable (drawable drawable) {rightdrawable = drawable; Setcompounddrawableswithintrinsicbounds (leftDrawable,
NULL, rightdrawable, NULL); }
}

The above is the main code of the custom class, the annotation is more clear.

A direct reference in the layout layout file is good.

<lyf.myimgedittextdemo.imgedittext
android:id= "@+id/pwdiet"
android:layout_width= "0DP"
android: layout_height= "Wrap_content"
android:layout_weight= "1"
android:background= "@null"
android: drawableleft= "@mipmap/mm_image"
android:drawableright= "@mipmap/eye_normal"
android:paddingleft= "15DP"
android:paddingright= "15DP"
android:paddingtop= "5DP"
android:drawablepadding= "15DP"
android:layout_margintop= "10DP"
android:layout_marginbottom= "10DP"
android:hint= "password"
android: Inputtype= "Numberpassword"/>

Let's look at the settings in the code

Pwdiet = (imgedittext) This.findviewbyid (r.id.pwdiet);
Pwdiet.setdrawableclick (New Imgedittext.imyrightdrawableclick () {
@Override public
void Rightdrawableclick () {
if (Ishidden) {
//Set EditText text to be visible
Pwdiet.settransformationmethod ( Hidereturnstransformationmethod.getinstance ());
Pwdiet.setrightdrawable (Getresources (). getdrawable (r.mipmap.eye_selected));
else {
//Set EditText text as hidden
pwdiet.settransformationmethod (Passwordtransformationmethod.getinstance ());
Pwdiet.setrightdrawable (Getresources (). getdrawable (R.mipmap.eye_normal));
Ishidden =!ishidden;
Pwdiet.postinvalidate ();
After switching, place the EDITTEXT cursor at the end
charsequence charsequence = Pwdiet.gettext ();
if (charsequence instanceof spannable) {
spannable spantext = (spannable) charsequence;
Selection.setselection (Spantext, Charsequence.length ());}}
);

So our example is complete.

The above is a small set to introduce the Android development Imitation Jane book login box can delete content or display password box content, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!