将浮动操作按钮上下移动以避免被 Snackbar 遮挡。

39

我正在使用这个库来实现浮动操作栏,但当Snackbar出现在屏幕上时,我无法找到移动按钮的方法。使用该库是否可能实现?


你应该浏览一下 Github 的问题列表。我发现了这个:https://github.com/makovkastar/FloatingActionButton/issues/90 和这个:https://github.com/makovkastar/FloatingActionButton/issues/90 - Eugene H
太棒了。我可能错过了那个问题,因为我已经查看了GH问题。谢谢!现在我已经把它搞定了。 - naja
太棒了。我正在考虑使用那个库。修复起来容易吗? - Eugene H
5
是的,我字面上遵循了您链接到的讨论中的建议。当 Snackbar 显示时,使用 fab.animate().translationYBy(-snackbar.getHeight()),当它被隐藏时,使用相同的东西,只是在 getHeight() 之前省略负号。这有点 hacky,因为可能会发生的情况是用户在初始按钮按下后继续按按钮,浮动按钮会不断向上移动。我只是使用了一些布尔逻辑来标记按钮的当前状态作为一种解决方法。 - naja
1
@naja 能否发一下你的进展?你是如何获取 snackbar 实例的,又是如何判断它何时关闭或打开的呢? - Ashok Varma
5个回答

51

对于未来需要答案的任何人...

将协调布局(Coordinator Layout)作为浮动操作按钮(Floating Action Button)的父布局,会自动处理动画效果。

浮动操作按钮有一个默认行为,可以检测到添加的 Snackbar 视图,并相应地在 Snackbar 的高度以上动画显示该按钮。

浮动操作按钮行为

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/clayout">
<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|right"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:src="@drawable/filter_icon"
    app:rippleColor="@color/colorGray"
    app:fabSize="normal"
    app:borderWidth="0dp"/>
</android.support.design.widget.CoordinatorLayout>

接下来我们的 SnackBar 代码将使用 CoordinatorLayout [这里是 clayout] 作为父布局,代码如下:

Snackbar.make(clayout, "Click on row to know more details", Snackbar.LENGTH_LONG)
                    .setAction("OK", new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {

                        }
                    }).show();

3
但不包括自定义浮动操作按钮或菜单。因此,必须手动完成动画。 - TPWang
但是对于本地 FAB 来说,这应该是最简单和被接受的答案。 - mochadwi

10

尝试使用android.support.design.widget.FloatingActionButtonCoordinatorLayout

然后尝试这样做:

fabView = findViewById(R.id.floating_action_button_id);
Snackbar.make(fabView, "Hi", Snackbar.LENGTH_LONG).show()

7
你可以切换到 android.support.design.widget.FloatingActionButton 并使用 CoordinatorLayout 来为你的视图指定行为。

CoordinatorLayout是一个超级强大的FrameLayout。

CoordinatorLayout主要用于以下两种情况:

  1. 作为应用程序装饰或Chrome布局的顶层布局
  2. 作为一个或多个子视图特定交互的容器

通过为CoordinatorLayout的子视图指定Behaviors,您可以在单个父级中提供许多不同的交互,并且这些视图也可以相互交互。当作为CoordinatorLayout的子项使用时,视图类可以使用DefaultBehavior注释指定默认行为。

行为可用于实现各种交互和附加布局修改,从滑动抽屉和面板到可滑动删除的元素和按钮,这些按钮会随着移动和动画而粘附到其他元素上。

CoordinatorLayout的子项可能具有锚点。此视图ID必须对应于CoordinatorLayout的任意后代,但它不能是锚定的子项本身或锚定子项的后代。这可用于将浮动视图相对于其他任意内容窗格放置。


4

Kotlin:

class CustomBehavior : CoordinatorLayout.Behavior<FloatingActionButton> {   

....

    override fun onAttachedToLayoutParams(params: CoordinatorLayout.LayoutParams) {
        super.onAttachedToLayoutParams(params)

        //set dodgeInsetEdges to BOTTOM so that we dodge any Snackbars
        params.dodgeInsetEdges = Gravity.BOTTOM
    }

.....

}

3
你也可以在XML中使用app:layout_dodgeInsetEdges="bottom"。该属性将使视图避让屏幕底部的导航栏或系统UI。 - Slav

2

您可以使用 FAB 作为 parentLayout。

Snackbar.make(parentLayout, R.string.snackbar_text,Snackbar.LENGTH_LONG).setAction(R.string.snackbar_action, myOnClickListener).show();

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