android - FloatingActionButton 应该在不滚动的情况下可见(在 CollapsingToolbarlayout 中)

标签 android android-layout android-toolbar android-design-library androiddesignsupport

如何在最初进入显示屏幕并且不使用 CollapsingToolbarLayout 滚动/折叠工具栏时让 FloatingActionButton 可见?

此屏幕截图显示了折叠工具栏和 fab 的默认行为,我想更改它以使 fab 最初可见,而不管滚动状态如何。

Fab 位于附加到 Activity 的 fragment 中。

default behavior Activity 的布局代码:

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

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/app_bar_height"
    android:fitsSystemWindows="true"
    android:theme="@style/AppTheme.AppBarOverlay">
    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleTextAppearance="@style/ActivityTitle"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:toolbarId="@+id/toolbar">

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

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
    android:id="@+id/default_fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:layout="@layout/fragment_swipe_refresh_list"/></android.support.design.widget.CoordinatorLayout>

fragment 布局代码:

<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:id="@+id/layout_container"
android:layout_width="match_parent"
android:layout_height="match_parent">


<de.aposync.team.widget.view.ContainerSwipeRefreshLayout
    android:id="@+id/layout_container_swipe_refresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="0dp"
    android:paddingRight="0dp">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/view_recycler"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        android:paddingBottom="96dp"/>

</de.aposync.team.widget.view.ContainerSwipeRefreshLayout>

<include
    layout="@layout/view_progress_bar_group"
    android:visibility="gone"
    tools:visibility="visible"/>

<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"
    app:fabSize="normal"
    tools:src="@android:drawable/ic_dialog_alert""/></android.support.design.widget.CoordinatorLayout>

编辑 Jantzilla 的答案提供了一个可行的解决方案,但需要将 FAB 从 fragment 移动到 Activity 。有没有不需要搬迁晶圆厂的解决方案?

最佳答案

Github 上有一个这样的例子.该应用程序也可以在 Play 上试用店铺。我最近用它作为我自己项目的引用。

代码

import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.widget.NestedScrollView;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;

/**
* Created by romain on 15/10/15.
*/
public class ScrollCollapseLargeToolbarActivity extends AppCompatActivity {

private View mFab;
private int mFabTranslationSize = 0;
private boolean mFabIsVisible = true;

public static void start(Context context) {
    Intent intent = new Intent(context, ScrollCollapseLargeToolbarActivity.class);
    context.startActivity(intent);
}

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_scroll_collapse_large_toolbar);

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    String toolbarTitle = getResources().getString(R.string.sample_collapse_scroll_toolbar);
    CollapsingToolbarLayout collapsingToolbar =
            (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
    collapsingToolbar.setTitle(toolbarTitle);

    mFab = findViewById(R.id.fab);

    NestedScrollView scrollView = (NestedScrollView) findViewById(R.id.nested_scrollview);
    scrollView.setOnScrollChangeListener(new NestedScrollView.OnScrollChangeListener() {
        @Override
        public void onScrollChange(NestedScrollView v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {
            if (scrollY > oldScrollY) {
                animateFab(false);
            } else {
                animateFab(true);
            }
        }
    });
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        case android.R.id.home:
            finish();
            return true;
    }
    return super.onOptionsItemSelected(item);
}

private void animateFab(boolean show) {
    if (show && !mFabIsVisible) {
        //Show
        mFabIsVisible = true;
        mFab.animate().translationY(0);
    } else if (!show && mFabIsVisible) {
        //Hide
        mFabIsVisible = false;
        if (mFabTranslationSize == 0) {
            int margin = ((CoordinatorLayout.LayoutParams) mFab.getLayoutParams()).bottomMargin;
            mFabTranslationSize = mFab.getHeight() + margin * 2;
        }
        mFab.animate().translationY(mFabTranslationSize);
    }
}
}

XML

<?xml version="1.0" encoding="utf-8"?>

<android.support.design.widget.CoordinatorLayout
android:id="@+id/main_content"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/toolbar_expanded_height"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|enterAlwaysCollapsed">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"/>

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

<android.support.v4.widget.NestedScrollView
    android:id="@+id/nested_scrollview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/text_margin"
        android:text="@string/large_text"/>

</android.support.v4.widget.NestedScrollView>

<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="@drawable/ic_share_white"
    />

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

关于android - FloatingActionButton 应该在不滚动的情况下可见(在 CollapsingToolbarlayout 中),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51047816/

相关文章:

android - CoordinatorLayout 中的 FrameLayout 使工具栏背景透明为白色

java - 单击按钮时 Android 应用程序关闭(在自定义注册页面上)

Android Market - 我得到的唯一崩溃报告是关于平台 "OTHER"

javascript - react native : change style of ListView item on touch

Android AppBarLayout 折叠工具栏并立即显示稀松布颜色

android-toolbar - 如何在没有操作栏的应用程序中使用 Mapbox PlacePicker 事件?

java - 我想从 firestore 检索当前登录的用户数据,但它在我想显示数据的地方显示空白

java - setText 不适用于纵向布局(android)

android - 在 Android 上刷新 View 或 Activity

android - 未找到类 "androidx.constraintlayout.ConstraintLayout"