Почему моя плавающая кнопка действия не отображает изображение правильно?

Question

This is what my floating action button is showing

скорее всего, просто показывая фактическую круговую часть изображения, она пытается поместить фон моего .png-файла в кнопку плавающего действия.

вот мой XML-код:

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/addToKitchenButton" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_margin="16dp" 
    android:layout_gravity="bottom|end" 
    android:layout_alignParentBottom="true" 
    android:layout_alignParentEnd="true" 
    android:src="@drawable/fab_icon" 
    /> 

how do I get it to look like this?

Я дал мой .png файл с прозрачным фоном уже, так что я не знаю, что еще мне нужно сделать. Пожалуйста помоги.

Thank you.

Answer 1

(Предполагая, что вы используете Android Studio). Вместо того, чтобы использовать свой собственный .png для src FloatingActionButton, создайте новый векторный ресурс с этим значком. Щелкните правой кнопкой мыши папку res/drawable в Android Studio, а затем выберите New -> Vector Asset.

значок вы используете встраивается в Android Studio, хотя вы можете импортировать свой собственный вектор актив, если вы делаете что-то более обычай. XML он генерирует будет выглядеть следующим образом:

<vector xmlns:android="http://schemas.android.com/apk/res/android" 
    android:width="24dp" 
    android:height="24dp" 
    android:viewportWidth="24.0" 
    android:viewportHeight="24.0"> 
<path 
    android:fillColor="#FF000000" 
    android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/> 

и вы можете изменить цвет в FillColor. Установите FloatingActionButton на этот вариант для Android в андроиде: src, и вам хорошо идти.

Answer 2

Вам не нужно предоставлять закругленное угловое изображение. Я использую и я мой XML выглядит следующим образом

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/addFolder" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_margin="16dp" 
    android:clickable="true" 
    android:src="@drawable/plus" 
    app:layout_anchor="@id/mainRl" 
    android:background="#ff0000" 
    app:layout_anchorGravity="bottom|right|end" 
    android:onClick="onAddFolderClick" 

    /> 

Я использую # FF0000 (красный) как цвет фона, использовать розовый цвет вы хотите. Он отлично работает для меня.

Answer 3

Для последовательного взгляда вам нужно сделать два тона. Этот ответ подразумевает, что вы действительно хотите, чтобы выглядеть в ссылке, предоставленной Вами, который this

1. Первый шаг - цвет фона не что иное, как ваше приложение акцент цвета вам не нужно предоставлять какой-либо определенный цвет. Поэтому сначала убедитесь, что у вас есть цвет акцента в вашей теме приложения.

2. Второй шаг - После того, как вы это сделали, вам нужно использовать код xml ниже. Вам даже не нужно создавать новый png, если вы хотите посмотреть ссылку. Вы можете легко загрузить один значок белого цвета с this official google material icons link.Вы можете использовать эти ссылки для большинства стандартных значков материалов Google.

---

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="bottom|end" 
    android:layout_margin="@dimen/fab_margin" 
    android:src="@drawable/ic_add_white_24dp"/> 

Надеется, что это помогает.Сообщите мне, изменили ли это для вас.

EDIT:: Если вы хотите изменить цвет значка и фона на что-то совсем другое, чем используемый по умолчанию цвет акцента, то вы должны использовать эти attributes-

// для пользовательского фона

app:backgroundTint="@color/yourCustomColor" 

// для пользовательских иконок цвета

android:tint="@color/yourCustomColor"