几年前遇到的一个bug,不弄清楚心里就是不舒服!
平时应用开发中,经常遇到的UI需求,例如抖音的设置界面,如下图所示:
很容易想到,自定义一个Layout,左边一个图标,中间文字说明,右侧一个箭头,底部一条分割线。点击整个条目,跳转到另外一个Activity。动手写的时候,就遇到bug了,item的点击事件不起作用。
看bug情况,如下图:
点击子View有效果,点击自定义的布局没有log。这是怎么回事?
看看代码:
public class RelativeActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_relative);}
}//activity布局:
<?xml version="1.0" encoding="utf-8"?>
<com.exp.clickdemo.rl_bug.MyRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="wrap_content"></com.exp.clickdemo.rl_bug.MyRelativeLayout>
自定义的布局MyRelativeLayout:
public class MyRelativeLayout extends RelativeLayout {public MyRelativeLayout(Context context) {this(context,null);}public MyRelativeLayout(Context context, @Nullable AttributeSet attrs) {this(context, attrs,0);}public MyRelativeLayout(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);inflater.inflate(R.layout.my_relativelayout, this);setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {Log.i("xx", "click MyRelativeLayout");}});ImageView iv = findViewById(R.id.iv);iv.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {Log.i("xx", "click ImageView");}});}
}
item布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="80dp"android:clickable="true"android:background="#00ff00"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerVertical="true"android:text="通用设置"android:textSize="28sp" /><ImageViewandroid:id="@+id/iv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_centerVertical="true"android:src="@drawable/icon_goto" /></RelativeLayout>
按道理讲,点击箭头左侧区域,应该有日志“click MyRelativeLayout" 才对。为什么没有了?
在设置点击事件的后面加一行代码:
Log.i("xx", "MyRelativeLayout is clickable:" + isClickable());
日志显示:I/xx: MyRelativeLayout is clickable:true
,也就是说MyRelativeLayout可以点击,可以点击,又有点击事件,为啥就不起作用了?
继续尝试,把item布局中android:clickable="true"
去掉,神奇的是,点击事件竟然起作用了,这里就不贴日志和效果了。不卖关子了,直接说原因:设置android:clickable="true"
后,布局中的RelativeLayout消费了点击事件,但是这个RelativeLayout又没有onClickListener,所以没有日志。外层的MyRelativeLayout虽然可以点击,也设置了点击事件,但是点击事件已经被RelativeLayout消费了。把android:clickable="true"
去掉后,RelativeLayout不可点击,消费事件回传给MyRelativeLayout,这样点击事件又起作用了。
为了验证上面的分析,我们把android:clickable="true"
再加回去,在Activity的布局中,给MyRelativeLayout加上红色背景,再设置padding:
android:padding="20dp"android:background="#ff0000"
点击看看效果:
可以看出MyRelativeLayout的点击事件是起作用的,只不过没有回传给它,就已经消费调了。而消费点击事件的RelativeLayout,又没有设置onClickListener,所以点击就没有日志。
代码已经上传到Gitee上,地址是:https://gitee.com/zhagnjinaaaa/click-demo,后面的博客,会继续跟踪代码,深挖原因!