1

2 FAB imageДва FAB с разрушением панели

Я пытаюсь создать действие с 2 ФАБОМ на его CollapsingToolbarLayout.

Я создал обычную активность прокрутки (которая создает с 1 FAB, который отлично работает и скрывается, когда панель инструментов рушится).

Теперь, я пытался добавить еще FAB, но я не могу поставить его рядом с первым FAB (может поставить его только в начале/центра/конца AppBarLayout.

Кроме того, я пытался поставить 2 . FAB внутри LinearLayout Он выглядит хорошо, но FAB не скрывается, когда панель инструментов становится разрушилась

Вот мой XML-код:.

<?xml version="1.0" encoding="utf-8"?> 
<layout 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"> 

    <data class="MomentActivityBinder"> 
     <variable 
      name="momentViewModel" 
      type="com.infibond.infi.timeline.mvp.moment.MomentViewModel"/> 
    </data> 

    <android.support.design.widget.CoordinatorLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:fitsSystemWindows="true" 
     tools:context="com.infibond.infi.timeline.mvp.moment.TimelineMomentActivity"> 

     <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: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" 
        app:popupTheme="@style/AppTheme.PopupOverlay"/> 

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

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

     <include 
      android:id="@+id/moment_content" 
      layout="@layout/timeline_content_moment" 
      app:momentViewModel="@{momentViewModel}"/> 

     <!--two FABs without linear layout -->  

     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:layout_anchor="@id/app_bar" 
      app:layout_anchorGravity="bottom|end" 
      android:orientation="horizontal"> 

      <android.support.design.widget.FloatingActionButton 
       android:id="@+id/fab_infi" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_margin="@dimen/margin_baseX1" 
       android:src="@drawable/ic_radio_button_checked_black_24px" 
       android:tint="@color/gray" 
       app:layout_anchor="@id/app_bar" 
       app:layout_anchorGravity="bottom|end" 
       app:backgroundTint="@color/white"/> 

      <android.support.design.widget.FloatingActionButton 
       android:id="@+id/fab_share" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_margin="@dimen/margin_baseX1" 
       android:src="@drawable/ic_share_mobile_black_24px" 
       android:tint="@color/gray" 
       app:layout_anchor="@id/app_bar" 
       app:layout_anchorGravity="bottom|end" 
       app:backgroundTint="@color/white"/> 

     </LinearLayout> 

    <!--one FAB without linear layout --> 

    <!--<android.support.design.widget.FloatingActionButton--> 
     <!--android:id="@+id/fab_share"--> 
     <!--android:layout_width="wrap_content"--> 
     <!--android:layout_height="wrap_content"--> 
     <!--android:layout_margin="@dimen/margin_baseX1"--> 
     <!--android:src="@drawable/ic_share_mobile_black_24px"--> 
     <!--android:tint="@color/gray"--> 
     <!--app:layout_anchor="@id/app_bar"--> 
     <!--app:layout_anchorGravity="bottom|end"--> 
     <!--app:backgroundTint="@color/white"/> 

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

</layout> 

ответ

2

Вы можете использовать AppbarlayoutChangeListener и на различные состояния вручную скрыть и показать FAB

mAppBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() { 
     @Override 
     public void onStateChanged(AppBarLayout appBarLayout, State state) { 
      switch (state) { 
       case COLLAPSED: 
        fab1.hide(); 
        fab2.hide(); 
        break; 
       case EXPANDED: 
        fab1.show(); 
        fab2.show(); 
        break; 
       case IDLE: 
        fab1.show(); 
        fab2.show(); 
        break; 
      } 
     } 
    }); 

AppBarStateChangeListener.java

public abstract class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener { 

public enum State { 
    EXPANDED, 
    COLLAPSED, 
    IDLE 
} 

private State mCurrentState = State.IDLE; 

@Override 
public final void onOffsetChanged(AppBarLayout appBarLayout, int i) { 
    if (i == 0) { 
     if (mCurrentState != State.EXPANDED) { 
      onStateChanged(appBarLayout, State.EXPANDED); 
     } 
     mCurrentState = State.EXPANDED; 
    } else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) { 
     if (mCurrentState != State.COLLAPSED) { 
      onStateChanged(appBarLayout, State.COLLAPSED); 
     } 
     mCurrentState = State.COLLAPSED; 
    } else { 
     if (mCurrentState != State.IDLE) { 
      onStateChanged(appBarLayout, State.IDLE); 
     } 
     mCurrentState = State.IDLE; 
    } 
} 

public abstract void onStateChanged(AppBarLayout appBarLayout, State state); 


} 
+0

его хорошим решением, но в этом случае я буду терять масштаб анимации разрушающейся панели инструментов. я попытаюсь использовать его и масштабировать FAB x и y на основе scrollng offset. – OShiffer

+0

'fab.hide()' & 'fab.show()' по умолчанию дает ** масштабную анимацию ** просто попробуйте –

+0

вы правы, это работает благодаря мужчине !!! – OShiffer

Смежные вопросы