Перемещение FloatingActionButton при прокрутке CollapsingToolbarLayout

Question

У меня есть макет с CollapsingToolbarLayout, RecyclerView и FloactingActionButton.

Идея заключается в том, чтобы развернуть панель инструментов, когда пользователь прокручивает RecyclerView вниз и втягивает его при прокрутке вверх.

Но когда я просматриваю свой RecyclerView, AppBarLayout убирается, и мой FloactingActionButton исчезает.

Я хочу показать его снова в каком-то другом месте на моем экране, таком как botton.

Как я могу это сделать?

Это мой экран:

Перед Прокрутка вниз - My FloactingActionButton есть.

После прокрутки вниз - Там нет места не осталось FloactingActionButton, так что увольте. Я просто хочу показать это на экране экрана.

код моего макета XML:

<android.support.design.widget.AppBarLayout 
    android:id="@+id/app_bar_layout" 
    android:layout_width="match_parent" 
    android:layout_height="192dp"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:elevation="4dp" 
     android:id="@+id/collapsing_toolbar" 
     android:background="@color/primary" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

     <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.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 
    style="@style/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:clickable="true" 
    app:layout_anchor="@id/app_bar_layout" 
    app:layout_anchorGravity="bottom|right|end" /> 

Кодекс моей деятельности

public class MainActivityRecycler extends AppCompatActivity implements OnDataSelected { 

private CollapsingToolbarLayout collapsingToolbarLayout; 


public void onDataSelected(View view, int position) { 
} 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main_recycler); 
    setSupportActionBar((Toolbar) findViewById(R.id.toolbar)); 
    collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar); 
    collapsingToolbarLayout.setTitle("Collapsing"); 
    //collapsingToolbarLayout.setExpandedTitleColor(getResources().getColor(android.R.color.transparent)); 

    RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView); 
    recyclerView.setLayoutManager(new LinearLayoutManager(this)); 
    ArrayList<String> details = new ArrayList<String>(); 
    details.add("Main Facilities"); 
    details.add("Restaurants"); 
    details.add("Shops"); 
    details.add("Motel"); 
    details.add("Forecourt"); 
    DetailsAdapter mAdapter = new DetailsAdapter(this, null, details); 
    recyclerView.setAdapter(mAdapter); 
    recyclerView.setItemAnimator(new DefaultItemAnimator()); 
} 

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    getMenuInflater().inflate(R.menu.menu_main, menu); 
    return true; 
} 



class DetailsAdapter extends RecyclerView.Adapter<DetailsAdapter.ViewHolder> { 

    private List<String> cars; 
    private Context context; 
    private OnDataSelected onDataSelected; 

    public DetailsAdapter(Context context, OnDataSelected onDataSelected, List<String> cars) { 
     this.context = context; 
     this.onDataSelected = onDataSelected; 
     this.cars = cars; 
    } 

    @Override 
    public DetailsAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { 
     View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout, parent, false); 

     ViewHolder viewHolder = new ViewHolder(view); 
     return viewHolder; 
    } 

    @Override 
    public void onBindViewHolder(ViewHolder holder, int position) { 
     String car = cars.get(position); 
     holder.textViewTitleCar.setText(car); 
    } 

    @Override 
    public int getItemCount() { 
     return cars.size(); 
    } 

    public class ViewHolder extends RecyclerView.ViewHolder { 

     public TextView textViewTitleCar; 

     public ViewHolder(View view) { 
      super(view); 
      view.setOnClickListener(new View.OnClickListener() { 
       @Override 
       public void onClick(View v) { 
        treatOnDataSelectedIfNecessary(v, getAdapterPosition()); 
       } 
      }); 

      textViewTitleCar = (TextView) view.findViewById(R.id.info_text); 
     } 
    } 

    private void treatOnDataSelectedIfNecessary(View view, int position) { 
     if (onDataSelected != null) { 
      onDataSelected.onDataSelected(view, position); 
     } 
    } 
} 

}

Answer 1

Вы можете легко создать любое поведение для своего элемента. Вам потребуется реализовать ScrollListener для вашего AppBarLayout. Еще один пример пользовательского поведения - Github

Я надеюсь, что правильно понял и помог.

public class FlexibleSpaceExampleActivity extends AppCompatActivity 
    implements AppBarLayout.OnOffsetChangedListener { 
    private static final int PERCENTAGE_TO_SHOW_IMAGE = 20; 
    private View mFab; 
    private int mMaxScrollSize; 
    private boolean mIsImageHidden; 

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

     mFab = findViewById(R.id.flexible_example_fab); 

     Toolbar toolbar = (Toolbar) findViewById(R.id.flexible_example_toolbar); 
     toolbar.setNavigationOnClickListener(new View.OnClickListener() { 
      @Override public void onClick(View v) { 
       onBackPressed(); 
      } 
     }); 

     AppBarLayout appbar = (AppBarLayout) findViewById(R.id.flexible_example_appbar); 
     appbar.addOnOffsetChangedListener(this); 
    } 

    @Override 
    public void onOffsetChanged(AppBarLayout appBarLayout, int i) { 
     if (mMaxScrollSize == 0) 
      mMaxScrollSize = appBarLayout.getTotalScrollRange(); 

     int currentScrollPercentage = (Math.abs(i)) * 100 
      /mMaxScrollSize; 

     if (currentScrollPercentage >= PERCENTAGE_TO_SHOW_IMAGE) { 
      if (!mIsImageHidden) { 
       mIsImageHidden = true; 

       ViewCompat.animate(mFab).scaleY(0).scaleX(0).start(); 
       /** 
       * Realize your any behavior for FAB here! 
       **/ 
      } 
     } 

     if (currentScrollPercentage < PERCENTAGE_TO_SHOW_IMAGE) { 
      if (mIsImageHidden) { 
       mIsImageHidden = false; 
       ViewCompat.animate(mFab).scaleY(1).scaleX(1).start(); 
       /** 
       * Realize your any behavior for FAB here! 
       **/ 
      } 
     } 
    } 

    public static void start(Context c) { 
     c.startActivity(new Intent(c, FlexibleSpaceExampleActivity.class)); 
    } 
} 

Answer 2

Используйте плавучую кнопку действия и задайте свойство, которое я установил. Очень легко отобразить FAB в collapsingToolbarLayout.

<android.support.design.widget.AppBarLayout 
    android:id="@+id/activity_main_appbar" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:fitsSystemWindows="true" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
    app:layout_constraintEnd_toEndOf="parent" 
    app:layout_constraintStart_toStartOf="parent" 
    tools:ignore="InconsistentLayout"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/activity_main_collapsing_toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="#2196f3" 
     android:fitsSystemWindows="true" 
     app:contentScrim="?attr/colorPrimary" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed" 
     tools:ignore="InconsistentLayout"> 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:background="@drawable/paris" 
      android:scaleType="centerCrop" 
      app:layout_collapseMode="parallax" /> 
     <android.support.v7.widget.Toolbar 
      android:id="@+id/activity_main_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="@android:color/transparent" 
      app:layout_collapseMode="pin" 
      app:layout_scrollFlags="scroll|enterAlways" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
      app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

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

<android.support.v4.widget.NestedScrollView 
    android:id="@+id/activity_main_nested_scroll_view" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:fitsSystemWindows="true" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:ignore="InconsistentLayout"> 
     <android.support.v7.widget.RecyclerView 
      android:id="@+id/activity_main_recycler_view" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="10dp" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior"/> 

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

<android.support.design.widget.FloatingActionButton 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_margin="20dp" 
    android:src="@drawable/ic_call_black_24dp" 
    app:layout_anchor="@id/activity_main_appbar" 
    app:layout_anchorGravity="bottom|right|end" />