android实现上下左右滑动界面布局

移动开发 得得之家
这篇文章主要为大家详细介绍了android实现上下左右滑动的界面布局，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了android实现滑动界面布局的具体代码，供大家参考，具体内容如下

1.我使用的是ScrollView嵌套HorizontalScrollView让ScrollView负责上下滑动HorizontalScrollView负责左右滑动

2.以下代码提供了思路和完成手段，请根据具体业务去进行修改，我试过使用recyclerview进行自定义，发现一旦有了复杂业务之后会掉帧卡顿所以使用了这种方法

XML布局


<?xml version="1.0" encoding="utf-8"?>

  <test.smartonet.com.myapplication.PagerScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical">

      <HorizontalScrollView
        android:id="@+id/hor"
        android:layout_width="match_parent"
        android:background="#e1f1f1"
        android:layout_height="160dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A2"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A3"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A4"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A5"/><TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A6"/><TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A1"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A2"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A3"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A4"/> <TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A5"/><TextView
          android:layout_width="160dp"
          android:layout_height="60dp"
          android:gravity="center"
          android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>



      <HorizontalScrollView
        android:id="@+id/hor1"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#a2f2f2"
        android:layout_height="160dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>
 <HorizontalScrollView
        android:id="@+id/hor2"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#a2a2f2"
        android:layout_height="160dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>


      <HorizontalScrollView
        android:id="@+id/hor3"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#f3f3f3"
        android:layout_height="160dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>
      <HorizontalScrollView
        android:id="@+id/hor4"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#a4f4f4"
        android:layout_height="200dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>

      <HorizontalScrollView
        android:id="@+id/hor5"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#f5f5f5"
        android:layout_height="200dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>

      <HorizontalScrollView
        android:id="@+id/hor6"
        android:layout_width="match_parent"
        android:scrollbars="none"
        android:background="#a5f5f5"
        android:layout_height="200dp">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center|left"
          android:gravity="center"
          android:orientation="horizontal">
          <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A1"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A2"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A3"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A4"/> <TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A5"/><TextView
            android:layout_width="160dp"
            android:layout_height="60dp"
            android:gravity="center"
            android:text="A6"/>
        </LinearLayout>

      </HorizontalScrollView>

    </LinearLayout>
</test.smartonet.com.myapplication.PagerScrollView>

mainAvtivity的代码


package test.smartonet.com.myapplication;

import android.annotation.SuppressLint;
import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.ScrollView;
import android.widget.TextView;
import android.widget.Toast;

import org.w3c.dom.Text;

import java.lang.reflect.Array;
import java.util.ArrayList;
import java.util.List;

/**
 * zhaohan creat 2019/3/6
 */
public class MainActivity extends AppCompatActivity {
  String TAG = "主程序";
  float mPosX;
  float mPosY;
  float mCurPosX;
  float mCurPosY;
  int offset=10;//偏移量
  int friction = 10;//摩擦力
  final List<HorizontalScrollView> list = new ArrayList();

  @SuppressLint("ClickableViewAccessibility")
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    final PagerScrollView scrollView = findViewById(R.id.main);
    list.add((HorizontalScrollView) findViewById(R.id.hor));
    list.add((HorizontalScrollView) findViewById(R.id.hor1));
    list.add((HorizontalScrollView) findViewById(R.id.hor2));
    list.add((HorizontalScrollView) findViewById(R.id.hor3));
    list.add((HorizontalScrollView) findViewById(R.id.hor4));
    list.add((HorizontalScrollView) findViewById(R.id.hor5));
    list.add((HorizontalScrollView) findViewById(R.id.hor6));



    for(HorizontalScrollView horizontalScrollView:list){
      horizontalScrollView.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
          switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
              mPosX = event.getX();
              mPosY = event.getY();
              Log.w(TAG,mPosY+"");
              break;
            case MotionEvent.ACTION_MOVE:
              mCurPosX = event.getX();
              mCurPosY = event.getY();
            case MotionEvent.ACTION_UP:
              if (mCurPosX - mPosX > 0 && (Math.abs(mCurPosX - mPosX) > offset)) {
                int speed = 10;//速度
                int distance = 20;//滑动距离
                if((Math.abs(mCurPosX - mPosX))>50){
                  speed = (int) Math.abs(mCurPosX - mPosX)/friction;
                  distance = (int) Math.abs(mCurPosX - mPosX)/3;//滑动距离
                }
                //向右滑動
                Log.w(TAG,"向右滑动了！");
                while(distance>0) {
                  distance = distance - speed;
                  for(HorizontalScrollView horizontalScrollView:list){
                    horizontalScrollView.smoothScrollBy(distance, 0);
                  }
                }
                return true;//true为屏蔽范围内的其他滑动监听
              } else if (mCurPosX - mPosX < 0 && (Math.abs(mCurPosX - mPosX) > offset)) {
                int speed = 10;//速度
                int distance = 20;//滑动距离
                if((Math.abs(mCurPosX - mPosX))>50){
                  speed = (int) Math.abs(mCurPosX - mPosX)/friction;
                  distance = (int) Math.abs(mCurPosX - mPosX)/3;//滑动距离
                }
                //向左滑动
                Log.w(TAG,"向左滑动了！");
                //改为滑动
                while(distance>0){
                  distance=distance-speed;
                  for(HorizontalScrollView horizontalScrollView:list){
                    horizontalScrollView.smoothScrollBy(-distance,0 );
                  }
                }
                return true;//true为屏蔽范围内的其他滑动监听
              }
              break;
          }
          return true;//true为屏蔽范围内的其他滑动监听
        }
      });
    }
  }
}

class PagerScrollView extends ScrollView {

  private float xDistance, yDistance, xLast, yLast;

  public PagerScrollView(Context context) {
    super(context);
  }

  public PagerScrollView(Context context, AttributeSet attrs) {
    super(context, attrs);
  }

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

  @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;

        /**
         * X轴滑动距离大于Y轴滑动距离，也就是用户横向滑动时，返回false，ScrollView不处理这次事件，
         * 让子控件中的TouchEvent去处理，所以横向滑动的事件交由ViewPager处理，
         * ScrollView只处理纵向滑动事件
         */
        if (xDistance > yDistance) {
          return false;
        }
    }

    return super.onInterceptTouchEvent(ev);
  }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持得得之家。

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！

相关文档推荐

前端开发编程语言数据库服务器系统/运维网络/安全移动开发建站教程网站运营
html vue validate adobe dreamweaver hbuilder vscode aptana editor dedecms ckeditor 编辑器 过滤 规则 织梦 图片本地化 模板 缩略图 图集 图片删除 ajax 瀑布流 无限下拉 cms 判断 sql 清除 tag 文档数 angularjs2 按钮 切换效果 vue3 thinkphp yii2 css 项目列表 li go Beego Buffalo Echo Gin Iris Revel 百度云 虚拟主机 pbootcms 伪静态 框架 排序 数据库 对象 字段 sql语句 php 字符串 分割 D3.js bootstrap 函数 svg selectAll 织梦cms 关键词 解析 采集 长度限制 日期 正则表达式