Как сделать кнопку на этом изображении

Question

Я впечатлен кнопкой в ​​этом пи c. Кто-нибудь может дать мне ключевое слово об этой кнопке для исследования в android? Спасибо и всего наилучшего. https://i.stack.imgur.com/GYT4K.png

Answer 1

Try this.

<?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:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottom_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:fabAttached="true"
        app:backgroundTint="@color/colorPrimary"
        app:fabCradleVerticalOffset="12dp">

    </com.google.android.material.bottomappbar.BottomAppBar>

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:src="@drawable/ic_add_black_24dp"
        app:layout_anchor="@+id/bottom_appbar"/>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.google.android.material.button.MaterialButton
            android:id="@+id/toggle_alignment"
            android:layout_width="wrap_content"
            android:layout_height="48dp"
            android:layout_gravity="center"
            android:textColor="#fff"
            android:text="Toggle FAB alignment"
            app:backgroundTint="@color/colorPrimary"/>

    </FrameLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Некоторые заметки на вынос:

Не вызывайте setSupportActionBar () с предоставленным BottomAppBar, так как он сломает его

Чтобы изменить цвет фона Вы должны вызвать app: backgroundTint вместо setBackground из-за внутреннего управления фоном

Вызов setTitle или setSubtitle не будет иметь никакого эффекта, так как эти методы переопределены и пусты

Answer 2

Попробуйте этот код:

<androidx.coordinatorlayout.widget.CoordinatorLayout
    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">
    <androidx.appcompat.widget.AppCompatTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:id="@+id/textTv"/>
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:focusable="true"
        app:layout_anchor="@id/bottomAppBar"
        app:srcCompat="@drawable/ic_add_circle_black_24dp"
        android:backgroundTint="#FF0000"
        tools:ignore="VectorDrawableCompat" />

    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomAppBar"
        style="@style/Widget.MaterialComponents.BottomAppBar.Colored"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:fabAlignmentMode="center"
        android:backgroundTint="#4CAF50"
        app:navigationIcon="@drawable/ic_open_in_new_white_24dp"/>


</androidx.coordinatorlayout.widget.CoordinatorLayout>

Это будет ваш вывод:

Answer 3

Надеюсь, это сработает для вас.

В android есть виджет под названием «Плавающее действие». Как писать, приведенный ниже

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:src="@drawable/ic_cart"
        android:contentDescription="Add"
        app:fabSize="normal"
        android:layout_margin="16dp"/>

Answer 4

Кнопка, которую вы ищете, представляет собой комбинацию двух виджетов. Нижняя панель приложения и кнопка с плавающим действием. Чтобы это произошло, вы должны применить гравитационное дно к нижней панели приложения, а затем применить app:layout_anchor=@id/bottom_bar к кнопке плавающего действия. root представление должно быть CoordinatorLayout .

Answer 5

Вы можете попробовать найти плавающую кнопку действия android. ( Ваша кнопка Изменить действие. )

В android введено множество кнопок действия в дизайне материала -

1. Редактировать
2. Позвонить
3. Добавить и многое другое

, вы можете попробовать ссылку ниже дизайна материала для кнопки действия редактирования.

кнопки действий материала

Answer 6

Я считаю, что вы ищете кнопку с плавающим действием. Много деталей в https://material.io/components/buttons-floating-action-button/#.