I'm trying to setup a vector asset into a fab. But the result is like this: As you can see the vector is there but way down and to the left. here is the layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorBg"
tools:context=".ui.main.fragments.HomeFragment">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab_new_sale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
app:backgroundTint="@color/colorAccent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:srcCompat="@drawable/ic_cart_plus"
android:scaleType="center"/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_home_cards"
android:layout_width="0dp"
android:layout_height="0dp"
android:foregroundGravity="center_vertical|center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
And heres is the vector:
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="200dp"
android:height="200dp"
android:viewportWidth="200"
android:viewportHeight="200">
<path
android:fillColor="#FF000000"
android:pathData="M165.1,119.28L75,119.28l2,9.84h82.48a7.37,7.37 0,0 1,7.19 9l-1.7,7.46a17.2,17.2 0,1 1,-19.54 3.19L81,148.77a17.21,17.21 0,1 1,-20.6 -2.63L38.85,40.62L17.38,40.62A7.38,7.38 0,0 1,10 33.24L10,28.33A7.37,7.37 0,0 1,17.38 21h31.5a7.38,7.38 0,0 1,7.23 5.9l2.81,13.77h120.7a7.37,7.37 0,0 1,7.19 9l-14.52,63.91A7.38,7.38 0,0 1,165.1 119.28ZM135.38,72.58L120.63,72.58L120.63,60.28a4.92,4.92 0,0 0,-4.92 -4.91h-4.92a4.91,4.91 0,0 0,-4.91 4.91v12.3L91.13,72.58a4.91,4.91 0,0 0,-4.92 4.91v4.92a4.92,4.92 0,0 0,4.92 4.92h14.75L105.88,99.62a4.91,4.91 0,0 0,4.91 4.91h4.92a4.92,4.92 0,0 0,4.92 -4.91L120.63,87.33h14.75a4.92,4.92 0,0 0,4.91 -4.92L140.29,77.49A4.91,4.91 0,0 0,135.38 72.58Z" />
</vector>
I will appreciate any help with this issue
Add the floating action button to your layout The size of the FAB, using the app:fabSize attribute or the setSize() method. The ripple color of the FAB, using the app:rippleColor attribute or the setRippleColor() method. The FAB icon, using the android:src attribute or the setImageDrawable() method.
The button should be placed in the bottom right corner of the screen. The recommended margin for the bottom is 16dp for phones and 24dp for tablets. In the example above, 16dp was used. The actual drawable size should be 24dp according to the Google design specs.
Floating action buttons are implemented in the app's UI for primary actions (promoted actions) for the users and the actions under the floating action button are prioritized by the developer. For example the actions like adding an item to the existing list.
Set
android {
defaultConfig {
vectorDrawables.useSupportLibrary = true
}
}
in your build.gradle
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With