效果圖:
實現思路:
??首先我們需要實時的獲取滑動的Y值scrollDistanceY
(可以理解為滑動了的距離)薄风,可以通過ScrollView的getScrollY();
方法來獲取返顺。我們繼承ScrollView
重寫Touch方法等舔,隨觸摸事件反饋scrollDistanceY
傀履。需要特殊處理手指離開后屏幕還在滑動導致 scrollDistanceY
改變的情況捡多。
??在xml布局中撑帖,綠色的固定布局View我們需要寫兩個绪励,一個與頭部布局重合肿孵,位于APP頂部唠粥,另一個與列表中。在Activity我們獲取內部固定布局距離頂部的高度停做,與我們實時獲取的scrollDistanceY
做比較晤愧,控制外部固定布局是否顯示,達到效果圖的效果蛉腌。
代碼實現:
- 重寫ScrollView官份,實時反饋
scrollDistanceY
package com.wusy.adv;
import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ScrollView;
/**
* Created by XIAO RONG on 2018/8/23.
* 這是一個能夠實時向主View提供滑動距離Y值的ScrollView(滑動的高度)
* 能夠運用此ScrollView實現在內部View固定頂部布局的需求
*/
public class FixedHeadScrollView extends ScrollView{
public FixedHeadScrollViewListener listener;
private int scrollDistanceY;
private Handler handler=new Handler(){
@Override
public void handleMessage(Message msg) {
switch (msg.what){
case 1:
int newY=getScrollY();//在手指離開屏幕的短暫時間間隔后再次獲取Y值
if(newY!=scrollDistanceY){//如果不相等,說明手指離開后烙丛,屏幕仍然在滑動,繼續(xù)更新scrollDistanceY的值
scrollDistanceY=newY;
listener.sendDistanceY(scrollDistanceY);
handler.sendEmptyMessageDelayed(1,5);
}
break;
}
}
};
public FixedHeadScrollView(Context context) {
this(context,null);
}
public FixedHeadScrollView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public FixedHeadScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
if(ev.getAction()==MotionEvent.ACTION_UP){
handler.sendEmptyMessageDelayed(1,30);
}
scrollDistanceY=getScrollY();
listener.sendDistanceY(scrollDistanceY);
return super.onTouchEvent(ev);
}
public interface FixedHeadScrollViewListener{
void sendDistanceY(int distance);
}
public void setFixedHeadScrollViewListener(FixedHeadScrollViewListener listener) {
this.listener = listener;
}
}
- xml代碼贯吓,固定布局要寫兩個,控制一個的顯隱蜀变。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/layout_total">
<com.wusy.adv.FixedHeadScrollView
android:id="@+id/scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/layout_head"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#e21919"
android:gravity="center"
android:text="頭部布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:id="@+id/layout_fixed_inside"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#10e91b"
android:gravity="center"
android:text="固定布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#19ace2"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#d408bc"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#f7eb00"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#192de2"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#19ace2"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#d408bc"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#f7eb00"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
<TextView
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#192de2"
android:gravity="center"
android:text="列表布局"
android:textColor="#ffffff"
android:textSize="17dp" />
</LinearLayout>
</com.wusy.adv.FixedHeadScrollView>
<TextView
android:id="@+id/layout_fixed_outside"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#10e91b"
android:gravity="center"
android:visibility="gone"
android:text="固定布局"
android:textColor="#ffffff"
android:textSize="17dp" />
</RelativeLayout>
- Activity中,實現FixedHeadScrollView提供的接口介评。獲取內層固定布局距離固定位置的高度库北,與
scrollDistanceY
比較,當內層固定布局達到固定位置们陆,則顯示外層固定布局寒瓦,反之隱藏。
package com.wusy.adv;
import android.util.Log;
import android.view.View;
import android.widget.TextView;
import com.wusy.wusylibrary.base.BaseActivity;
/**
* Created by XIAO RONG on 2018/8/23.
*/
public class HomeActivity extends BaseActivity implements FixedHeadScrollView.FixedHeadScrollViewListener{
private TextView layout_inside,layout_outside;
private int topDistance;
private FixedHeadScrollView scrollView;
@Override
public int getContentViewId() {
return R.layout.activity_home;
}
@Override
public void findView() {
layout_inside=findViewById(R.id.layout_fixed_inside);
layout_outside=findViewById(R.id.layout_fixed_outside);
scrollView=findViewById(R.id.scrollview);
}
@Override
public void init() {
scrollView.setFixedHeadScrollViewListener(this);
}
@Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
if(hasFocus){
topDistance=layout_inside.getTop();
Log.i("msg","topDistance="+topDistance);
}
}
@Override
public void sendDistanceY(int distance) {
Log.i("msg","看這里——"+distance);
if(distance>=topDistance){
layout_outside.setVisibility(View.VISIBLE);
}else{
layout_outside.setVisibility(View.GONE);
}
}
}
注意:
- 在獲取內部固定布局距離頂部的距離的時候坪仇,不要在
onCreate()
中去執(zhí)行杂腰,由于界面還沒有完全繪制完成,獲取到的距離值永遠為0椅文。建議在onWindowFocusChanged()
中去獲取喂很。 - xml中,外部固定布局一定要放在scrollView外面皆刺。
- 記得處理手指離開屏幕后少辣,界面仍然在滑動,導致外層固定布局的顯示隱藏控制有誤羡蛾。
我的博客即將搬運同步至騰訊云+社區(qū)漓帅,邀請大家一同入駐:https://cloud.tencent.com/developer/support-plan?invite_code=32rm642dvbr7
End
筆者的Github Blog,希望各位大大提意見痴怨,點個star忙干,謝謝
傳送門:WusyBlog求互粉互贊,互贊所有文章可以私聊我浪藻。哈哈捐迫,希望我們的原創(chuàng)文章能讓更多朋友看到,一起變強爱葵。
筆者新開通了微信公眾號——飲水思源|wusy 計劃持續(xù)運營弓乙,每日為您分享Android干貨末融、原創(chuàng)文章。微信掃描下方的二維碼關注我暇韧,開發(fā)學習路上不迷路勾习。謝謝各位