作者:路啦Nantale | 来源:互联网 | 2023-08-11 12:23
有些场景,需要一张图片部分可点击,这样就需要自己提前确定可响应点击范围。这里以ImageView为例,讲一下部分可点击事件。看下效果:我这里一张顶部图片,有个输入框元素,如果元素要
有些场景,需要一张图片部分可点击,这样就需要自己提前确定可响应点击范围。 这里以ImageView 为例,讲一下部分可点击事件。
看下效果: 我这里一张顶部图片,有个输入框元素,如果元素要一个个叠加的话,会比麻烦,直接用一张图片做背景就比较省事,只要处理下 只响应输入框这一部分的点击效果。
首先布局文件中:
android:clickable="true" android:id="@+id/view_top_bg" android:layout_ android:layout_ android:background="@drawable/bg_main_tab_top" />
ImageView 通过重写 onTouchEvent 在ACTION_DOWN、ACTION_MOVE、ACTION_UP、ACTION_CANCEL中判断是否满足条件,满足条件可点击,否则不可响应点击效果。
public class PartClickImageView extends ImageView { private float x;//点击范围的左上角距离屏幕左侧的宽度 private float y;//点击范围的左上角距离屏幕顶部的高度 private float width;//点击范围的宽度 private float height;//点击范围的高度 private boolean clickable = false; //点击事,如果移动范围在可接受范围内,可以响应点击事件 private int acceptRange = 0; private OnRangeClickListener onRangeClickListener; public void setOnRangeClickListener(OnRangeClickListener onRangeClickListener) { this.OnRangeClickListener= onRangeClickListener; } //向外暴露的方法设置ImageView的点击范围 public void setClickRange(float x, float y, float width, float height,int range) { this.x = x; this.y = y; this.width = width; this.height = height; acceptRange = range; } public PartClickImageView(Context context) { super(context); } //给自定义的View设置点击事件 public PartClickImageView(Context context, AttributeSet attrs) { super(context, attrs); } public PartClickImageView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } float downX=0f,downY=0f; @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN: //0 downX = event.getX(); downY = event.getY(); clickable = true; break; case MotionEvent.ACTION_MOVE://2 float tempX = event.getX(); float tempY = event.getY(); if(Math.abs(tempX-downX)>acceptRange||Math.abs(tempY-downY)>acceptRange){ clickable = false; } break; case MotionEvent.ACTION_UP://1 float currentX = event.getX(); float currentY = event.getY(); if (clickable&¤tX > x && currentX <(x + width) && currentY > y && currentY <(y + height)) { //在点击范围内,触发点击事件 onRangeClickListener.onClickImage(this); } break; case MotionEvent.ACTION_CANCEL://3 clickable = false; break; return super.onTouchEvent(event); } //重新定义图片的点击事件 public interface OnRangeClickListener { void onClickImage(View view); } }
使用:
float x = 20*ScreenUtil.getScreenWidth()/360; float y = 110*ScreenUtil.getScreenWidth()/360; float width = ScreenUtil.getScreenWidth() - 2*x; float height = 50*ScreenUtil.getScreenWidth()/360; //设置点击区域 holder.mViewTopBg.setClickRange(x,y ,width,height,0); holder.mViewTopBg.setOnRangeClickListener(new PartClickImageView.OnRangeClickListener() { @Override public void onClickImage(View view) { } });
如果你也热衷技术欢迎加群一起进步:230274309 。 一起分享,一起进步!少划水,多晒干货!!欢迎大家!!!(进群潜水者勿加)
点击链接加入群聊【编程之美】:https://jq.qq.com/?_wv=1027&k=h75BfFCg
或者扫码