How to fix this floating buttons?

Question

Buttons looks bad. The buttons are on the edge of the device and the icons are off-centered. Im new to android. Here's my layout code.

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<com.mapbox.mapboxsdk.maps.MapView
    android:id="@+id/mapView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    mapbox:mapbox_cameraZoom="15"
    mapbox:mapbox_cameraZoomMax="17"
    mapbox:mapbox_cameraZoomMin="8" >

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab_location_search"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="320dp"
        android:layout_marginLeft="320dp"
        android:layout_marginTop="60dp"
        android:tint="@android:color/white"
        app:backgroundTint="@color/colorPrimary"
        app:srcCompat="@android:drawable/ic_search_category_default" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/status_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="320dp"
        android:layout_marginLeft="320dp"
        android:layout_marginTop="150dp"
        android:tint="@android:color/white"
        app:backgroundTint="@color/colorPrimary"
        app:srcCompat="@android:drawable/ic_menu_more" />
    </com.mapbox.mapboxsdk.maps.MapView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

What layout should I use? What layout should I use? What layout should I use?

Answer 1

You have set fixed marginStart which not correctly worked for all devices. Instead use layout_gravity with end and some margin. Check below:

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab_location_search"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end"
    android:layout_marginEnd="16dp"
    android:layout_marginTop="60dp"
    android:tint="@android:color/white"
    app:backgroundTint="@color/colorPrimary"
    app:srcCompat="@android:drawable/ic_search_category_default" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/status_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end"
    android:layout_marginEnd="16dp"
    android:layout_marginTop="150dp"
    android:tint="@android:color/white"
    app:backgroundTint="@color/colorPrimary"
    app:srcCompat="@android:drawable/ic_menu_more" />