当前位置: 开发笔记 > 运维 > 正文

Android使用HorizontalScrollView实现水平滚动

作者：海and云 | 来源：互联网 | 2021-12-11 18:35

这篇文章主要为大家详细介绍了Android使用HorizontalScrollView实现水平滚动，并点击有相应的反应效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

HorizontalScrollView 和 ScrollView 都是由 FrameLayout 派生出来的。它们就是一个用于为普通组件添加滚动条的组件。且 HorizontalScrollView 和 ScrollView 里面最多只能包含一个组件（当然组件里面还可以嵌套组件）。它们不同的是 HorizontalScrollView 用于添加水平滚动，而 ScrollView 用于添加垂直滚动。

突然间想到做一个屏幕下方水平滑动，屏幕上方并作出相应的反应的效果。只是在下方滚动时，屏幕上方没有作出理想的反应，点击事件倒是实现了。最终只能在网上搜索，终于找到了一个。于是作出的效果如下：

只是这个效果还有所缺陷，加载了 13 张图片，在屏幕下方水平滚动到最后一页时，第 9 张的图片并没有在上面的显示出来(原作者的也有这个问题)；如果图片的数量小于或者等于 4 张时则不能运行。

本例的难点主要在于 MyHorizontalView 类中，并且还有收集而来的注解。

MainActivity.java :

package com.crazy.horizontalscrollviewtest;
 
import java.io.InputStream;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
 
import com.crazy.horizontalscrollviewtest.MyHorizontalView.CurrentImageChangeListener;
import com.crazy.horizontalscrollviewtest.MyHorizontalView.OnItemClickListener;
 
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.support.v7.app.AppCompatActivity;
 
 
public class MainActivity extends AppCompatActivity {
 
  private ImageView mImageView;
  private MyHorizontalView myHorizontalView;
  private List bitmapList;
  private MyAdapter adapter;
 
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
 
    init();
  }
 
  private void init() {
    mImageView = (ImageView)findViewById(R.id.imageView);
 
    bitmapList = new ArrayList<>(Arrays.asList(
        readBitMap(this, R.drawable.bricks),
        readBitMap(this, R.drawable.dog),
        readBitMap(this, R.drawable.flower),
        readBitMap(this, R.drawable.grass),
        readBitMap(this, R.drawable.stones),
        readBitMap(this, R.drawable.wood),
        readBitMap(this, R.drawable.bg_01),
        readBitMap(this, R.drawable.bg_02),
        readBitMap(this, R.drawable.bg_03),
        readBitMap(this, R.drawable.bg_04),
        readBitMap(this, R.drawable.bg_05),
        readBitMap(this, R.drawable.bg_06),
        readBitMap(this, R.drawable.bg_07)
    ));
 
    myHorizOntalView= (MyHorizontalView)findViewById(R.id.my_horizontal);
    adapter = new MyAdapter(this, bitmapList);
 
    //设置适配器
    myHorizontalView.initDatas(adapter);
 
    //添加滚动回调
    myHorizontalView
        .setCurrentImageChangeListener(new CurrentImageChangeListener() {
          @Override
          public void onCurrentImgChanged(int position, View viewIndicator) {
            Log.e("==============","===============  " + position);
            mImageView.setImageBitmap(bitmapList.get(position));
            viewIndicator.setBackgroundColor(Color.parseColor("#AA024DA4"));
          }
        });
 
    //添加点击回调
    myHorizontalView.setOnItemClickListener(new OnItemClickListener() {
      @Override
      public void onItemClick(View view, int position) {
 
        mImageView.setImageBitmap(bitmapList.get(position));
        view.setBackgroundColor(Color.parseColor("#AA024DA4"));
      }
    });
  }
 
  public static Bitmap readBitMap(Context mContext, int resId) {
    BitmapFactory.Options opt = new BitmapFactory.Options();
    opt.inPreferredCOnfig= Bitmap.Config.RGB_565;
    opt.inPurgeable = true;
    opt.inInputShareable = true;
 
    InputStream is = mContext.getResources().openRawResource(resId);
    return BitmapFactory.decodeStream(is, null, opt);
  }
 
}

MyAdapter 这部分并不是为 AbsListView 和 AbsSpinner 及其子类提供列表项的。它主要用于为 HorizontalScrollView 提供数据。

MyAdapter.java :

package com.crazy.horizontalscrollviewtest;
 
import java.util.ArrayList;
import java.util.List;
 
import android.content.Context;
import android.graphics.Bitmap;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.RelativeLayout;
 
/**
 * Created by antimage on 2016/1/9.
 */
public class MyAdapter extends BaseAdapter {
 
  private List bitmapList;
  private Context mContext;
 
  public MyAdapter(Context context, List bitmapList) {
    mCOntext= context;
    if (bitmapList == null) {
      bitmapList = new ArrayList();
    } else {
      this.bitmapList = bitmapList;
    }
  }
 
  @Override
  public int getCount() {
    return bitmapList.size();
  }
 
  @Override
  public Object getItem(int position) {
    return bitmapList.get(position);
  }
 
  @Override
  public long getItemId(int position) {
    return position;
  }
 
  @Override
  public View getView(int position, View convertView, ViewGroup parent) {
 
    ViewHolder viewHolder = null;
    View view = null;
    // 此处要用相对布局，且与 XML 中的布局相同；
    // 如果使用线性布局，则显示不完整
    RelativeLayout layout;
    if (cOnvertView== null) {
 
      layout = (RelativeLayout) View.inflate(mContext, R.layout.image_item_layout, null);
 
      viewHolder = new ViewHolder();
 
      viewHolder.image = (ImageView) layout.findViewById(R.id.top_image);
      layout.setTag(viewHolder);
    } else {
      layout = (RelativeLayout) convertView;
      view = layout;
      viewHolder = (ViewHolder) layout.getTag();
      Log.e("MyAdapter", "正在检测数据来了没有 ");
    }
    Bitmap btm = (Bitmap) getItem(position);
    viewHolder.image.setImageBitmap(btm);
 
    Log.e("MyAdapter", "信息来了哦！");
 
    return layout;
  }
 
  private static class ViewHolder {
    ImageView image;
  }
 
}

MyHorizontalView 类主要用于未 MainAcitivity 类提供接口、水平滚动时屏幕上方的反应及相应的点击事件等。该类主要使用了收集而来的代码，并做了相应的调整。

MyHorizontalView.java :

package com.crazy.horizontalscrollviewtest;
 
 
import java.util.HashMap;
import java.util.Map;
 
import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
 
/**
 * Created by antimage on 2016/1/9.
 */
public class MyHorizontalView extends HorizontalScrollView
    implements View.OnClickListener {
 
  private String TAG = "MyHorizontalView";
 
  private ViewGroup parent;
  private int screenWidth;
  /* 当前最后一张图片的index*/
  private int mCurrentIndex;
  /* 当前第一张图片的下标*/
  private int mFristIndex;
  /* 每屏幕最多显示的个数*/
  private int mCountOneScreen;
  /* 子元素的宽度*/
  private int mChildWidth;
  /* 子元素的高度*/
  private int mChildHeight;
 
  private MyAdapter mAdapter;
 
  private CurrentImageChangeListener mListener;
 
  private OnItemClickListener mOnItemClickListener;
 
  /**
   * 图片滚动时的回调接口
   */
  public interface CurrentImageChangeListener {
    void onCurrentImgChanged(int position, View viewIndicator);
  }
 
  /**
   * 点击条目时的回调
   */
  public interface OnItemClickListener {
    void onItemClick(View view, int pos);
  }
 
  /* 保存View与位置的键值对 */
  private Map mViewPos = new HashMap<>();
 
  public MyHorizontalView(Context context) {
    this(context, null);
  }
 
  public MyHorizontalView(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
  }
 
  public MyHorizontalView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
 
    this.setSmoothScrollingEnabled(true);
 
    DisplayMetrics metrics = new DisplayMetrics();
    // 取得窗口属性
    ((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(metrics);
    // 窗口的宽度 （像素）
    screenWidth = metrics.widthPixels;
  }
 
  /**
   * 初始化数据，设置数据适配器
   */
  public void initDatas(MyAdapter mAdapter) {
 
    if (getChildCount() == 0) {
      Log.e(TAG, "必须要有子元素");
    }
    if (getChildCount() == 0 || mAdapter == null)
      return;
 
    this.mAdapter = mAdapter;
    parent = (ViewGroup) getChildAt(0);
 
    // 获得适配器中第一个View
    final View view = mAdapter.getView(0, null, parent);
    parent.addView(view);
 
    // 强制计算当前View的宽和高
    if (mChildWidth == 0 && mChildHeight == 0) {
      int w = View.MeasureSpec.makeMeasureSpec(0,
          View.MeasureSpec.UNSPECIFIED);
      int h = View.MeasureSpec.makeMeasureSpec(0,
          View.MeasureSpec.UNSPECIFIED);
 
      view.measure(w, h);
      mChildHeight = view.getMeasuredHeight();
      mChildWidth = view.getMeasuredWidth();
      Log.e(TAG, "子组件的宽：" + mChildWidth + ", 子组件的高：" + mChildHeight);
 
      // 计算每次加载多少个View
      mCountOneScreen= screenWidth / mChildWidth + 2;
 
      Log.e(TAG, "mCountOneScreen= " + mCountOneScreen
          + " ,mChildWidth = " + mChildWidth);
    }
    //初始化第一屏幕的元素
    loadFirstChild(mCountOneScreen);
  }
 
  /**
   * 加载第一屏的View
   */
  public void loadFirstChild(int mCountOneScreen) {
 
    parent.removeAllViews();
    mViewPos.clear();
 
    for (int i = 0; i = mChildWidth) {
          loadNextImage();
        }
        // 如果当前scrollX = 0， 往前设置一张，移除最后一张
        if (scrollX == 0) {
          loadPreImage();
        }
        break;
    }
    // 这里无论返回值是设置 true 还是 false
    // HorizontalScrollView都不会滑动
    return super.onTouchEvent(event);
  }
 
  /**
   * 加载下一张图片
   */
  protected void loadNextImage() {
    // 数组边界值计算
    if (mCurrentIndex == mAdapter.getCount() - 1) {
      return;
    }
    //移除第一张图片，且将水平滚动位置置0（图片有宽度，所以为置0）
    scrollTo(0, 0);
    mViewPos.remove(parent.getChildAt(0));
    parent.removeViewAt(0);
 
    //获取下一张图片，并且设置onClick事件，且加入容器中
    View view = mAdapter.getView(++mCurrentIndex, null, parent);
    Log.e(TAG, "mCurrentIndex ===" + mCurrentIndex);
    view.setOnClickListener(this);
    parent.addView(view);
    mViewPos.put(view, mCurrentIndex);
 
    //当前第一张图片小标
    mFristIndex++;
    //如果设置了滚动监听则触发
    if (mListener != null) {
      notifyCurrentImageChanged();
    }
 
  }
 
  /**
   * 加载前一张图片
   */
  protected void loadPreImage() {
    //如果当前已经是第一张，则返回
    if (mFristIndex == 0)
      return;
    //获得当前应该显示为第一张图片的下标
    int index = mCurrentIndex - mCountOneScreen;
    if (index >= 0) {
      //移除最后一张
      int oldViewPos = parent.getChildCount() - 1;
      mViewPos.remove(parent.getChildAt(oldViewPos));
      parent.removeViewAt(oldViewPos);
 
      //将此View放入第一个位置
      View view = mAdapter.getView(index, null, parent);
      mViewPos.put(view, index);
      parent.addView(view, 0);
      view.setOnClickListener(this);
      //水平滚动位置向左移动view的宽度个像素
      scrollTo(mChildWidth, 0);
      //当前位置--，当前第一个显示的下标--
      mCurrentIndex--;
      mFristIndex--;
      //回调
      if (mListener != null) {
        notifyCurrentImageChanged();
      }
    }
  }
 
  /**
   * 滑动时的回调
   */
  public void notifyCurrentImageChanged() {
 
    int sum = parent.getChildCount();
    for (int i = 0; i

该类中的很多数据都在 List 集合里面，而集合的下标初始值为 0，与 list.size() 不相等。顾猜测，正是由于这个原因，在 mImageView 显示图片时，不能显示到第 9 张。

在这个类中计算每次加载多少个 View 时的 mCountOneScreen 计算方法感觉略有问题，从效果图中可以看出，屏幕中能加载 3 张多一点的图片。mCountOneScreen= screenWidth / mChildWidth + 2; 在我的模拟器上计算得出的结果等于 5，也就是为什么不能加载小于等于 4 张图片，如果想要让该屏幕底部上只显示 3 张即一个屏幕也就能显示完。那就不用水平滚动了，那样就感觉使用 HorizontalScrollView 失去了意义。

所用到的布局文件：

content_main.xml :

<&＃63;xml version="1.0" encoding="utf-8"&＃63;>

image_item_layout.xml (主要用于提供水平滚动的图片(屏幕底部)):

<&＃63;xml version="1.0" encoding="utf-8"&＃63;>

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

推荐阅读

容器
Android 自定义 Spinner 下拉框样式

本文介绍了如何通过创建自定义 XML 文件来修改 Android 中 Spinner 的项样式，包括颜色和大小的调整。 ... [详细]

蜡笔小新 2024-11-25 01:39:41
容器
Android 开发框架整合：MVP + Retrofit + Dagger2 + RxAndroid 配置指南

本文将详细介绍如何配置并整合MVP架构、Retrofit网络请求库、Dagger2依赖注入框架以及RxAndroid响应式编程库，构建高效、模块化的Android应用。 ... [详细]

蜡笔小新 2024-11-24 20:16:02
容器
浅谈Android五大布局——LinearLayout、FrameLayout和AbsoulteLa

为什么80%的码农都做不了架构师？Android的界面是有布局和组件协同完成的，布局好比是建筑里的框架，而组件则相当于建筑里的砖瓦。 ... [详细]

蜡笔小新 2024-11-24 16:56:56
容器
Android 开发技巧：动态修改 strings.xml 文件中的字符串值

本文介绍了一种在 Android 开发中动态修改 strings.xml 文件中字符串值的有效方法。通过使用占位符，开发者可以在运行时根据需要填充具体的值，从而提高应用的灵活性和可维护性。 ... [详细]

蜡笔小新 2024-11-24 11:51:17
port
Docker基础入门与环境配置指南

本文介绍了Docker——一款用Go语言编写的开源应用程序容器引擎。通过Docker，用户能够将应用及其依赖打包进容器内，实现高效、轻量级的虚拟化。容器之间采用沙箱机制，确保彼此隔离且资源消耗低。 ... [详细]

蜡笔小新 2024-11-24 09:54:53
服务器
如何高效学习鸿蒙操作系统：开发者指南

本文探讨了开发者如何更有效地学习鸿蒙操作系统，提供了来自行业专家的建议，包括系统化学习方法、职业规划建议以及具体的开发技巧。 ... [详细]

蜡笔小新 2024-11-23 19:22:14
服务器
在Notepad++中配置Markdown语法高亮及实时预览功能

本文详细介绍了如何在Notepad++中配置Markdown语法高亮和实时预览功能，包括必要的插件安装和设置步骤。 ... [详细]

蜡笔小新 2024-11-22 13:03:49
linux
Android 中的布局方式之线性布局

nsitionalENhttp:www.w3.orgTRxhtml1DTDxhtml1-transitional.dtd ... [详细]

蜡笔小新 2024-11-22 11:20:34
负载均衡
为何Compose与Swarm之后仍有Kubernetes的诞生？

探讨在已有Compose和Swarm的情况下，Kubernetes是如何以其独特的设计理念和技术优势脱颖而出，成为容器编排领域的领航者。 ... [详细]

蜡笔小新 2024-11-22 09:26:11
服务器
Quartz 实现 Web 工程动态定时任务调度方案

本文探讨了一个Web工程项目的需求，即允许用户随时添加定时任务，并通过Quartz框架实现这些任务的自动化调度。文章将介绍如何设计任务表以存储任务信息和执行周期，以及如何通过一个定期扫描机制自动识别并加载新任务到调度系统中。 ... [详细]

蜡笔小新 2024-11-24 16:22:58
容器
Docker运行中实例端口映射调整方法

本文探讨了在Docker容器运行期间调整端口映射的方法，包括前期规划与运行时需求变更两种常见场景下的解决方案。 ... [详细]

蜡笔小新 2024-11-24 08:44:31
linux
春季职场跃迁指南：如何高效利用金三银四跳槽季

随着每年的‘金三银四’跳槽高峰期的到来，许多职场人士都开始考虑是否应该寻找新的职业机会。本文将探讨如何制定有效的职业规划、撰写吸引人的简历以及掌握面试技巧，助您在这关键时期成功实现职场跃迁。 ... [详细]

蜡笔小新 2024-11-22 19:18:22
容器
如何在Docker中使用构建时参数创建动态环境变量

本文探讨了如何在Docker构建过程中使用动态环境变量，特别是针对Docker v1.9及以上版本的用户。我们将介绍如何声明和使用构建参数，以及这些参数对构建缓存的影响。 ... [详细]

蜡笔小新 2024-11-22 12:57:32
服务器
JSP中检查服务器文件存在性时遇到500错误请求协助

问题概述：在本地环境中代码运行正常，但部署到服务器后出现错误。具体表现为NCManager和SAXBuilder无法解析为类型。 ... [详细]

蜡笔小新 2024-11-22 12:51:10
服务器
Python对象序列化至磁盘的封装与实现

本文探讨了如何将Python对象转换为字节流，以实现文件保存、数据库存储或网络传输的需求。主要介绍了利用pickle模块进行序列化的具体方法。 ... [详细]

蜡笔小新 2024-11-22 10:51:09

海and云

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章