ScrollView+ViewPager+Fragment+Re
2018-09-04 本文已影响445人
吾乃韩小呆
这段时间比较忙许久没有写博客了，今天写一个这几天项目内遇到的问题，问题就是如题的滑动冲突问题，烦得很啊。
一、需求
一个界面（p话），大概分文四部分，第一部分是一个地图缩略图，第二部分是关于物品的详细信息，第三部分是控制时间的按钮即查询条件，最后一部分是可以点击或者是互动的轮播类界面。
二、需求实现分析
1、第一种想法肯定是弄个 RecycleView 然后去实现 RecycleView 的丰富多彩列表，额，谁想到了，谁去试一试吧，反正版主很菜，并且很懒，就算了不搞不了，搞不了；
2、就是如题的方案了ScrollView+ViewPager+Fragment+RecycleView，其实，我感觉相比于找后台那群货，帮我改改接口，不如自己解决解决冲突呢。
三、布局搭建
我感觉这个很简单，走心就行了，算了还是把源码搞来吧
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context=".activity.HistoryInfoActivity">
<include layout="@layout/activity_title_bar" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.baidu.mapapi.map.MapView
android:id="@+id/mv_history"
android:layout_width="match_parent"
android:layout_height="200dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="30dp"
android:background="#2370C0"
android:gravity="center_vertical"
android:paddingEnd="1dp"
android:paddingStart="20dp"
android:text="项目介绍"
android:textColor="#ffffff"
android:textSize="16sp" />
<TextView
android:id="@+id/tv_address_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_marginTop="40dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="安装位置："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginTop="40dp"
android:layout_toEndOf="@+id/tv_address_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="安装位置" />
<TextView
android:id="@+id/tv_pro_name_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_address_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="项目名称："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_pro_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_address_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_pro_name_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="项目名称" />
<TextView
android:id="@+id/tv_system_name_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_pro_name_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="系统名称："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_system_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_pro_name_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_system_name_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="系统名称" />
<TextView
android:id="@+id/tv_device_type_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_system_name_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="设备型号："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_device_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_system_name_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_device_type_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="设备型号" />
<TextView
android:id="@+id/tv_device_number_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_device_type_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="设备编号："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_device_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_device_type_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_device_number_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="设备编号" />
<TextView
android:id="@+id/tv_firm_name_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_device_number_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="厂 商："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_firm_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_device_number_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_firm_name_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="厂 商" />
<TextView
android:id="@+id/tv_principal_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_firm_name_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="负 责 人："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_principal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_firm_name_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_principal_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="负 责 人" />
<TextView
android:id="@+id/tv_fireguard_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_principal_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="防 火 员："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_fireguard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_principal_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_fireguard_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="防火员" />
<TextView
android:id="@+id/tv_remark_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="@+id/tv_fireguard_h"
android:layout_marginTop="5dp"
android:lines="1"
android:maxLines="1"
android:paddingStart="20dp"
android:singleLine="true"
android:text="备 注："
android:textColor="#666666"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_remark"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/tv_fireguard_h"
android:layout_marginTop="5dp"
android:layout_toEndOf="@+id/tv_remark_h"
android:lines="1"
android:maxLines="1"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:singleLine="true"
android:textColor="#3c3c3c"
android:textSize="14sp"
tools:text="备 注" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_history_start"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="5dp"
android:layout_marginStart="10dp"
android:layout_weight="1"
android:background="@drawable/shape_round_p"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="开始时间"
android:textColor="#ffffff"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_history_end"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="5dp"
android:layout_marginStart="5dp"
android:layout_weight="1"
android:background="@drawable/shape_round_p"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="结束时间"
android:textColor="#ffffff"
android:textSize="14sp" />
<TextView
android:id="@+id/tv_history_search"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:layout_marginStart="5dp"
android:layout_weight="1"
android:background="@drawable/shape_round_p"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="查询"
android:textColor="#ffffff"
android:textSize="14sp" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tl_history_list_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
app:tabBackground="@color/historyColor"
app:tabIndicatorColor="#E21918"
app:tabMode="fixed"
app:tabSelectedTextColor="#E21918"
app:tabTextColor="#ffffff" />
<cn.ln80.happybirdcloud119.view.MyHistoryViewPager
android:id="@+id/vp_history_list"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</ScrollView>
</LinearLayout>
请记住，版主很懒，也是让各位知道了具体操作，所以没有用 style.xml 相关的操作，这些事源码。
细心的你定发现了 这里的 ViewPager 与众不同，对了，被自定义了。
四、解决冲突的关键 自定义 ViewPager
import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View;
/**
* Content：ScrollView与viewPager之间的滑动冲突
* Actor：韩小呆 ヾ(✿ﾟ▽ﾟ)ノ
* Time: 2018/8/1 13:48
* Update:
* Time:
*/
public class MyHistoryViewPager extends ViewPager {
public MyHistoryViewPager(Context context) {
super(context);
}
public MyHistoryViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int height = 0;
for (int i = 0; i < getChildCount(); i++) {
View child = getChildAt(i);
child.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
int h = child.getMeasuredHeight();
if (h > height)
height = h;
}
heightMeasureSpec = MeasureSpec.makeMeasureSpec(height,
MeasureSpec.EXACTLY);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
这里只是 ViewGroup 根据 其内的 view 高度来 适应处自身的高度。然后我们，我们运行一下代码，看看效果：
首次解决冲突效果
细心的你一定发现了，当点击 TabLayout 上的 TabItem 的时候神奇的事情发生了，你的RecycleView自带动画效果---闪现了。
你可以屁颠，屁颠的去找产品了，告诉他，你来了点睛之笔 ，帮助产品 做了动画效果，可以提高用户的可见性，让用户可以很直观的知道下面列表有数据 巴拉巴拉...一大堆，反正是就是让产品背锅呗！（2333）
但是产品也不都是傻狍子哈，下面，告诉你如何解决这个问题。
五、解决闪现 bug
其实吧，很简单，一行代码搞定 ，就是在你的自定义的 ViewPager 直接引用如下方法
vpHistoryList.setDescendantFocusability(ViewGroup.FOCUS_BLOCK_DESCENDANTS);
彻底解决的效果
完美效果
今天就这些了，该去解决 Zxing 识别度问题了，每天积累一点，对自己没坏处哈。
我的博客即将入驻“云栖社区”，诚邀技术同仁一同入驻。
