自定义HorizontalScrollView嵌套HorizontalListView实现手势监听、按钮监听横向滚动功能

最新推荐文章于 2023-04-20 18:47:14 发布
最新推荐文章于 2023-04-20 18:47:14 发布
阅读量1.4k 收藏 1
点赞数 1
分类专栏： 自定义控件 文章标签： android 横向滚动 HorizontalScrollView HorizontalListView
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lxlyhm/article/details/52245403
版权

       今日空闲花了点时间对以前自主实现的项目功能进行改进和优化， 其实一些界面的小功能有时候没实现过，也没经验类似项目功能经验，反而耗费的时间会更多。下面我所描述的界面功能就是我在对用RecyclerView控件不熟悉的情况下使用了HorizontalScrollView来实现的，在我把它优化成RecyclerView控件之前在此做个笔录，方便以后查阅。

       按照以往的惯例，先上效果图（既可以手势监听，也可以按钮监听）

1.HorizontalScrollView滑动到最左边的时候，左边箭头光标变灰色

2.HorizontalScrollView滑动到不是最左边也不是最右边的时候，左右两边箭头光标都是较深的灰色

3.HorizontalScrollView滑动到最右边的时候，右边箭头光标变灰色


       首先要明确实现的界面功能是：自定义HorizontalScrollView嵌套HorizontalListView实现手势监听、按钮监听滑动。

       此处给大家一个自定义HorizontalListView开源库的链接地址：http://pan.baidu.com/s/1dENbGIH（开源库也是我当初从谷歌下载的，那就借此篇文章感谢一下这位开源库的作者，当初是他这个开源库封装得比较好帮助我实现了这个项目所需功能）

       有了HorizontalListView开源库，接下去一切事情都好办了，首先需要一个自定义HorizontalScrollView，附上代码：

       (参考来自：http://www.cnblogs.com/java-koma/archive/2012/11/02/2751594.html)

public class MyHorizontalScrollView extends HorizontalScrollView
{
	private Runnable scrollerTask;
	private int intitPosition;
	private int newCheck = 100;
	private int childWidth = 0;

	public interface OnScrollStopListner
	{
		/**
		 * scroll have stoped
		 */
		void onScrollStoped();

		/**
		 * scroll have stoped, and is at left edge
		 */
		void onScrollToLeftEdge();

		/**
		 * scroll have stoped, and is at right edge
		 */
		void onScrollToRightEdge();

		/**
		 * scroll have stoped, and is at middle
		 */
		void onScrollToMiddle();
	}

	private OnScrollStopListner onScrollstopListner;

	public MyHorizontalScrollView(Context context, AttributeSet attrs)
	{
		super(context, attrs);
		scrollerTask = new Runnable()
		{
			@Override
			public void run()
			{
				int newPosition = getScrollX();
				if (intitPosition - newPosition == 0)
				{
					if (onScrollstopListner == null)
					{
						return;
					}
					onScrollstopListner.onScrollStoped();
					Rect outRect = new Rect();
					getDrawingRect(outRect);
					if (getScrollX() == 0)
					{
						onScrollstopListner.onScrollToLeftEdge();
					} else if (childWidth + getPaddingLeft() + getPaddingRight() == outRect.right)
					{
						onScrollstopListner.onScrollToRightEdge();
					} else
					{
						onScrollstopListner.onScrollToMiddle();
					}
				} else
				{
					intitPosition = getScrollX();
					postDelayed(scrollerTask, newCheck);
				}
			}
		};
	}

	public void setOnScrollStopListner(OnScrollStopListner listner)
	{
		onScrollstopListner = listner;
	}

	public void startScrollerTask()
	{
		intitPosition = getScrollX();
		postDelayed(scrollerTask, newCheck);
		checkTotalWidth();
	}

	private void checkTotalWidth()
	{
		if (childWidth > 0)
		{
			return;
		}
		for (int i = 0; i < getChildCount(); i++)
		{
			childWidth += getChildAt(i).getWidth();
		}
	}

}


接下去写xml布局文件： 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/color_fff_white" >

    <LinearLayout
        android:id="@+id/LinearLayout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:background="@color/color_f9"
        android:gravity="center_vertical" >

        <RelativeLayout
            android:id="@+id/rl_news_back"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center" >

            <ImageView
                android:id="@+id/img_news_back"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:visibility="gone"
                android:src="@drawable/back"/>
            
            <ImageView
                android:id="@+id/img_news_back_pre"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:src="@drawable/left_gray" />
            
        </RelativeLayout>

        <com.example.custom.MyHorizontalScrollView
            android:id="@+id/horizontalScrollView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.50"
            android:scrollbars="none" >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="75dp"
                android:orientation="horizontal" >

                <com.meetme.android.horizontallistview.HorizontalListView
                    android:id="@+id/head_horizontalView"
                    android:layout_width="880dp"
                    android:layout_height="75dp">
                </com.meetme.android.horizontallistview.HorizontalListView>
            </LinearLayout>
        </com.example.custom.MyHorizontalScrollView>

        <RelativeLayout
            android:id="@+id/rl_news_enter"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center" >

            <ImageView
                android:id="@+id/img_news_enter"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:src="@drawable/goenter" />
            
            <ImageView
                android:id="@+id/img_news_enter_pre"
                android:layout_width="30dp"
                android:visibility="gone"
                android:layout_height="wrap_content"
                android:src="@drawable/right_gray" />
        </RelativeLayout>
    </LinearLayout>

</RelativeLayout>


好了，一切都准备就绪以后，接下去就是MainActivity.java的主要代码了，也是比较简单的

1.适配器代码

//TODO  水平ListViewAdapter
	class HorizontalListViewAdapter extends BaseAdapter{

		@Override
		public int getCount() {
			return mHorizontalData.size();
		}
		
		@Override
		public Object getItem(int position) {
			return position;
		}
		
		@Override
		public long getItemId(int position) {
			return position;
		}

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			View layout = null;
			ViewHolder vh = null;
			if (convertView == null)
			{
				vh = new ViewHolder();
				layout = getLayoutInflater().inflate(R.layout.list_item_horizontallistview, null);
				vh.HorizontalLv_im=(ImageView)layout.findViewById(R.id.financail_item_imageView);
				vh.HorizontalLv_title=(TextView)layout.findViewById(R.id.financail_item_textView);
				layout.setTag(vh);
			} else
			{
				layout = convertView;// convertView 不为空 复用消失的行数
				vh = (ViewHolder) layout.getTag();// 得到标签 口袋
			}

			HomeData homeData = mHorizontalData.get(position);
			vh.HorizontalLv_title.setText(homeData.getTitle());
			vh.HorizontalLv_im.setImageResource(homeData.getImg());
			
			return layout;
		}
	}
//TODO 创建一个查找的类 目的是减少查找次数 无需每次都重复查找
<span style="white-space:pre">	</span>public static class ViewHolder
<span style="white-space:pre">	</span>{
<span style="white-space:pre">		</span>public ImageView HorizontalLv_im;
<span style="white-space:pre">		</span>public TextView HorizontalLv_title;
<span style="white-space:pre">	</span>}
其中 HomeData是自定义的一个listview数据优化类，大家可以根据listview的item需求来确定这个类的内容即可，非常简单，此处我就不贴代码了

onCreate的代码： 

		hlv = (HorizontalListView) findViewById(R.id.head_horizontalView);
		
		horizontalScrollView = (MyHorizontalScrollView) findViewById(R.id.horizontalScrollView1);
		rl_news_back = (RelativeLayout) head_financial_news_headtwo.findViewById(R.id.rl_news_back);
		rl_news_enter = (RelativeLayout) head_financial_news_headtwo.findViewById(R.id.rl_news_enter);
		img_news_back = (ImageView) head_financial_news_headtwo.findViewById(R.id.img_news_back);
		img_news_back_pre = (ImageView) head_financial_news_headtwo.findViewById(R.id.img_news_back_pre);
		img_news_enter = (ImageView) head_financial_news_headtwo.findViewById(R.id.img_news_enter);
		img_news_enter_pre = (ImageView) head_financial_news_headtwo.findViewById(R.id.img_news_enter_pre);
		
		hlva = new HorizontalListViewAdapter();
		hlva.notifyDataSetChanged();
		hlv.setAdapter(hlva);
<pre name="code" class="html">                clickHorizontalListview()

 

<pre name="code" class="html">private void clickHorizontalListview()
	{
		hlv.setOnItemClickListener(new OnItemClickListener()
		{

			@Override
			public void onItemClick(AdapterView<?> parent, View view, int position, long id)
			{
				tv_tilte.setText(mHorizontalData.get(position).getTitle());
				select_item1 = position; //当前选择的节目item
				hlva.notifyDataSetChanged();
			}
		});
		
		horizontalScrollView.setOnTouchListener(new OnTouchListener() {      
            @Override  
            public boolean onTouch(View v, MotionEvent event) {   
                 
                //如果触动屏幕就执行   
                if (event.getAction() == MotionEvent.ACTION_UP)
                {
                	horizontalScrollView.startScrollerTask();
                }
                return false;
                
                  
            }   
        });  
		
		horizontalScrollView.setOnScrollStopListner(new OnScrollStopListner()
        {
            public void onScrollToRightEdge()
            {
            	img_news_back.setVisibility(View.VISIBLE);
            	img_news_back_pre.setVisibility(View.GONE);
            	img_news_enter.setVisibility(View.GONE);
            	img_news_enter_pre.setVisibility(View.VISIBLE);
            }
            public void onScrollToMiddle()
            {
            	img_news_back.setVisibility(View.VISIBLE);
    			img_news_back_pre.setVisibility(View.GONE);
    			img_news_enter.setVisibility(View.VISIBLE);
    			img_news_enter_pre.setVisibility(View.GONE);
            }
            public void onScrollToLeftEdge()
            {
            	img_news_back.setVisibility(View.GONE);
    			img_news_back_pre.setVisibility(View.VISIBLE);
    			img_news_enter.setVisibility(View.VISIBLE);
    			img_news_enter_pre.setVisibility(View.GONE);
            }
            public void onScrollStoped()
            {
            }
        });
		
		rl_news_back.setOnClickListener(new OnClickListener()
		{
			
			@Override
			public void onClick(View v)
			{
				horizontalScrollView.smoothScrollBy(-( getWindowManager().getDefaultDisplay().getWidth()-rl_news_back.getWidth()*2),0);
				horizontalScrollView.startScrollerTask();
			}
		});
		
		rl_news_enter.setOnClickListener(new OnClickListener()
		{
			
			@Override
			public void onClick(View v)
			{
				horizontalScrollView.startScrollerTask();
				horizontalScrollView.smoothScrollBy(getWindowManager().getDefaultDisplay().getWidth()-rl_news_back.getWidth()*2,0);
			}
		});
	}
 

 

     大神勿喷~欢迎大家指导改正
 


 

后期优化文章请阅：https://blog.csdn.net/lxlyhm/article/details/53676673
 

 

 

 

 


 



                

        

        

    




    

      

        

            

              
                
                  LXLYHM
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    1
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    1
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                  3
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
自定义布局: HorizontalScrollView——支持横向滑动

				
			

			

				

					Yang_RT的博客
				

				

					09-29
					
					1228
					
				

			

		

		

			
				
这是一个支持横向滑动，并处理了滑动冲突的自定义ViewGroup。几乎涵盖了自定义viewGroup的所有知识，对于理解View的相关知识有一定的帮助，是一个不错的实战Demo。以下为功能，所做的处理及对应的知识点。



1.支持横向滑动

 为了使布局能够横向滑动，需要重写onTouchEvent()方法，在这个方法中判断是否为横向滑动，如果是的话就使用scrollBy()方法让布局内容滑...

			
		

	



                

              
                



	

		

			

				
					
Android使用HorizontalScrollView实现水平滚动

				
			

			

				

					01-20
				

			

		

		

			
				
2. **滚动方向**：HorizontalScrollView支持水平方向的滚动，适合展示宽度较长的内容，比如一系列横向排列的图片或按钮。ScrollView则支持垂直方向的滚动，适用于高度较高的内容。  3. **事件处理**：在使用...

			
		

	



                


  
              

                


	

		

			

				
					
listview 、onKeyDown()使用

				
			

			

				

					JingDalu
				

				

					04-03
					
					704
					
				

			

		

		

			
				
listview的getChildAt方法  
只是当前一屏内的
参数从0到ListView.getLastVisiblePosition()-ListView.getFirstVisiblePosition()
 水平分割线  在ListView控件当中使用到

//这样前面就加上透明度了argb  a（alpha）表示透明度   00 表示完全透明，ff 表示完全不透明。




			
		

	





	

		

			

				
					
借助HorizontalScrollView实现多列ListView的横向滑动(含动态加载)

				
			

			

				

					10-29
				

			

		

		

			
				
博客http://blog.csdn.net/btyh17mxy/article/details/8125860对应的源码下载

			
		

	



		

			
		



	

		

			

				
					
Android ViewPager与仿Gallery的HorizontalScrollView互相滑动监听

				
			

			

				

					06-06
				

			

		

		

			
				
Android ViewPager与仿Gallery的HorizontalScrollView互相滑动监听

			
		

	





	

		

			

				
					
ScrollView的滑动监听(以HorizontalScrollView为例)

				
			

			

				

					奋斗的日子最甜美，在科技的海洋里，永无止境。
				

				

					04-28
					
					3127
					
				

			

		

		

			
				
ScrollView不能像其他组件一样使用onScrollChanged()方法是因为它用protected封装了[java] view plain copyprotected void onScrollChanged(int x, int y, int oldx, int oldy);  想要实现监听需要简单自定义组件.1:自定义组件[java] view plain copypublic cl...

			
		

	





	

		

			

				
					
Android中ListView结合HorizontalScrollView实现水平和竖直方向上的滚动效果

				
			

			

				

					tianyaluqingchen的博客
				

				

					07-19
					
					2202
					
				

			

		

		

			
				
    一言不合先上图：



    本文实现上图效果采用了两种方案：

    方案一：采用头布局+左右两个ListView实现，头布局的右半部分以及右边的ListView完全包含在自定义HorizontalScrollView中。

    首先自定义一个CusHorizontalScrollView，在其中声明另一个HorizontalScrollView mView，添加set方法，复写...

			
		

	





	

		

			

				
					
HorizontalScrollView嵌套GridView实现水平滚动

				
			

			

				

					09-24
				

			

		

		

			
				
总之，HorizontalScrollView嵌套GridView是一种常见的Android界面设计方式，它结合了水平滚动和二维数据显示的优点。通过合理设置布局参数、处理点击事件和焦点转换，可以创建出丰富且交互性强的用户界面。在实际...

			
		

	





	

		

			

				
					
HorizontalScrollView嵌套在ListView被回收

				
			

			

				

					05-11
				

			

		

		

			
				
这种功能通常通过`SwipeRefreshLayout`或者自定义手势识别来实现。这里，我们可以自定义一个`TouchListener`，监听手指滑动的方向。当检测到从右向左的滑动时，展示一个删除按钮，用户点击后执行删除操作。以下是一...

			
		

	





	

		

			

				
					
horizontalscrollview里面item点击的实现

				
			

			

				

					01-13
				

			

		

		

			
				
horizontalscrollview之前在网上没有找到这方面的资源，由于项目需要，自己研究了一下，现在分享给需要的朋友

			
		

	





	

		

			

				
					
Listview中完美嵌套HorizontalListView

				
			

			

				

					10-06
				

			

		

		

			
				
HorizontalListView的应用：Listview中完美嵌套HorizontalListView  详细见博客：http://blog.csdn.net/whitley_gong/article/details/48936689

			
		

	





	

		

			

				
					
Android ScrollView嵌套横向滑动控件时冲突问题

				
			

			

				

					01-04
				

			

		

		

			
				
前言：今天在开发的时候遇到这样的问题，最外层是ScrollView,里面嵌套了一个横向滑动的日历控件，在滑动日历的时候很卡顿。看到这种问题，自然而然的就会想到scrollview和其他可滑动控件的冲突问题。
解决思路
用户的左右滑动操作被最外层的scrollView控件处理掉了，所以只要让scrollview对左右滑动事件不监听，让其子控件处理左右滑动事件 。重写scrollview的onInterceptTouchEvent方法，当上下滑动时不处理即可。
代码如下


public void setOnScollChangedListener(OnScollChangedListener o

			
		

	





	

		

			

				
					
Android，自定义HorizontalScrollView，实现过度滑动时回弹效果

				
			

			

				

					12-08
				

			

		

		

			
				
Android，自定义HorizontalScrollView，实现过度滑动时回弹效果。横向的ScrollView，过度滑动时，手指抬起即出现回弹效果，这是一种边界反馈。

			
		

	





	

		

			

				
					
horizontalScrollView嵌套可横向滑动的布局

				
			

			

				

					11-20
				

			

		

		

			
				
横向滑动的HorizontalScrollView嵌套GridView,实现单行横向滑动的Demo

			
		

	





	

		

			

				
					
listview 中嵌套 HorizontalScrollView 出现的问题

				
			

			

				

					dawn的专栏
				

				

					03-18
					
					985
					
				

			

		

		

			
				
主要是滑动HorizontalScrollView时，当滑动第一个，下面的也跟着滑动。解决此问题的办法是。
在getview中添加


if (itemHolder.hsv.getScrollX() != 0) {
           itemHolder.hsv.scrollTo(0, 0);
       }



将所有的HorizontalScrollView还原到起

			
		

	





	

		

			

				
					
滚动以后内容自动居中的HorizontalScrollView

					
最新发布

				
			

			

				

					SOLO的博客
				

				

					04-20
					
					399
					
				

			

		

		

			
				
和正常的HorizontalScrollView一样使用。

			
		

	





	

		

			

				
					
HorizontalScrollView嵌套在ListView，实现从右向左滑动单个删除，当滑动出来后，解决HorizontalScrollView被ListView回收+多个删除

				
			

			

				

					u012123938的专栏
				

				

					05-11
					
					2039
					
				

			

		

		

			
				
此程序运行在720x1280的屏幕上


本身是想写一个：HorizontalScrollView和ScrollView冲突的文章，后来写着写着就变成了HorizontalScrollView嵌套在ListView被回收问题了。


解决这个问题的思路：
生成一个装int类型的position数组，这个数组用来记录哪个item是被滑动了（也就是删除漏出来的），也就是说如果删除是漏出来

			
		

	





	

		

			

				
					
android fragment ，listview 嵌套横向HorizontalScrollView 实现HorizontalScrollView 到最左或者最右切换fragment

				
			

			

				

					xizhilang201的专栏
				

				

					03-01
					
					470
					
				

			

		

		

			
				
啥也不说了额，直接上代码，老铁门自己看！




import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.GestureDetector;
import android.view.MotionEvent;
import and

			
		

	





	

		

			

				
					

				
			

			

				

					
				

			

		

		

			
				

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		
评论 3

	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值