效果圖片1
效果圖片2
直接上代碼-activity
public classJianshuActivityextendsAppCompatActivity {
@Bind(R.id.tv_search)
TextViewtvSearch;
@Bind(R.id.ll_search)
LinearLayoutmSearchLayout;
@Bind(R.id.scrollView)
ScrollViewmScrollView;
booleanisExpand=false;
@Bind(R.id.iv_img)
ImageViewivImg;
@Bind(R.id.toolbar)
Toolbartoolbar;
privateTransitionSetmSet;
@Override
protected voidonCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_jian);
ButterKnife.bind(this);
//設(shè)置全屏透明狀態(tài)欄
if(Build.VERSION.SDK_INT>= Build.VERSION_CODES.KITKAT) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
ViewGroup rootView = (ViewGroup) ((ViewGroup)findViewById(android.R.id.content)).getChildAt(0);
ViewCompat.setFitsSystemWindows(rootView,false);
rootView.setClipToPadding(true);
}
if(Build.VERSION.SDK_INT>= Build.VERSION_CODES.LOLLIPOP) {
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS|
WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN| View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().setStatusBarColor(Color.TRANSPARENT);
}
//設(shè)置toolbar初始透明度為0
toolbar.getBackground().mutate().setAlpha(0);
//scrollview滾動狀態(tài)監(jiān)聽
mScrollView.getViewTreeObserver().addOnScrollChangedListener(newViewTreeObserver.OnScrollChangedListener() {
@Override
public voidonScrollChanged() {
//改變toolbar的透明度
changeToolbarAlpha();
//滾動距離>=大圖高度-toolbar高度 即toolbar完全蓋住大圖的時候 且不是伸展狀態(tài) 進行伸展操作
if(mScrollView.getScrollY() >=ivImg.getHeight() -toolbar.getHeight()? && !isExpand) {
expand();
isExpand=true;
}
//滾動距離<=0時 即滾動到頂部時? 且當(dāng)前伸展狀態(tài) 進行收縮操作
else if(mScrollView.getScrollY()<=0&&isExpand) {
reduce();
isExpand=false;
}
}
});
}
private voidchangeToolbarAlpha() {
intscrollY =mScrollView.getScrollY();
//快速下拉會引起瞬間scrollY<0
if(scrollY<0){
toolbar.getBackground().mutate().setAlpha(0);
return;
}
//計算當(dāng)前透明度比率
floatradio= Math.min(1,scrollY/(ivImg.getHeight()-toolbar.getHeight()*1f));
//設(shè)置透明度
toolbar.getBackground().mutate().setAlpha( (int)(radio *0xFF));
}
private voidexpand() {
//設(shè)置伸展狀態(tài)時的布局
tvSearch.setText("搜索簡書的內(nèi)容和朋友");
RelativeLayout.LayoutParams LayoutParams = (RelativeLayout.LayoutParams)mSearchLayout.getLayoutParams();
LayoutParams.width= LayoutParams.MATCH_PARENT;
LayoutParams.setMargins(dip2px(10),dip2px(10),dip2px(10),dip2px(10));
mSearchLayout.setLayoutParams(LayoutParams);
//開始動畫
beginDelayedTransition(mSearchLayout);
}
private voidreduce() {
//設(shè)置收縮狀態(tài)時的布局
tvSearch.setText("搜索");
RelativeLayout.LayoutParams LayoutParams = (RelativeLayout.LayoutParams)mSearchLayout.getLayoutParams();
LayoutParams.width= dip2px(80);
LayoutParams.setMargins(dip2px(10),dip2px(10),dip2px(10),dip2px(10));
mSearchLayout.setLayoutParams(LayoutParams);
//開始動畫
beginDelayedTransition(mSearchLayout);
}
voidbeginDelayedTransition(ViewGroup view) {
mSet=newAutoTransition();
mSet.setDuration(300);
TransitionManager.beginDelayedTransition(view,mSet);
}
private intdip2px(floatdpVale) {
final floatscale = getResources().getDisplayMetrics().density;
return(int) (dpVale * scale +0.5f);
}
}
布局你代碼
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:background="#c2c0c0"
>
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none">
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:layout_width="match_parent"
android:layout_height="1500dp">
android:id="@+id/iv_img"
android:layout_width="match_parent"
android:layout_height="180dp"
android:scaleType="centerCrop"
android:src="@drawable/bg_banner"/>
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
android:background="#fff"
android:fitsSystemWindows="true">
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
android:id="@+id/ll_search"
android:layout_width="80dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:background="@drawable/shape_bg"
android:gravity="center">
android:id="@+id/tv_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="搜索"
android:textColor="#8A8A8A"/>
