自定义EditText 实现drawableRight/drawableLeft 点击事件
2016-11-22 13:46
369 查看
我们在开发APP布局时候经常会看到在EditText的右侧或者左侧出现类似如下的ICON
![](https://oscdn.geek-share.com/Uploads/Images/Content/201909/28/9460ad566ec5f2624a8ca1686eb6d630)
以前常用的做法是在最外层使用RelativeLayout包裹内部的ImagView与EditText:
无疑这增加了一层 RelativeLayout 布局给View的绘制增加了时间,有没有更好的方法呢?答案是肯定的EditText给我们提供了 drawableLeft / drawableTop / drawableRight / drawableBottom 即设置EditText的 左上右下的Icon,遗憾的是并没有提供的相应onTouch事件,那么为了实现点击事件需要我们自定EditText自己实现,直接上干货:
public class CustomEditText extends EditText {
private DrawableLeftListener mLeftListener;
private DrawableRightListener mRightListener;
public CustomEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public CustomEditText(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomEditText(Context context) {
super(context);
}
public void setDrawableLeftListener(DrawableLeftListener listener) {
this.mLeftListener = listener;
}
public void setDrawableRightListener(DrawableRightListener listener) {
this.mRightListener = listener;
}
public interface DrawableLeftListener {
public void onDrawableLeftClick(View view);
}
public interface DrawableRightListener {
public void onDrawableRightClick(View view);
}
/**
* 因为我们不能直接给EditText设置点击事件,所以我们用记住我们按下的位置来模拟点击事件
* 当我们按下的位置 在 EditText的宽度 - 图标到控件右边的间距 - 图标的宽度 和
* EditText的宽度 - 图标到控件右边的间距之间我们就算点击了图标,竖直方向就没有考虑
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_UP:
if (mRightListener != null) {
if (getCompoundDrawables()[2] != null) {
boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight()) && (event.getX() < ((getWidth() - getPaddingRight())));
if (touchable) {
try {
hideSoftInput();
mRightListener.onDrawableRightClick(this);
} catch (Exception e) {
e.printStackTrace();
}
} else {
setFocusable();
}
}
}
if (mLeftListener != null) {
if (getCompoundDrawables()[0] != null) {
boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight()) && (event.getX() < ((getWidth() - getPaddingRight())));
if (touchable) {
try {
hideSoftInput();
mLeftListener.onDrawableLeftClick(this);
} catch (Exception e) {
e.printStackTrace();
}
} else {
setFocusable();
}
}
}
break;
}
return super.onTouchEvent(event);
}
/**
* 设置点击EditText右侧图标EditText失去焦点,防止点击EditText右侧图标EditText获得焦点软键盘弹出
* 如果软键盘此刻为显示状态则强直性隐藏
*/
private void hideSoftInput() {
setFocusableInTouchMode(false);
setFocusable(false);
InputMethodManager imm = (InputMethodManager) MyApplication.getApp().getSystemService(Context.INPUT_METHOD_SERVICE);
imm.hideSoftInputFromWindow(this.getWindowToken(), 0);
}
/**
* 设置点击EditText输入区域,EditText请求焦点,软键盘弹出,EditText可编辑
*/
private void setFocusable() {
setFocusableInTouchMode(true);
setFocusable(true);
}
}
XML 布局如下:
效果如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/201909/28/4539813dcd5f39003f5137046e1c5352)
如何使用:
以前常用的做法是在最外层使用RelativeLayout包裹内部的ImagView与EditText:
<RelativeLayout android:id="@+id/relativeLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/login_icon" android:background="@color/color_ffffff"> <EditText android:id="@+id/editview" style="@style/login_editText_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_toLeftOf="@+id/iamgeview" android:hint="@string/login_str"/> <ImageView android:id="@+id/iamgeview" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="10dp" android:background="@drawable/down_arrow_icon" /> </RelativeLayout>
无疑这增加了一层 RelativeLayout 布局给View的绘制增加了时间,有没有更好的方法呢?答案是肯定的EditText给我们提供了 drawableLeft / drawableTop / drawableRight / drawableBottom 即设置EditText的 左上右下的Icon,遗憾的是并没有提供的相应onTouch事件,那么为了实现点击事件需要我们自定EditText自己实现,直接上干货:
public class CustomEditText extends EditText {
private DrawableLeftListener mLeftListener;
private DrawableRightListener mRightListener;
public CustomEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public CustomEditText(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomEditText(Context context) {
super(context);
}
public void setDrawableLeftListener(DrawableLeftListener listener) {
this.mLeftListener = listener;
}
public void setDrawableRightListener(DrawableRightListener listener) {
this.mRightListener = listener;
}
public interface DrawableLeftListener {
public void onDrawableLeftClick(View view);
}
public interface DrawableRightListener {
public void onDrawableRightClick(View view);
}
/**
* 因为我们不能直接给EditText设置点击事件,所以我们用记住我们按下的位置来模拟点击事件
* 当我们按下的位置 在 EditText的宽度 - 图标到控件右边的间距 - 图标的宽度 和
* EditText的宽度 - 图标到控件右边的间距之间我们就算点击了图标,竖直方向就没有考虑
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_UP:
if (mRightListener != null) {
if (getCompoundDrawables()[2] != null) {
boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight()) && (event.getX() < ((getWidth() - getPaddingRight())));
if (touchable) {
try {
hideSoftInput();
mRightListener.onDrawableRightClick(this);
} catch (Exception e) {
e.printStackTrace();
}
} else {
setFocusable();
}
}
}
if (mLeftListener != null) {
if (getCompoundDrawables()[0] != null) {
boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight()) && (event.getX() < ((getWidth() - getPaddingRight())));
if (touchable) {
try {
hideSoftInput();
mLeftListener.onDrawableLeftClick(this);
} catch (Exception e) {
e.printStackTrace();
}
} else {
setFocusable();
}
}
}
break;
}
return super.onTouchEvent(event);
}
/**
* 设置点击EditText右侧图标EditText失去焦点,防止点击EditText右侧图标EditText获得焦点软键盘弹出
* 如果软键盘此刻为显示状态则强直性隐藏
*/
private void hideSoftInput() {
setFocusableInTouchMode(false);
setFocusable(false);
InputMethodManager imm = (InputMethodManager) MyApplication.getApp().getSystemService(Context.INPUT_METHOD_SERVICE);
imm.hideSoftInputFromWindow(this.getWindowToken(), 0);
}
/**
* 设置点击EditText输入区域,EditText请求焦点,软键盘弹出,EditText可编辑
*/
private void setFocusable() {
setFocusableInTouchMode(true);
setFocusable(true);
}
}
XML 布局如下:
<com.xxx.xxxxx.widget.CustomEditText android:id="@+id/loginName" android:layout_below="@+id/login_icon" style="@style/login_editText_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawableRight="@drawable/down_arrow_icon" android:hint="@string/login_str" android:maxLength="15"/> <com.xxx.xxxxx.widget.CustomEditText android:id="@+id/loginPwd" style="@style/login_editText_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/loginName" android:layout_marginTop="1dp" android:drawableRight="@drawable/eys" android:hint="@string/pwd_str" android:inputType="textPassword" android:maxLength="15"/>
效果如下:
如何使用:
public class LoginActivity extends BaseActivity implements CustomEditText.DrawableRightListener { private static final String TAG = LoginActivity.class.getSimpleName(); private CustomEditText nameEditText, pwdEditText; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); baseSetContentView(R.layout.login_activity); showTitleView(false); initView(); } @Override public void initView() { nameEditText = (CustomEditText) findViewById(R.id.loginName); pwdEditText = (CustomEditText) findViewById(R.id.loginPwd); nameEditText.setDrawableRightListener(this); pwdEditText.setDrawableRightListener(this); } @Override public void onDrawableRightClick(View view) { switch (view.getId()) { case R.id.loginName: LogUtil.i(TAG, "onclick"); break; case R.id.loginPwd: LogUtil.i(TAG, "onclick"); break; } } }
相关文章推荐
- EditText设置DrawableRight,DrawableLeft,DrawableTop... 点击事件
- Android中EditText的drawableRight属性设置点击事件
- EditText——右边图片drawableRight的点击事件
- DrawableLeft,DrawableTop,Right,Bottom点击事件的实现
- TextView 和 EditText 的 DrawableRight 点击事件的处理
- 处理edittext中的drawable点击事件?
- Android 设置EditText的DrawableRight和DrawableLeft 的通用点击事件
- 实现一个EditText中间有字,字两边都可点击触发事件的效果
- 给TextView的drawableRight属性设置点击事件
- Android 自定义EditText 实现获得焦点并且有内容显示右侧图片并点击清空内容
- TextView之drawableLeft/drawableRight代码实现
- 怎么处理edittext中的drawable点击事件?
- Android 设置DrawableRight和DrawableLeft点击事件
- android 代码设置editText的 drableRight和drableRight的点击事件
- Android 设置DrawableRight和DrawableLeft 的通用点击事件
- View事件传递(解决聊天界面点击除editText区域以外其他位置实现隐藏软键盘----点击发送按钮不隐藏软键盘)
- Android学习-EditText里面Drawable的点击事件
- Android EditText中通过drawabeRight等添加了清空按钮 如何给按钮添加点击事件?
- Android 设置DrawableRight和DrawableLeft 点击事件
- Android自定义TextView实现drawableLeft内容居中