android中HorizontalScrollView实现viewpager的效果

原创 2015年07月07日 19:12:01

       因为工作上的需求,要实现一个翻页的页面,入下图:

      

     刚开始看到这种页面,想过viewpager,不过后来想换别的方式,所以想过gridview,但是gridview无法翻页,所以试了不行。后来想到了HorizontalScrollView这个控件。然后就试了一下,感觉还可以,基本上滑动的功能差不多了,就差翻页的功能,所以就上网查了很多资料。终于查到pageScroll这个方法,看看上面的介绍:


    简单来说,通过这个方法可以实现向左或者向右翻页,所以后来自己就有思路了,可以在onTouchListener中,监听x坐标来判断,用户是向左还是向右滑动,核心代码如下:

	/*int position=sections.size()%3==0?sections.size()/3:sections.size()/3+1;    //这里因为是刚好每一页三列,所以需要这么计算
	WindowManager wm=(WindowManager) getSystemService(Context.WINDOW_SERVICE);
	int width=wm.getDefaultDisplay().getWidth();
	int height=wm.getDefaultDisplay().getHeight();	
		for(int i=0;i<position;i++)
		{
			 View convertView=getLayoutInflater().inflate(R.layout.topicadd_item, null);
			 MarginLayoutParams mlp=new MarginLayoutParams(width/3, MarginLayoutParams.WRAP_CONTENT);
			 convertView.setLayoutParams(mlp);
			 	TextView tv1=(TextView) convertView.findViewById(R.id.topic_add_tv1);
				TextView tv2=(TextView) convertView.findViewById(R.id.topic_add_tv2);
				TextView tv3=(TextView) convertView.findViewById(R.id.topic_add_tv3);
				if(3*i<=sections.size()-1)
				{
					tv1.setText(sections.get(3*i));
					tv1.setTag(sections.get(3*i));
					tv1.setOnClickListener(this);
				}
			    if(3*i+1<=sections.size()-1)
			    {
					tv2.setText(sections.get(3*i+1));	
					tv2.setTag(sections.get(3*i+1));
					tv2.setOnClickListener(this);
			    }else
			    {
			    	tv2.setVisibility(View.INVISIBLE);
			    }
			    if((3*i+2)<=sections.size()-1)
			    {
			    	tv3.setText(sections.get(3*i+2));
			    	tv3.setTag(sections.get(3*i+2));
					tv3.setOnClickListener(this);
			    }else
			    {
			    	tv3.setVisibility(View.INVISIBLE);
			    }
			  lly.addView(convertView);  //把item布局添加到HorizontalScrollView的子布局中
		}*/    
onTouchListener的onTouch方法中,判断:

	public boolean onTouch(View v, MotionEvent event) {
				float xDown = 0;
				float xUp = 0;
				switch(event.getAction())
				{
				case MotionEvent.ACTION_DOWN:
					Log.e("TAG", "ACTION_DOWN");
					xDown=event.getX();
					break;
				case MotionEvent.ACTION_UP:
					Log.e("TAG", "ACTION_UP");
					xUp=event.getX();
					if(xUp-xDown>0)
					{
						hsv.pageScroll(View.FOCUS_RIGHT);//向左翻页
					}else
					{
						hsv.pageScroll(View.FOCUS_LEFT);
					}
					break;
				}
				return true;
			}
 核心代码基本是这样。不过因为在onTouch方法中ACTION_DOWN始终拦截不到,最终还是放弃了。采用viewpager轻松实现了。后面再补充吧。

     

版权声明:本文为博主原创文章,未经博主允许不得转载。

Android 自定义 HorizontalScrollView 实现ViewPager效果,打造再多图片(控件)也不怕 OOM

1. 效果上次实现了这个IOS Reveal效果,能够确保中间部分是彩色其余部分是灰色,但是也遗留了两个问题:   (1)如果把它做成ViewPager效果的方式可能会更好;   (2)Horiz...
  • z240336124
  • z240336124
  • 2016年03月13日 16:48
  • 12514

ViewPager和Fragment结合,利用(HorizontalScrollView)实现指示器与ViewPager同时滑动的动态效果

首先是布局文件,布局中需要一个HorizontalScrollView用来承载所有标题和指示器,注意HorizontalScrollView中只能有一个子布局,所以要添加一个Linearlayout(...
  • u012310981
  • u012310981
  • 2015年04月01日 18:51
  • 1650

利用HorizontalScrollView自己写一个viewPager指示器

目前滑动指示器最著名的是JakeWarton的ViewpagerIndicator,用别人的东西固然方便,但是也带来很多使用上的疑惑,这篇博客,我们使用HorizontalScrollView自己写一...
  • u013835855
  • u013835855
  • 2017年05月04日 12:28
  • 786

Android 中使用ViewPager实现画廊效果

Android 中使用ViewPager实现画廊效果
  • qq_33523706
  • qq_33523706
  • 2016年11月14日 16:06
  • 652

Android——ViewPager实现3D画廊效果(ViewPager的加载动画)

这里写链接内容这个例子相信很多人已经接触过了,我今天觉得好玩自己写了写,参照了网上大家的一些例子,现在总结下自己的感受吧。 ViewPager的用法 android:clipChildren=”fal...
  • u012230055
  • u012230055
  • 2016年11月03日 17:55
  • 687

[Android] 带阻尼效果的可拉伸的HorizontalScrollView

昨天美工说需要带苹果的带阻尼效果的可拉伸的HorizontalScrollView。然后花了几个小时实现了效果。 代码如下: package view; import android.conte...
  • darling_shadow
  • darling_shadow
  • 2014年11月26日 12:47
  • 1562

ViewPager实现简单的画廊效果

效果图如下: 实现思路如下: 1、将ViewPager的宽度设置为屏幕宽度的一半,并将ViewPager置于屏幕的中央; 2、通过clipChildren属性将ViewPager控件范围外的Vi...
  • wwww_dong
  • wwww_dong
  • 2017年04月05日 16:03
  • 897

Android开发学习之基于ViewPager实现Gallery画廊效果

通过我们前面的学习,我们知道ViewPager是可以做出近乎完美的滑动体验,回顾整个Android,我们发现Gallery具备同样的特点,于是我们大胆地猜想,Gallery是否和ViewPager之间...
  • qinyuanpei
  • qinyuanpei
  • 2013年12月11日 09:02
  • 7677

利用ViewPager实现画廊Gallery效果

1 需求确认 2利用viewpager实现画廊效果 viewpager的继承关系 使用ViewGroup的setClipChildrenboolean clipChildren方法 使用viewpag...
  • m0_37168878
  • m0_37168878
  • 2017年05月24日 14:42
  • 1387

(气泡动画)水平HorizontalScrollView使用

最近,整理了一些小功能;做了一个水平HorizontalScrollView的demo;现在分享给大家看看 先把需要的图片也提供出来,方便想学得可以尝试,体验: 一张是时间轴,一张是气泡; ...
  • qq_25526067
  • qq_25526067
  • 2016年02月18日 19:44
  • 489
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:android中HorizontalScrollView实现viewpager的效果
举报原因:
原因补充:

(最多只允许输入30个字)