Badge goes below/behind another view

[emaillenin]

Here is my layout:

                  <android.support.constraint.ConstraintLayout
                    android:id="@+id/role_bat"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:layout_weight="1"
                    android:alpha="0.8">

                    <TextView
                        android:id="@+id/role_bat_title"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="5dp"
                        android:text="@string/role_bat"
                        android:textAlignment="center"
                        android:textAppearance="@style/TextAppearance.AppCompat.Bold"
                        app:layout_constraintBottom_toTopOf="@id/img_role_bat" />

                    <ImageView
                        android:id="@+id/img_role_bat"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:adjustViewBounds="true"
                        android:src="@drawable/role_bat"
                        app:layout_constraintBottom_toBottomOf="parent" />

                </android.support.constraint.ConstraintLayout>

My target view:

    @BindView(R.id.role_bat_title)
    TextView roleBatTitle;

How I am adding the badge:

new QBadgeView(this).  bindTarget(roleBatTitle).setBadgeNumber(mAdapter.getCountOfPlayers("batsman")).setGravityOffset(5, true);

Sample of what is happening now: note that the badge with 1 goes behind the image. If bind the badge to the imageview itself, the badge doesn't appear (maybe it is hiding under the image).

I want the badge to appear on the bottom right on top of the image.