Отже, у своєму build.gradleфайлі додайте це:
compile 'com.android.support:design:27.1.1'
AndroidX Примітка: Google представляє нові бібліотеки розширень AndroidX, щоб замінити старі бібліотеки підтримки. Щоб використовувати AndroidX, спочатку переконайтеся , що ви оновили свій gradle.propertiesфайл , відредагований build.gradleв набір , compileSdkVersionщоб 28(або вище), і такий рядок замість попередніх compileодин.
implementation 'com.google.android.material:material:1.0.0'
Далі, в вашому themes.xmlабо styles.xmlабо будь-який інший , переконайтеся , що ви встановили this- це вашого застосування акцент color-- і колір вашого FAB , якщо не перевизначити його (дивіться нижче):
<item name="colorAccent">@color/floating_action_button_color</item>
У XML макета:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.design.widget.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Або якщо ви використовуєте бібліотеку матеріалів AndroidX вище, замість цього скористайтеся цим:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:srcCompat="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Більше варіантів можна побачити в документах (тут ви знайдете матеріальні документи) ( setRippleColorтощо), але одна з приміток:
app:fabSize="mini"
Ще один цікавий варіант - щоб змінити колір фону лише одного FAB, додайте:
app:backgroundTint="#FF0000"
(наприклад, змінити його на червоний) у XML вище.
У будь-якому випадку, у коді, після того, як перегляд Діяльності / Фрагменту завищений ....
FloatingActionButton myFab = (FloatingActionButton) myView.findViewById(R.id.myFAB);
myFab.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
doMyThing();
}
});
Спостереження:
- Якщо у вас є одна з цих кнопок, яка знаходиться на "шві", розділяючи два види (наприклад, використовуючи RelativeLayout) з, скажімо, від'ємним нижнім полем макета для перекриття межі, ви помітите проблему: розмір FAB насправді дуже різні від льодяника проти попереднього льодяника. Це насправді можна побачити у візуальному редакторі компонування AS, коли ви переходите між API-програмами - воно раптово «вихлюпується», коли ви переходите на попередній льодяник. Причина додаткового розміру, здається, полягає в тому, що тінь розширює розмір виду в кожному напрямку. Тому вам доведеться враховувати це, коли ви коригуєте маржу FAB, якщо вона близька до інших речей.
Ось спосіб видалити або змінити прокладки, якщо їх занадто багато:
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
RelativeLayout.LayoutParams p = (RelativeLayout.LayoutParams) myFab.getLayoutParams();
p.setMargins(0, 0, 0, 0); // get rid of margins since shadow area is now the margin
myFab.setLayoutParams(p);
}
Крім того, я збирався програмно розмістити FAB на "шві" між двома областями в RelativeLayout, захопивши висоту FAB, розділившись на два, і використавши це як зміщення поля. Але myFab.getHeight () повернув нуль, навіть після того, як перегляд був завищений, здавалося. Натомість я використав ViewTreeObserver, щоб отримати висоту лише після того, як він викладений, а потім встановити положення. Дивіться цю пораду
тут . Виглядало так:
ViewTreeObserver viewTreeObserver = closeButton.getViewTreeObserver();
if (viewTreeObserver.isAlive()) {
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
closeButton.getViewTreeObserver().removeGlobalOnLayoutListener(this);
} else {
closeButton.getViewTreeObserver().removeOnGlobalLayoutListener(this);
}
// not sure the above is equivalent, but that's beside the point for this example...
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) closeButton.getLayoutParams();
params.setMargins(0, 0, 16, -closeButton.getHeight() / 2); // (int left, int top, int right, int bottom)
closeButton.setLayoutParams(params);
}
});
}
Не впевнений, чи правильно це зробити, але, здається, працює.
- Здається, ви можете зменшити тіньовий простір кнопки, зменшивши висоту.
Якщо ви хочете , FAB на «шов» ви можете використовувати layout_anchorі layout_anchorGravityось приклад:
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="@drawable/ic_discuss"
android:layout_margin="@dimen/fab_margin"
android:clickable="true"/>
Пам’ятайте, що ви можете автоматично змусити кнопку стрибати з шляху, коли з'являється закусочна , загорнувши її в CoordinatorLayout .
Більше:
