我想使用带有协调器布局Facebook的appbar进行个人资料活动,但我不知道如何在appbar向上滚动时隐藏视图并且我的视图卡在工具栏后面
我想要的: 完整资料 - >滚动时淡出 - >完全滚动时的操作栏
我有什么:
我使用了Android Studio中的滚动活动示例并进行了编辑:
<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=".ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:fitsSystemWindows="true"
android:layout_height="@dimen/app_bar_height"
android:layout_width="match_parent"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/bg_proflie"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary">
<android.support.v7.widget.Toolbar android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="@style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<LinearLayout
android:weightSum="5"
android:orientation="horizontal"
android:layout_marginTop="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="2"
android:orientation="vertical"
android:padding="12dp"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/img_profile_pic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:adjustViewBounds="true"
android:src="@drawable/ic_profile"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="3"
android:layout_gravity="center_vertical"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
android:id="@+id/txt_alias"
android:textSize="28sp"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/txt_name"
android:textSize="14sp"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/txt_district"
android:textSize="14sp"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<RelativeLayout
android:visibility="gone"
android:id="@+id/rlt_player_status"
android:background="@drawable/profile_box"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:paddingLeft="12dp"
android:paddingRight="12dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/txt_profile_status"
android:text="@string/txt_profile_status_unknown"
android:textColor="@color/white"
android:textSize="11sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_scrolling" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end"
android:src="@drawable/ic_edit_profile" />
</android.support.design.widget.CoordinatorLayout>
答案 0 :(得分:1)
利用 private static final int BUFFER_SEGMENT_SIZE = 64 * 1024;
private static final int RENDERER_COUNT = 1;//since you want to render simple audio
private static final int minBufferMs = 2500;
private static final int minRebufferMs = 5000;
private static final int BUFFER_SEGMENT_COUNT = 256;
////////////////////////////////////////////////////////
this.exoPlayer = ExoPlayer.Factory.newInstance(RENDERER_COUNT, minBufferMs, minRebufferMs);
this.exoPlayer.addListener(this);
偏移量来确定视图的alpha值。基本上,这就是Facebook应用程序所做的事情,淡入/淡出视图。
Allocator allocator = new DefaultAllocator(BUFFER_SEGMENT_SIZE);
DataSource dataSource = new DefaultHttpDataSource(userAgent, null, null);
sampleSource = new ExtractorSampleSource(uri,
dataSource
, allocator,
BUFFER_SEGMENT_SIZE,
BUFFER_SEGMENT_COUNT * BUFFER_SEGMENT_SIZE);
}
MediaCodecAudioTrackRenderer audioRenderer = new MediaCodecAudioTrackRenderer(sampleSource);
exoPlayer.prepare(audioRenderer);
exoPlayer.setPlayWhenReady(true);
这将使您的视图在总滚动范围和半滚动范围内淡入或淡出。
之后,只需使用AppBarLayout
方法将此public class FadingViewOffsetListener implements AppBarLayout.OnOffsetChangedListener {
private View mView;
public FadingViewOffsetListener(View view) {
mView = view;
}
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
verticalOffset = Math.abs(verticalOffset);
float halfScrollRange = (int) (appBarLayout.getTotalScrollRange() * 0.5f);
float ratio = (float) verticalOffset / halfScrollRange;
ratio = Math.max(0f, Math.min(1f, ratio));
ViewCompat.setAlpha(mView, ratio);
}
}
实施的实例传递给OnOffsetChangedListener
。
答案 1 :(得分:1)