Android login interface implementation-supports clear input box and vibration effect, android input box
Demo Effect
The main code is as follows:
A custom EditText, used to display clear buttons when there is text:
Import android. content. context; import android. graphics. drawable. drawable; import android. text. editable; import android. text. textWatcher; import android. util. attributeSet; import android. view. motionEvent; import android. view. view; import android. view. animation. animation; import android. view. animation. cycleInterpolator; import android. view. animation. translateAnimation; import android. widget. editText; public cl Ass ClearEditText extends EditText implements View. onFocusChangeListener, TextWatcher {// reference of the delete button private Drawable mClearDrawable; // check whether the control has focus private boolean hasFoucs; public ClearEditText (Context context) {this (context, null );} public ClearEditText (Context context, AttributeSet attrs) {// The constructor is also very important here. Without this attribute, you cannot define this (context, attrs, android. r. attr. editTextStyle);} public ClearEditText (Cont Ext context, AttributeSet attrs, int defStyle) {super (context, attrs, defStyle); init ();} private void init () {// obtain the DrawableRight of EditText, if this parameter is not set, use the default image mClearDrawable = getCompoundDrawables () [2]; if (mClearDrawable = null) {// throw new NullPointerException ("You can add drawableRight attribute in XML"); mClearDrawable = getResources (). getDrawable (R. drawable. selector_ic_delete);} // getIntr InsicWidth () is the width of Drawable on the mobile phone. Therefore, different values are obtained at different resolutions. The key is mClearDrawable. setBounds (0, 0, mClearDrawable. getIntrinsicWidth (), mClearDrawable. getIntrinsicHeight (); // by default, the hidden icon setClearIconVisible (false) is set. // setOnFocusChangeListener (this) is used to set a listener with a changed focus ); // set the listening addTextChangedListener (this);}/*** in the input box because we cannot directly set the click event for EditText, so we use the place where we press it to simulate the Click Event * When we press the position in the EditText width-the distance from the icon to the right of the control-the width of the icon and * Edi Width of tText-even if the distance between the icon and the right of the control is clicked, the vertical direction is not considered */@ Override public boolean onTouchEvent (MotionEvent event) {if (event. getAction () = MotionEvent. ACTION_UP) {if (getCompoundDrawables () [2]! = Null) {boolean touchable = event. getX ()> (getWidth ()-getTotalPaddingRight () & (event. getX () <(getWidth ()-getPaddingRight (); if (touchable) {this. setText ("") ;}} return super. onTouchEvent (event);}/*** when the ClearEditText focus changes, determine the display and hide of the clear icon in the string length settings */@ Override public void onFocusChange (View v, boolean hasFocus) {this. hasFoucs = hasFocus; if (hasFocus) {setClearIconVisible (getT Ext (). length ()> 0) ;}else {setClearIconVisible (false) ;}}/*** sets the display and hide of the clear icon, call setCompoundDrawables to plot it for EditText * @ param visible */protected void setClearIconVisible (boolean visible) {Drawable right = visible? MClearDrawable: null; setCompoundDrawables (getCompoundDrawables () [0], getCompoundDrawables () [1], right, getCompoundDrawables () [3]);} /*** callback method when the content in the input box changes */@ Override public void onTextChanged (CharSequence s, int start, int count, int after) {if (hasFoucs) {setClearIconVisible (s. length ()> 0) ;}}@ Override public void beforeTextChanged (CharSequence s, int start, int count, int after) {}@ Override public void afterTextChanged (Editable s) {}/*** set shaking animation */public void setShakeAnimation () {this. setAnimation (shakeAnimation (5);}/*** shake Animation * @ param counts 1 second shake how many times * @ return */public static Animation shakeAnimation (int counts) {Animation translateAnimation = new TranslateAnimation (0, 10, 0, 0); translateAnimation. setInterpolator (new CycleInterpolator (counts); translateAnimation. setDuration (1000); return translateAnimation ;}}
MainActivity. java mainly refers to the Click Event of a button in a pop-up sentence.
Import android. OS. bundle; import android. view. view; import android. widget. button; import android. widget. toast; import android. app. activity; public class MainActivity extends Activity {private Button btnLogin; @ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_login); btnLogin = (Button) this. findViewById (R. id. btnLogin);} public void login (View view) {Toast. makeText (this, "login", Toast. LENGTH_LONG ). show ();}}
The layout file is as follows:
<? Xml version = "1.0" encoding = "UTF-8"?> <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "fill_parent" android: layout_height = "fill_parent" android: background = "# ffffffff" android: orientation = "vertical" android: padding = "4.0dip"> <com. xuliugen. clearedittext. clearEditText android: id = "@ + id/etxtEmail" style = "@ style/editText" android: layout_width = "fill_parent" android: layout_height = "wrap_content" android: layout_marginTop = "30347dip" android: drawableLeft = "@ drawable/icon_reg_name" android: drawablePadding = "10.0dip" android: hint = "use email login"/> <com. xuliugen. clearedittext. clearEditText android: id = "@ + id/etxtPwd" style = "@ style/editText" android: layout_width = "fill_parent" android: layout_height = "wrap_content" android: layout_marginTop = "2020.dip" android: drawableLeft = "@ drawable/icon_reg_password" android: drawablePadding = "10.0dip" android: hint = "Enter the login password" android: inputType = "textPassword"/> <Button android: id = "@ + id/btnLogin" style = "@ style/bigGreenButton" android: layout_width = "fill_parent" android: layout_height = "wrap_content" android: layout_marginTop = "2020.dip" android: onClick = "login" android: text = "login"/> </LinearLayout>
There are also some selector files and image resources:
Bg_btn_style_green.xml
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="false"><shape android:shape="rectangle"> <corners android:radius="2.0dip" /> <solid android:color="@color/green_btn_color_disable" /> </shape></item> <item android:state_pressed="true"><shape android:shape="rectangle"> <corners android:radius="2.0dip" /> <solid android:color="@color/green_btn_color_pressed" /> </shape></item> <item><shape android:shape="rectangle"> <corners android:radius="2.0dip" /> <solid android:color="@color/green_btn_color_normal" /> </shape></item></selector>
Bg_edittext_selector.xml
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/input_bar_bg_active" android:state_focused="true"/> <item android:drawable="@drawable/input_bar_bg_normal"/></selector>
Free projects:
Http://yunpan.cn/cwWymCEMmgTzp (extract code: 317d)