logo标签列表

带有浮动操作按钮的圆形进度条

androidandroid-5.0-lollipopmaterial-designfloating-action-button
25
5个回答
15

这对我很有用，我使用了一个RelativeLayout，并将两个内容都放在RelativeLayout的中央。

...
<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|right"
    android:layout_margin="16dp"
    app:layout_anchor="@id/my_recycler_view"
    app:layout_anchorGravity="bottom|right|end"
    >

    <ProgressBar
        android:id="@+id/fabProgress"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerInParent="true"
        android:indeterminateTint="@color/colorPrimary"
        />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/newReportButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@android:drawable/ic_dialog_email"
        app:fabSize="normal"
        android:layout_centerInParent="true"
        />

</RelativeLayout>
...
4
您可以使用它：https://github.com/DmitryMalkovich/circular-with-floating-action-button，将浮动操作按钮与圆形进度条集成。该解决方案不是自定义的 FAB，而只是一个简单的容器，您可以像以前一样进行样式设置！
<com.dmitrymalkovich.android.ProgressFloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/fab_margin"
    android:clickable="true">

    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_backup_black_24dp" />

    <ProgressBar
        style="@style/Widget.AppCompat.ProgressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</com.dmitrymalkovich.android.ProgressFloatingActionButton>
虽然这个链接可能回答了问题，但最好在此处包含答案的基本部分并提供参考链接。如果链接页面更改，则仅有链接的答案可能会变得无效。- 来自审核 - Muhammed Refaat
1
谢谢@MuhammedRefaat。现在好一些了吗？ - Dmitry
当然，这是一个完整和充分的答案。 - Muhammed Refaat
2
我建议使用Jorge Costillo的Floating Action Button。相较于我也试过的被采纳答案中的Kurt的FAB，Costillo的更好。
Kurt的FAB不支持矢量绘图（srcCompat属性），存在图像大小问题、不支持fab-mini以及与材料设计指南不匹配。
Costillo的FAB更像是标准Android FAB的包装器。
你测试过这个吗？https://dev59.com/qF8e5IYBdhLWcg3wRYwk#36667320 - Ewoks
是的。我已经在我的项目中实现了它，但是本地复制了这些类，而不是使用gradle导入。还进行了一些调整。 - Zon
很酷...所以你仍然认为Jorge的那个是最好的吗？提前感谢。 - Ewoks
1
我尝试了两种方法，发现Costillo的FAB更易于采用，因为上述原因。 - Zon
这是一个很棒的库，但当你的父布局是FrameLayout时它无法工作。 - Vikas Patidar
0

我已经解决了这个问题，通过将进度条添加到布局中，并使用自定义行为来控制进度条。

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.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="es.mediaserver.newinterfacedlna.MainActivity">

    <android.support.design.widget.AppBarLayout android:layout_width="match_parent"
        android:layout_height="wrap_content" android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar android:id="@+id/toolbar"
            android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main"
        android:id="@+id/include" />

    <android.support.design.widget.FloatingActionButton android:id="@+id/fab"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:layout_margin="28dp"
        android:layout_gravity="bottom|center"
        app:srcCompat="@android:drawable/ic_media_play" />

    <ProgressBar
        android:id="@+id/progressBar2"
        style="?android:attr/progressBarStyle"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_gravity="bottom|center"
        android:indeterminate="true"
        android:layout_margin="@dimen/fab_margin"
        />

</android.support.design.widget.CoordinatorLayout>

自定义行为组件

    public static class SnackBarBehavior extends CoordinatorLayout.Behavior<View> {
    private static final boolean SNACKBAR_BEHAVIOR_ENABLED;
    public SnackBarBehavior() {
        super();
    }
    public SnackBarBehavior(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) {
        return SNACKBAR_BEHAVIOR_ENABLED && dependency instanceof Snackbar.SnackbarLayout;
    }

    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, View child, View dependency) {
        float translationY = Math.min(0, dependency.getTranslationY() - dependency.getHeight());
        child.setTranslationY(translationY);
        return true;
    }

    @Override
    public void onDependentViewRemoved(CoordinatorLayout parent, View child, View dependency) {
        child.setTranslationY(0);
    }

    static {
        SNACKBAR_BEHAVIOR_ENABLED = Build.VERSION.SDK_INT >= 11;
    }
}

最后，在onCreate方法中（或在布局中使用app:layout_behavior="xxx.xxx.SnackBarBehavior"）

ProgressBar progressBar = (ProgressBar) findViewById(R.id.progressBar2);
SnackBarBehavior snackBarBehavior = new SnackBarBehavior();
        CoordinatorLayout.LayoutParams coordinatorParams = (CoordinatorLayout.LayoutParams) progressBar.getLayoutParams();
        coordinatorParams.setBehavior(snackBarBehavior);

注意：我基于此处发布的组件来构建我的行为组件 如何像浮动按钮一样将视图移动到 Snackbar 上方

0

您可以使用以下库来实现材料风格的按钮 > https://github.com/makovkastar/FloatingActionButton (或者这个 > https://github.com/futuresimple/android-floating-action-button)

对于下拉菜单，您也可以使用这个库 > https://github.com/oguzbilgener/CircularFloatingActionMenu

然后，您可以通过将它们添加到RelativeLayout（一个在另一个上面）并添加一些动画，例如扩展带缩放的按钮，扩展进度条带缩放等，将这两个组件组合起来。然后，您只需要连接到进度条代码以在加载完成后将其收缩即可，即将其缩小到按钮后面。

对于向后兼容的动画，请查看这里的9个旧版Android > http://nineoldandroids.com/

希望这有所帮助。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接