Greg432
Greg432

Reputation: 540

Getting a picture to display on top of a button with ConstraintLayout

I am trying to put an ImageView and TextView over (on top) of a button using the new ConstraintLayout in Android Studios. Below is what I currently use for my app but RelativeLayouts are very time consuming for making a layout for every device size.

News feed picture

This is my XML

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/frameLayout"
    tools:layout_constraintTop_creator="1"
    android:layout_marginStart="48dp"
    android:layout_marginTop="24dp"
    tools:layout_constraintLeft_creator="1"
    ads:layout_constraintLeft_toLeftOf="parent"
    ads:layout_constraintTop_toTopOf="parent"
    android:layout_marginLeft="48dp">


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/newfeedbtn"
            android:background="@drawable/newsfeedbtn"
            android:visibility="visible" />
    </FrameLayout>


    <ImageView
        android:layout_width="27dp"
        android:layout_height="25dp"
        android:id="@+id/NFRedC"
        android:layout_gravity="right|top"
        tools:ignore="ContentDescription"
        android:background="@drawable/alert"
        android:gravity="center" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#ffffff"
        android:id="@+id/NFTextNumber"
        android:visibility="invisible"
        android:text="0"
        android:layout_gravity="right|top"
        android:layout_marginRight="9dp"
        android:layout_marginTop="3dp" />


</FrameLayout>

Does anyone know a way where I can do this using constraints? or is there a way to specify the order in which pictures are display without using a layout inside a layout? e.g. Microsoft office's "Send to back"

Upvotes: 0

Views: 1220

Answers (1)

MarkInTheDark
MarkInTheDark

Reputation: 244

"is there a way to specify the order in which pictures are display without using a layout inside a layout?"

That's what FrameLayout does automatically. It renders back-to-front, I.e. it draws the children in sequential order. The first child is drawn first, the second on top of that, and the third on top of that.

Why not just do something like the following, similar to what you already have, but without the redundant FrameLayout that currently contains the button?

<FrameLayout...>
    <Button/>
    <TextView/>
    <ImageView/>
</FrameLayout>

Does this make sense or am I misunderstanding you?

Upvotes: 1

Related Questions