Overlap textviews in LinearLayout

Question

My problem is that i want to overlap two TextViews in a LinearLayout. On smartphone looks alright, but on tablet the negative margin gives me a hard time.

This is the layout i want to obtain

And here is the code. How can i modify it so i can overlap one text view on the upper right part of the other text view without using negative margin?

<FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="@drawable/bottom_bar_back_with_arrow"

            android:layout_weight="1">
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_gravity="center">

                <TextView
                    android:id="@+id/mShowHideScale"
                    style="@style/BottomBarButton"
                    android:layout_weight="1"
                    android:drawableTop="@drawable/show_calibrate_tool"
                    android:text="Calibrate" />

                <TextView
                    android:id="@+id/badgeRadius"
                    android:layout_width="14dip"
                    android:layout_height="14dip"
                    android:textColor="@color/primary_color"
                    android:textStyle="bold"
                    android:gravity="center"
                    android:background="@drawable/shape_notification"
                    android:layout_marginLeft="-18dp"
                    android:layout_marginTop="-27dp"/>
            </LinearLayout>
          </FrameLayout>

Answer 1

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:clickable="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/White">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.UTU.View.UtuTextView
            android:visibility="visible"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:gravity="center"
            android:textStyle="bold"
            android:textSize="17sp"
            android:text="" />

        <com.UTU.View.UtuButton
            android:id="@+id/btn_crop"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/transparent_full"
            android:textColor="@color/black"
            android:clickable="true"
            android:layout_marginTop="30dp"
            android:text="Select Image" />

        <FrameLayout
            android:background="@drawable/utu_round_background"
            android:layout_marginRight="10dp"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_gravity="right">

            <ImageView
                android:background="@color/red"
                android:src="@drawable/icon_user_default"
                android:id="@+id/iv_fragment_dashboard_user_image"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_gravity="right" />

            <ImageView
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:src="@drawable/icon_profile_border" />
        </FrameLayout>

    </FrameLayout>

</LinearLayout>

Try this. I use my code to modify some layout to test, for circle drawing, you may try to modify the background of the image or button.