当 Snack bar 在 android 中显示时,浮动操作按钮不会上升

Floating Action Button Not Going up when Snack bar is Showing in android

  1. 我在同一页面的应用程序中使用 Snack bar 和 FAB,每当 Snackbar 显示浮动操作按钮不向上时

  2. 我正在使用第三方库 attachToListView 工作正常

     import com.melnykov.fab.FloatingActionButton;
    

如果我使用的是默认库“无法解析attachToListView”

import android.support.design.widget.FloatingActionButton;

我的需求:

  1. attachToListView 应该工作(当 Listview 向下滚动 FAB 将消失时)。

  2. 每当 Snackbar 显示浮动操作按钮时应该上升

帮我解决这个问题。

Third Party Library Link

编辑:1

我删除了第三方库添加了默认导入(导入android.support.design.widget.FloatingActionButton),FAB 正在升级但 Attachtolistivew 未解决。

编辑:2

我在 activity 中使用了 Listview,带有 FAB 和 Snackbar。 所以我需要两个选项,比如 FAB Go up When Snackbar Opens 和当 Listview is Scrolling down Should hide FAB.

我的 SnackBar 代码:

 Snackbar snack = Snackbar.make(fab1, " Successfully ...!",Snackbar.LENGTH_SHORT);
                    View snackbarView = snack.getView();
                    snackbarView.setBackgroundColor(Color.parseColor("#f44336"));
                    snack.show();

Main.java

import com.melnykov.fab.FloatingActionButton;
     @Override
        protected void onCreate(Bundle savedInstanceState) 
    {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.fabview);
    
            fab1 = (FloatingActionButton) findViewById(R.id.fab);
    
            fab1.setShadow(true);
            //fab.attachToListView(provider_service_list);
    
            //FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
            fab1.attachToListView(listViewData, new ScrollDirectionListener()
            {
                @Override
                public void onScrollDown() {
                    Log.d("ListViewFragment", "onScrollDown()");
                }
    
                @Override
                public void onScrollUp() {
                    Log.d("ListViewFragment", "onScrollUp()");
                }
            }, new AbsListView.OnScrollListener() {
                @Override
                public void onScrollStateChanged(AbsListView view, int scrollState) {
                    Log.d("ListViewFragment", "onScrollStateChanged()");
                }
    
                @Override
                public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
                    Log.d("ListViewFragment", "onScroll()");
                }
            });
    
    }

fabview.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app78="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
    >
    <android.support.design.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/coordinatorlayout">
    
            <com.melnykov.fab.FloatingActionButton
                android:id="@+id/fab"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom|right"
                android:layout_margin="@dimen/fab_margin"
                android:src="@drawable/ic_add_white_24dp"
                app78:fab_colorNormal="@color/accent"
                app78:fab_colorPressed="@color/accent_pressed"
                app78:fab_colorRipple="@color/ripple"
                app78:fabSize="normal"
                app78:borderWidth="0dp"
                android:layout_marginBottom="@dimen/fab_margin_bottom"
                android:layout_marginRight="@dimen/fab_margin_right"
                />
    
        </android.support.design.widget.CoordinatorLayout>
   </RelativeLayout>

您需要在布局文件中使用 <android.support.design.widget.CoordinatorLayout 作为根标签。只有这样你才能得到你想要的结果。

步骤:1

 <?xml version="1.0" encoding="utf-8"?>
 <android.support.design.widget.CoordinatorLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app78="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/myCoordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">              

        <com.melnykov.fab.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:layout_margin="@dimen/fab_margin"
            android:src="@drawable/ic_add_white_24dp"
            app78:fab_colorNormal="@color/accent"
            app78:fab_colorPressed="@color/accent_pressed"
            app78:fab_colorRipple="@color/ripple"
            app78:fabSize="normal"
            app78:borderWidth="0dp"
            android:layout_marginBottom="@dimen/fab_margin_bottom"
            android:layout_marginRight="@dimen/fab_margin_right"
            />

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

第 2 步:

CoordinatorLayout myCoordinatorLayout = (CoordinatorLayout)findViewById(R.id.mycoordinatorLayout);

Snackbar snack = Snackbar.make(myCoordinatorLayout,"Successfully.!",Snackbar.LENGTH_SHORT);

有关更多信息,请查看 Android dev blog

要使用浮动操作按钮,您应该为您的 xml-

使用此结构
<?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"
android:fitsSystemWindows="true"
tools:context="com.afixi.prasenjeetpati.trailone.MainActivity">

<include layout="@layout/content_main" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_dialog_email" />

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

content_main 应该是您定义所有文本和按钮以及其他内容的主要内容。协调器布局应该包含这么多代码。它可能包含的额外代码是工具栏或导航抽屉。主要内容应始终是另一个 xml 文件。

主要活动

 FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
    fab.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                    .setAction("Action", null).show();
        }
    });

您的要求是:

1)当Listview向下滚动FAB时会消失

2)每当 Snackbar 显示时 Floating Action button 应该上涨。

现在检查您的解决方案:

1) 如果你打算使用 design support library fab 你将只满足约束编号 2.

2) 如果你打算使用第三方 fab 你将只满足约束编号 1.

您可以通过操纵第三方库并在要显示 snackbar 时添加动画或通过操纵 ListView 将其放入 CordinateLayout 然后使 fabListView 向下滚动时消失。

我的解决方案:

最快的解决方案是将 ListView 更改为 RecyclerView 并使用 CordinateLayoutdesign support library fab。现在你可以实现#2。 (RecyclerView 是比 ListView 更强大的小部件。为什么我必须这样做?因为 CordinateLayout 创建你的动画并且它只适用于任何实现 NestedScrolling 接口的滚动小部件. LOLLIPOP 及更高版本的 ListView 实现了该接口。如果你的最小 SDK 低于 LOLLIPOP,你必须使用 RecyclerView).

对于数字 #1,您可以使用以下代码:

 recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                if (dy > 0 && fab.isShown())
                    fab.hide();
            }

            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {

                if (newState ==  RecyclerView.SCROLL_STATE_IDLE) {
                    fab.show();
                }
                super.onScrollStateChanged(recyclerView, newState);
            }
        }); 

您的布局将是:

<?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=".MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <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/ThemeOverlay.AppCompat.Light"
            app:layout_scrollFlags="scroll|enterAlways|snap"/>

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />


    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" />

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

我们有两种方法可以做到这一点:

Whenever Snackbar is Showing Floating Action button Should Go up.

您正在使用第三个库:import com.melnykov.fab.FloatingActionButton; 所以你需要实现自定义行为:

  1. xml 文件:

    <com.melnykov.fab.FloatingActionButton xmlns:fab="http://schemas.android.com/apk/res-auto"
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="16dp"
        android:src="@drawable/sort_variant"
        fab:fab_colorNormal="@color/colorPrimary"
        fab:fab_colorPressed="@color/colorPrimaryDark"
        fab:fab_colorRipple="@color/colorAccent"
        app:layout_behavior="com.simpleapp.tvtan.testcustomfloatingactionbutton.SnackBarBehavior"/>
    

  2. 自定义行为class:

    public class SnackBarBehavior extends CoordinatorLayout.Behavior<FloatingActionButton> {
    public SnackBarBehavior() {
    }
    
    public SnackBarBehavior(Context context, AttributeSet attrs) {
    super(context, attrs);
    }
    
    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
    return dependency instanceof Snackbar.SnackbarLayout;
    }
    
    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
    float translationY = Math.min(0, dependency.getTranslationY() - dependency.getHeight());
    child.setTranslationY(translationY);
    return true;
      }
    }
    

attachToListView Should Work(For When Listview Scroling Down FAB will be Disappear)

或者如果你想使用设计库中的浮动操作按钮,你可以像这样用 RecyclerView 实现,你也需要实现自定义行为:

  1. xml 文件:

<android.support.v7.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/sort_variant"
    android:layout_gravity="bottom|end"
    android:layout_margin="16dp"
    app:layout_behavior="com.simpleapp.tvtan.testcustomfloatingactionbutton.ScrollBehavior"/>

  1. 你的行为class:

    public class ScrollBehavior extends FloatingActionButton.Behavior {
    
    public ScrollBehavior(Context context, AttributeSet attrs) {
    super();
    }
    
    @Override
    public void onNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
    super.onNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed, dxUnconsumed, dyUnconsumed);
    if (dyConsumed > 0) {
        CoordinatorLayout.LayoutParams layoutParams = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
        int fab_bottomMargin = layoutParams.bottomMargin;
        child.animate().translationY(child.getHeight() + fab_bottomMargin).setInterpolator(new LinearInterpolator()).start();
    } else if (dyConsumed < 0) {
        child.animate().translationY(0).setInterpolator(new LinearInterpolator()).start();
        }
      }
    
    @Override
    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View directTargetChild, View target, int nestedScrollAxes) {
    return nestedScrollAxes == ViewCompat.SCROLL_AXIS_VERTICAL;
      }
    }
    

您的父布局需要是 CoordinatorLayout p/s:我不知道为什么我的 xml 代码没有显示文件中的所有文本,所以我无法为您显示完整的 xml 文件。