問題彙總:

1.介面顯示不全,並且需要將TabLayout跟隨ListView往上移動

2.當滑動Viewpager時ListView會突然跳到螢幕的頂部

3.當內容往上滑動,使TabLayout懸浮在頂部

問題一

問題描述:.介面顯示不全,需要將TabLayout跟隨ListView往上移動

解決問題的思路,首先獲取ListView的整個控制元件的高度Height,設定外層Viewpager的高度為Height.這樣Scrollview就能完全顯示介面.

解決方案: 

第一步:計算listview高度

使用工具類測量

public class ViewUtil {
    public static void 
 
setListViewHeightBasedOnChildren(ListView listView) {
        ListAdapter listAdapter = listView.getAdapter();
        if (listAdapter == null) {
            return;
}

        int totalHeight = 0;
        for (int i = 0; i < listAdapter.getCount(); i++) {
            View listItem = listAdapter.getView(i, null, 
 
listView);
listItem.measure(0, 0);
totalHeight += listItem.getMeasuredHeight();
}

        ViewGroup.LayoutParams params = listView.getLayoutParams();
params.height = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
listView.setLayoutParams(params);
}

    /**
     * 獲取Listview
 
的高度，然後設定ViewPager的高度
* @param listView
* @return
*/
public static int setListViewHeightBasedOnChildren1(ListView listView) {
        //獲取ListView對應的Adapter
ListAdapter listAdapter = listView.getAdapter();
        if (listAdapter == null) {
            // pre-condition
return 0;
}

        int totalHeight = 0;
        for (int i = 0, len = listAdapter.getCount(); i < len; i++) { //listAdapter.getCount()返回資料項的數目
View listItem = listAdapter.getView(i, null, listView);
listItem.measure(0, 0); //計運算元項View 的寬高
totalHeight += listItem.getMeasuredHeight(); //統計所有子項的總高度
}

        ViewGroup.LayoutParams params = listView.getLayoutParams();
params.height = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
//listView.getDividerHeight()獲取子項間分隔符佔用的高度
//params.height最後得到整個ListView完整顯示需要的高度
listView.setLayoutParams(params);
        return params.height;
}
}

使用EventBus把測量的高度回傳給Viewpager所在的activity(fragment)

listViewHomeVPAdapter = new ListViewHomeVPAdapter(getContext(),data);
mListView.setAdapter(listViewHomeVPAdapter);
int listViewHeight = ViewUtil.setListViewHeightBasedOnChildren1(mListView);
EventBus.getDefault().post(new ListViewHeight(listViewHeight)); 

 給Viewpager設定Height

@Subscribe(threadMode = ThreadMode.MAIN)
public void onEventMainThread(ListViewHeight listViewHeight) {

    int height = listViewHeight.getListViewHeight();
ViewGroup.LayoutParams layoutParams = mViewPager.getLayoutParams();
layoutParams.height = height;mViewPager.setLayoutParams(layoutParams);
}

現在解決了介面顯示不全的問題.

第二步:自定義ScrollView

public class MyScrollView extends ScrollView {
    private float xDistance, yDistance, xLast, yLast;
    private OnScrollListener onScrollListener;
/**
     * 主要是用在使用者手指離開MyScrollView，MyScrollView還在繼續滑動，我們用來儲存Y的距離，然後做比較
*/
private int lastScrollY;
    public MyScrollView(Context context) {
        this(context, null);
}

    public MyScrollView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
}

    public MyScrollView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
}

    /**
     * 設定滾動介面
* @param onScrollListener
*/
public void setOnScrollListener(OnScrollListener onScrollListener) {
        this.onScrollListener = onScrollListener;
}

    /**
     * 用於使用者手指離開MyScrollView的時候獲取MyScrollView滾動的Y距離，然後回撥給onScroll方法中
*/
private Handler handler = new Handler() {

        public void handleMessage(android.os.Message msg) {
            int scrollY = MyScrollView.this.getScrollY();
//此時的距離和記錄下的距離不相等，在隔5毫秒給handler傳送訊息
if(lastScrollY != scrollY){
                lastScrollY = scrollY;
handler.sendMessageDelayed(handler.obtainMessage(), 5);
}
            if(onScrollListener != null){
                onScrollListener.onScroll(scrollY);
}

        }

    };
/**
     * 重寫onTouchEvent， 當用戶的手在MyScrollView上面的時候，
* 直接將MyScrollView滑動的Y方向距離回撥給onScroll方法中，當用戶擡起手的時候，
* MyScrollView可能還在滑動，所以當用戶擡起手我們隔5毫秒給handler傳送訊息，在handler處理
* MyScrollView滑動的距離
*/
@Override
public boolean onTouchEvent(MotionEvent ev) {
        if(onScrollListener != null){
            onScrollListener.onScroll(lastScrollY = this.getScrollY());
}
        switch(ev.getAction()){
            case MotionEvent.ACTION_UP:
                handler.sendMessageDelayed(handler.obtainMessage(), 5);
                break;
}

        Log.d("print", "getScrollY: "+this.getScrollY());
        return super.onTouchEvent(ev);
}


    /**
     *
     * 滾動的回撥介面
*
     */
public interface OnScrollListener{
        /**
         * 回撥方法， 返回MyScrollView滑動的Y方向距離
*/
public void onScroll(int scrollY);
}

    /**
     *解決ViewPager與ScrollView手勢衝突的問題
*/
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
        switch (ev.getAction()) {
            case MotionEvent.ACTION_DOWN:
                xDistance = yDistance = 0f;
xLast = ev.getX();
yLast = ev.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                final float curX = ev.getX();
                final float curY = ev.getY();
xDistance += Math.abs(curX - xLast);
yDistance += Math.abs(curY - yLast);
xLast = curX;
yLast = curY;
                if(xDistance > yDistance){
                    return false;
}
        }
        return super.onInterceptTouchEvent(ev);
}

}

最外層的ScrollView改成使用自定義的MyScrollView

問題二:

問題描述:

在專案中用到了ScrollView巢狀ViewPager巢狀ListView情況,當滑動Viewpager時ListView會突然跳到螢幕的頂部

解決方案:

在Fragment之外的控制元件中新增3個屬性

在ScrollView的根佈局中新增屬性設定

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:focusableInTouchMode="true"
android:descendantFocusability="beforeDescendants">

關鍵程式碼:

    android:focusable="true"
android:focusableInTouchMode="true"
android:descendantFocusability="beforeDescendants"

屬性是當一個為View獲取焦點時,定義ViewGroup和其子控制元件兩者之間的關係.

descendantFocousability屬性的值有三種: beforeDescendants , afterDescendants , blocksDescendants.

beforeDescendants: ViewGroup會優先其子控制元件獲取焦點.

afterDescendants: ViewGroup只有當他的子控制元件不需要獲取焦點時才獲取焦點.

blocksDescendants: ViewGroup會覆蓋子類控制元件而直接獲得焦點.

問題三:

問題描述:.當內容往上滑動,使TabLayout懸浮在頂部 需要實現的效果:
解決思路:在XML檔案中放置兩個RelativeLayout,  一個保持在原位置,一個在頂部佔位(當需要的時候把TabLayout新增進去)

解決方案:

ViewPager所在的Activity(Fragment)中

MyScrollViewHomeFragment.setOnScrollListener(this);

@Override
public void onScroll(int scrollY) {
    if (scrollY >= 600) {
        if (mTabFragmentHome.getParent() != relativeLayoutTop) {
            relativeLayoutCenter.removeView(mTabFragmentHome);
relativeLayoutTop.addView(mTabFragmentHome);
}
    } else {
        if (mTabFragmentHome.getParent() != relativeLayoutCenter) {
            relativeLayoutTop.removeView(mTabFragmentHome);
relativeLayoutCenter.addView(mTabFragmentHome);
}
    }
}

佈局檔案(此處有修改,請按照思路模仿)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
    <com.xxx.widget.MyScrollView
android:id="@+id/MyScrollView_home_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent">
        <RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="beforeDescendants"
android:focusable="true"
android:focusableInTouchMode="true">
            <android.support.v4.view.ViewPager
android:id="@+id/vp_fragment_home"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/relativeLayout_center" />
            <RelativeLayout
android:id="@+id/relativeLayout_center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/GongNeng">
                <android.support.design.widget.TabLayout
android:id="@+id/tab_fragment_home"
android:layout_width="match_parent"
android:layout_height="20dp"
android:background="#fff"
app:tabIndicatorColor="@color/primary"
app:tabMode="scrollable"
app:tabSelectedTextColor="@color/color_text_selected"
app:tabTextColor="@color/color_text_normal" />
            </RelativeLayout>
        </RelativeLayout>
    </com.xxx.widget.MyScrollView>
    <RelativeLayout
android:id="@+id/relativeLayout_top"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>