如何在此图像中制作一个按钮

时间:2020-03-09 01:47:20

标签: android button styles

此图片中的按钮给我留下了深刻的印象。有人可以给我关于此按钮的关键字以在android中进行研究吗?谢谢和最好的问候。 https://i.stack.imgur.com/GYT4K.png

6 个答案:

答案 0 :(得分:0)

我相信您正在寻找的是“浮动操作按钮”。 https://material.io/components/buttons-floating-action-button/#上有很多细节。

答案 1 :(得分:0)

您可以尝试搜索浮动操作按钮android。(您是“编辑操作”按钮。

在材质设计中引入了很多Android操作按钮-

  1. 编辑
  2. 致电
  3. 添加 还有更多

您可以在下面的“材料设计”链接中尝试使用“编辑操作”按钮。

material action buttons

答案 2 :(得分:0)

您要查找的按钮是两个小部件的组合。底部的应用栏和浮动操作按钮。为此,您必须在底部应用栏上应用重力底部,然后在“浮动操作”按钮上应用 app:layout_anchor = @ id / bottom_bar 。根视图应为 CoordinatorLayout

答案 3 :(得分:0)

我希望这对您有用。

在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"/>

答案 4 :(得分:0)

尝试以下代码:

<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>

这将是您的输出:

enter image description here

答案 5 :(得分:0)

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>

一些要点:

请勿使用提供的BottomAppBar调用setSupportActionBar(),因为它将破坏它

由于背景的内部管理,因此应更改背景颜色,应调用app:backgroundTint而不是setBackground

调用setTitle或setSubtitle无效,因为这些方法被覆盖且为空