几年前遇到的一个bug，不弄清楚心里就是不舒服！
平时应用开发中，经常遇到的UI需求，例如抖音的设置界面，如下图所示：
很容易想到，自定义一个Layout，左边一个图标，中间文字说明，右侧一个箭头，底部一条分割线。点击整个条目，跳转到另外一个Activity。动手写的时候，就遇到bug了，item的点击事件不起作用。
看bug情况，如下图：
点击子View有效果，点击自定义的布局没有log。这是怎么回事？
看看代码：
public class RelativeActivity extends AppCompatActivity {
@Override
protected 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() {
@Override
public void onClick(View v) {
Log.i("xx", "click MyRelativeLayout");
}
});
ImageView iv = findViewById(R.id.iv);
iv.setOnClickListener(new OnClickListener() {
@Override
public 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"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="通用设置"
android:textSize="28sp" />
<ImageView
android: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，后面的博客，会继续跟踪代码，深挖原因！
