How to make a imagebutton from PNG?

Issue

I am trying to implement an imagebutton from a png. However, I can neither implemente my semi transparent background (it stays the squared grid), nor can I put it in the correct corner! Any help to solve this two problems would be appreciated. The code:

<ImageButton
        android:id="@+id/maps_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/maps_symbol"
        android:scaleX="0.12"
        android:scaleY="0.12"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:background="#50F8F5F5"
        android:layout_marginBottom="10sp"
        />

Photo of the current situation:

Solution

 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintEnd_toEndOf="parent" 

according to your constraints the image would be in the centre (if not given margins)

you can change the constraint to be adjacent to that image like

app:layout_constraintStart_toEndOf="@+id/button1" 
app:layout_constraintBottom_toBottomOf="parent"

or have

app:layout_constraintStart_toStartOf="parent" 
app:layout_constraintBottom_toBottomOf="parent" and give required android:layout_margin 

I am assuming you are making it smaller by scaling it down, it may look smaller but the outline is still the same size, change the image width and height

<ImageButton
        android:id="@+id/maps_button"
        android:layout_width="12dp" //desired dimensions
        android:layout_height="12dp" //desired dimensions
        android:src="@drawable/maps_symbol"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:background="#50F8F5F5"
        android:layout_marginBottom="" //desired dimensions
        android:layout_marginStart= "" 
        />

Answered By - Greeshma