Android – EditText(三) 带自动清空按钮的输入框
目标:未输入时与普通EditText没两样,一旦检测到有内容输入,在输入框内部右侧显示清除图标,点击该图标时则清空输入框内所有内容,同时图标隐藏,然后往复。
效果:
代码解析:
-
布局:(只要设置id,宽高就可以)
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="@dimen/padding_10" android:orientation="horizontal"> <com.example.toollibs.OverWriteClass.EditTextDelIcon android:id="@+id/etDel" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" android:ellipsize="middle" android:singleLine="true" android:paddingLeft="@dimen/padding_5" android:paddingTop="@dimen/padding_3" android:paddingBottom="@dimen/padding_3" android:background="@drawable/edit_text_frame" /> <Button android:id="@+id/bEnter" android:layout_width="wrap_content" android:layout_height="35dp" android:layout_gravity="center_vertical" android:layout_marginLeft="@dimen/margin_5" android:text="Enter" android:textColor="@color/colorWhite" android:background="@drawable/selector_button"/> </LinearLayout>
-
应用:(与EditText使用相同)
private EditTextDelIcon etDel; etDel = findViewById(R.id.etDel); String temp = etDel.getText().toString();//获取输入框内容
-
自定义类:
-
EditTextDelIcon.java (带清空图标的EditText, 图标可多种格式:png, jpg, svg…)
public class EditTextDelIcon extends android.support.v7.widget.AppCompatEditText { private Context context; private Drawable icon; public EditTextDelIcon(Context context, AttributeSet attrs) { super(context, attrs); this.context = context; Init(); } private void Init() { //set delete icon; icon = context.getResources().getDrawable(R.drawable.ic_del_icon); //set text change listener; addTextChangedListener(new TextWatcher() { @Override public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) { } @Override public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) { } @Override public void afterTextChanged(Editable editable) { SetDrawable(); } }); } private void SetDrawable() { if (length() < 1) { setCompoundDrawablesWithIntrinsicBounds(null, null, null, null); } else { setCompoundDrawablesWithIntrinsicBounds(null, null, icon, null); } } @Override public boolean onTouchEvent(MotionEvent event) { if (icon != null && event.getAction() == MotionEvent.ACTION_UP) { int eventX = (int) event.getRawX(); int eventY = (int) event.getRawY(); Rect rect = new Rect(); getGlobalVisibleRect(rect); rect.left = rect.right - 24;//图标宽度 if (rect.contains(eventX, eventY)) { setText("");//clear contents } } return super.onTouchEvent(event); } @Override protected void finalize() throws Throwable { super.finalize(); } }
-
SVG 删除图标:(ic_del_icon.xml, 系统自带的一个svg)
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="24dp" android:height="24dp" android:viewportWidth="24" android:viewportHeight="24" android:tint="?attr/colorControlNormal"> <path android:fillColor="#595959" android:pathData="M14.59,8L12,10.59 9.41,8 8,9.41 10.59,12 8,14.59 9.41,16 12,13.41 14.59,16 16,14.59 13.41,12 16,9.41 14.59,8zM12,2C6.47,2 2,6.47 2,12s4.47,10 10,10 10,-4.47 10,-10S17.53,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8z"/> </vector>
-
edit_text_frame.xml (自定义输入框外框)
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <stroke android:color="@color/colorGery" android:width="1dp"/> <corners android:radius="10dp"/> </shape>
-
selector_button.xml (button 点击效果)
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="false"> <shape android:shape="rectangle"> <stroke android:color="@color/colorPrimary" android:width="1dp"/> <solid android:color="@color/colorPrimary"/> <corners android:radius="15dp"/> </shape> </item> <item android:state_pressed="true"> <shape android:shape="rectangle"> <stroke android:color="@color/colorTY_Half" android:width="1dp"/> <solid android:color="@color/colorTY_Half"/> <corners android:radius="15dp"/> </shape> </item> </selector>
-