FrameLayout叠加顺序异常

最近使用FrameLayout布局实现一个Button在左上角显示一个的删除按钮。
如下图：

问题出现在布局文件：
布局文件如下

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="@dimen/size60"
        android:layout_height="@dimen/size30"
        android:text="生活"
        android:gravity="center"
        android:textSize="@dimen/size14"
        android:id="@+id/btn_subscribe"
        android:layout_marginLeft="5dip"
        android:layout_marginTop="5dip"
        android:textColor="@drawable/text_color_subscribeitem"
        android:background="@drawable/bg_subscrice_item"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="×"
        android:gravity="center"
        android:textColor="@color/common_write"
        android:background="@drawable/scribe_delete"
        android:id="@+id/scribe_delete"
        android:visibility="visible"/>

</FrameLayout>

布局很简单但是效果很奇怪，这是在Android Studio预览时的样子

可以发现在Android不同版本上显示效果不一样，我手机系统是Android5.0运行效果何第一个效果一样，我就不贴出来了。后来我试着把FrameLayout换成了RelativeLayout

结果效果还是一样，后来无意间发现改变布局元素会有不同的效果，如使用两个Button

或者使用两个TextView

发现这样布局叠加顺序就正常，关于问题发生的原因我也Google了，目前没有找到相关资料。目前只能使用这种方法了。很奇怪的现象，特此记录一下。