Android 带折叠工具栏的两个FAB
我正在尝试创建一个活动,其Android 带折叠工具栏的两个FAB,android,android-appbarlayout,android-collapsingtoolbarlayout,floating-action-button,Android,Android Appbarlayout,Android Collapsingtoolbarlayout,Floating Action Button,我正在尝试创建一个活动,其折叠工具栏布局上有2个FAB 我创建了一个常规的滚动活动(它创建了一个非常好的FAB,当工具栏折叠时隐藏) 现在,我尝试添加另一个晶圆厂,但我无法将其放在第一个晶圆厂旁边(只能将其放在AppBarLayout的开始/中心/结束位置) 此外,我还尝试将2晶圆放在LinearLayout内。它看起来不错,但当工具栏折叠时,晶圆并没有隐藏起来 以下是我的xml代码: <?xml version="1.0" encoding="utf-8"?> <layout
折叠工具栏布局上有2个FAB
我创建了一个常规的滚动活动(它创建了一个非常好的FAB,当工具栏折叠时隐藏)
现在,我尝试添加另一个晶圆厂,但我无法将其放在第一个晶圆厂旁边(只能将其放在AppBarLayout
的开始/中心/结束位置)
此外,我还尝试将2晶圆放在LinearLayout
内。它看起来不错,但当工具栏折叠时,晶圆并没有隐藏起来
以下是我的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>
您可以使用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);
}
这是一个很好的解决方案,但在这种情况下,我将丢失折叠工具栏的缩放动画。我将尝试使用它并根据滚动偏移量缩放工厂x和y。FAB.hide()
&FAB.show()
默认情况下,缩放动画只需尝试一下