美文网首页
ScrollView+ViewPager+Fragment+Re

ScrollView+ViewPager+Fragment+Re

作者: 吾乃韩小呆 | 来源:发表于2018-09-04 15:15 被阅读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 识别度问题了,每天积累一点,对自己没坏处哈。

    我的博客即将入驻“云栖社区”,诚邀技术同仁一同入驻。

    相关文章

      网友评论

          本文标题:ScrollView+ViewPager+Fragment+Re

          本文链接:https://www.haomeiwen.com/subject/iwygwftx.html