HorizontalScrollView+viewpager实现仿天天动听ios版和QQ侧边菜单效果

最新推荐文章于 2022-10-02 09:33:24 发布
最新推荐文章于 2022-10-02 09:33:24 发布
阅读量1.1k 收藏
点赞数 1
分类专栏： Android 文章标签： HorizontalScrollView viewpage android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hongdameng/article/details/42524781
版权

最近用HorizontalScrollView弄了个和slidingmenu差不多的效果的侧边菜单，顺便在里面嵌套viewpager，效果类似天天动听ios版和仿QQ侧边菜单栏，界面略戳，看图



1.    结构
最外层是一个HorizontalScrollView ，重写了它里面的一些方法从而实现划出和收起菜单的效果
里面是viewpager，能左右滑动和点击上面的文字切换。2.主要代码


</pre><pre name="code" class="html">主页布局xml和代码
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <com.have.ingeniousmusicplayer.business.workmain.view.SlidingMenu
        android:id="@+id/sm_workmain_slidingmenu"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:background="@drawable/workmain_background" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:orientation="horizontal" >

            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:background="@color/white"
                android:orientation="vertical" >

                <include layout="@layout/item_workmain_head" />

                <com.have.ingeniousmusicplayer.business.workmain.view.ViewPager
                    android:id="@+id/vp_workmain_container"
                    android:layout_width="fill_parent"
                    android:layout_height="0dp"
                    android:layout_weight="1" >
                </com.have.ingeniousmusicplayer.business.workmain.view.ViewPager>
            </LinearLayout>
            
            <include layout="@layout/layout_workmain_menu" />

        </LinearLayout>
    </com.have.ingeniousmusicplayer.business.workmain.view.SlidingMenu>

</LinearLayout>


 

<strong>
</strong>
 

package com.have.ingeniousmusicplayer.business.workmain;

import java.util.ArrayList;
import java.util.List;

import android.content.Intent;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.DisplayMetrics;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.have.baselib.client.common.base.BaseFragmentActivity;
import com.have.ingeniousmusicplayer.MyApplication;
import com.have.ingeniousmusicplayer.R;
import com.have.ingeniousmusicplayer.business.workmain.frag.EqualizerFrag;
import com.have.ingeniousmusicplayer.business.workmain.frag.MyMusicFrag;
import com.have.ingeniousmusicplayer.business.workmain.frag.SearchFrag;
import com.have.ingeniousmusicplayer.business.workmain.frag.TransportFrag;
import com.have.ingeniousmusicplayer.business.workmain.view.SlidingMenu;
import com.have.ingeniousmusicplayer.service.QuickMenuFlowService;

/**   
 * 主页
 *
 * @author hongdameng
 * @version： [版本号， 2014-12-31] 
 * 
 */
public class WorkMainActivity extends BaseFragmentActivity implements OnClickListener {
	
	private ViewPager vp_workmain_container;
	
	private FragmentPagerAdapter fragmentPagerAdapter;
	
	private List<Fragment> fragments = new ArrayList<Fragment>();
	
	private MyMusicFrag myMusicFrag;
	
	private EqualizerFrag equalizerFrag;
	
	private SearchFrag searchFrag ;
	
	private TransportFrag transportFrag;
	
	private SlidingMenu slidingMenu;
	
	/**四个tab的容器 */
	private LinearLayout llTabContainer;
	
	private TextView tvMymusic;
	
	private TextView tvEq;
	
	private TextView tvSearch;
	
	private TextView tvTransport;
	
	private LinearLayout llMyMusic;
	
	private LinearLayout llEq;
	
	private LinearLayout llSearch;
	
	private LinearLayout llTransport;
	
	private ImageView ivMenu;
	
	private int currentIndex;

	private boolean isClickTab;

	private int tabContainerWidth;

	private View ivTabLine;
	
	private float screenWidth;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_workmain);
		initView();
		initTabLine();
		initData();
		
		initService();
	}


	private void initView() {
		llTabContainer = (LinearLayout) findViewById(R.id.ll_workmain_tab_container);
		vp_workmain_container = (ViewPager) findViewById(R.id.vp_workmain_container);
		tvMymusic = (TextView) findViewById(R.id.tv_workmain_head_tab_mymusic);
		tvEq = (TextView) findViewById(R.id.tv_workmain_head_tab_eq);
		tvSearch = (TextView) findViewById(R.id.tv_workmain_head_tab_search);
		tvTransport = (TextView) findViewById(R.id.tv_workmain_head_tab_transport);
		
		llMyMusic = (LinearLayout) findViewById(R.id.ll_workmain_head_tab_mymusic);
		llEq = (LinearLayout) findViewById(R.id.ll_workmain_head_tab_eq);
		llSearch = (LinearLayout) findViewById(R.id.ll_workmain_head_tab_search);
		llTransport = (LinearLayout) findViewById(R.id.ll_workmain_head_tab_transport);
		
		ivMenu = (ImageView) findViewById(R.id.iv_workmain_menu);
		ivMenu.setOnClickListener(this);
		llMyMusic.setOnClickListener(this);
		llEq.setOnClickListener(this);
		llSearch.setOnClickListener(this);
		llTransport.setOnClickListener(this);
		
		slidingMenu = (SlidingMenu) findViewById(R.id.sm_workmain_slidingmenu);
	}
	
	private void initData() {
		myMusicFrag = new MyMusicFrag();
		equalizerFrag = new EqualizerFrag();
		searchFrag = new SearchFrag();
		transportFrag = new TransportFrag();
		
		fragments.add(myMusicFrag);
		fragments.add(equalizerFrag);
		fragments.add(searchFrag);
		fragments.add(transportFrag);
		
		fragmentPagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
			
			@Override
			public int getCount() {
				return fragments.size();
			}
			
			@Override
			public Fragment getItem(int arg0) {
				return fragments.get(arg0);
			}
		};
		
		vp_workmain_container.setAdapter(fragmentPagerAdapter);
		
		vp_workmain_container.setOnPageChangeListener(new MyOnPageChangeListener());
	}
	

	private void initService() {
//		Intent intent = new Intent(getApplicationContext(), QuickMenuFlowService.class);
//		startService(intent);
		
	}
	
	private class MyOnPageChangeListener implements OnPageChangeListener{


		@Override
		public void onPageSelected(int position) {
			resetTextColor();
			switch (position) {
			case 0:
				tvMymusic.setTextColor(getResources().getColor(
						R.color.blue_price));
				MyApplication.workmainCurrentPage = 0;
				MyApplication.isCanControlMenu = false;
				
				break;
			case 1:
				tvEq.setTextColor(getResources().getColor(
						R.color.blue_price));
				MyApplication.workmainCurrentPage = 1;
				MyApplication.isCanControlMenu = false;
				
				break;
			case 2:
				tvSearch.setTextColor(getResources().getColor(
						R.color.blue_price));
				MyApplication.workmainCurrentPage = 2;
				MyApplication.isCanControlMenu = false;
				
				break;
			case 3:
				tvTransport.setTextColor(getResources().getColor(
						R.color.blue_price));
				MyApplication.workmainCurrentPage = 3;
				
				break;
			}

			currentIndex = position;
		}

		@Override
		public void onPageScrolled(int position, float positionOffset,
				int positionOffsetPixels) {
			if (isClickTab) {
				isClickTab = false;
				return;
			}
			
			float trueOffset = positionOffset * (tabContainerWidth/screenWidth);
			
			LinearLayout.LayoutParams layoutParams = (android.widget.LinearLayout.LayoutParams) ivTabLine
					.getLayoutParams();
			if (currentIndex == 0 && position == 0) {
				layoutParams.leftMargin = (int) (trueOffset * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);

			} else if (currentIndex == 1 && position == 0) {  // 从位置1平移到位置0
				layoutParams.leftMargin = (int) (-(1 - trueOffset) * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 1 && position == 1){
				layoutParams.leftMargin = (int) (trueOffset * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 2 && position == 1){
				layoutParams.leftMargin = (int) (-(1 - trueOffset) * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 2 && position == 2){
				layoutParams.leftMargin = (int) (trueOffset * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 2 && position == 3){
				layoutParams.leftMargin = (int) (trueOffset * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 3 && position == 2){
				layoutParams.leftMargin = (int)(-(1 - trueOffset) * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			} else if(currentIndex == 3 && position == 3){
				layoutParams.leftMargin = (int) (trueOffset * (tabContainerWidth * 1.0 / 4) + currentIndex * (tabContainerWidth / 4)) + tabContainerWidth / 16;
				ivTabLine.setLayoutParams(layoutParams);
			}
				
		}

		@Override
		public void onPageScrollStateChanged(int state) {
		}
	
	}
	
	
	
	private void initTabLine() {
		int w = View.MeasureSpec.makeMeasureSpec(0,View.MeasureSpec.UNSPECIFIED); 
		int h = View.MeasureSpec.makeMeasureSpec(0,View.MeasureSpec.UNSPECIFIED); 
		ivMenu.measure(w, h); 
		int menuWidth =ivMenu.getMeasuredWidth();
		
		ivTabLine = (ImageView) findViewById(R.id.iv_workmain_tabline);
		DisplayMetrics outMetrics = new DisplayMetrics();
		getWindow().getWindowManager().getDefaultDisplay()
				.getMetrics(outMetrics);
		screenWidth = outMetrics.widthPixels;
		tabContainerWidth = (int) (screenWidth  - menuWidth);
		LinearLayout.LayoutParams lp = (android.widget.LinearLayout.LayoutParams) ivTabLine
				.getLayoutParams();
		lp.width = tabContainerWidth / 8;
		ivTabLine.setLayoutParams(lp);
	}
	
	/**
	 * 重置颜色
	 */
	protected void resetTextColor() {
		tvMymusic.setTextColor(getResources().getColor(R.color.gray_cccccc));
		tvEq.setTextColor(getResources().getColor(R.color.gray_cccccc));
		tvSearch.setTextColor(getResources().getColor(R.color.gray_cccccc));
		tvTransport.setTextColor(getResources().getColor(R.color.gray_cccccc));
	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.iv_workmain_menu:
			slidingMenu.toggle();
			break;
		case R.id.ll_workmain_head_tab_mymusic:
			vp_workmain_container.setCurrentItem(0);
			break;
		case R.id.ll_workmain_head_tab_eq:
			vp_workmain_container.setCurrentItem(1);
			break;
		case R.id.ll_workmain_head_tab_search:
			vp_workmain_container.setCurrentItem(2);
			break;
		case R.id.ll_workmain_head_tab_transport:
			vp_workmain_container.setCurrentItem(3);
			break;
		default:
			break;
		}
	}
	
	@Override
	protected void onDestroy() {
		MyApplication.isCanControlMenu = false;
		super.onDestroy();
	}
}

 

 

 

 


 
 

 

重写HorizontalScrollView代码
 

package com.have.ingeniousmusicplayer.business.workmain.view;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;

import com.have.ingeniousmusicplayer.MyApplication;
import com.have.ingeniousmusicplayer.common.utils.ScreenUtils;
import com.nineoldandroids.view.ViewHelper;

/**
 * <菜单侧边栏>
 * 
 * @author hongdameng
 * @version： [版本号， 2015-1-4]
 * 
 */
public class SlidingMenu extends HorizontalScrollView {

	/**
	 * 屏幕宽度
	 */
	private int mScreenWidth;
	/**
	 * dp
	 */
	private int mMenuRightPadding;
	/**
	 * 菜单的宽度
	 */
	private int mMenuWidth;
	private int mHalfMenuWidth;

	private boolean isOpen;
	
	private boolean once;

	private ViewGroup mMenu;
	private ViewGroup mContent;
	
	public SlidingMenu(Context context, AttributeSet attrs) {
		this(context, attrs, 0);

	}

	public SlidingMenu(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		mScreenWidth = ScreenUtils.getScreenWidth(context);

		mMenuRightPadding = mScreenWidth / 3;
	}

	public SlidingMenu(Context context) {
		this(context, null, 0);
	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		/**
		 * 显示的设置一个宽度
		 */
		if (!once) {
			LinearLayout wrapper = (LinearLayout) getChildAt(0);
			mContent = (ViewGroup) wrapper.getChildAt(0);
			mMenu = (ViewGroup) wrapper.getChildAt(1);

			mMenuWidth = mScreenWidth - mMenuRightPadding;
			mHalfMenuWidth = mMenuWidth / 2;
			mMenu.getLayoutParams().width = mMenuWidth;
			mContent.getLayoutParams().width = mScreenWidth;

		}
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);

	}

	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		super.onLayout(changed, l, t, r, b);
		if (changed) {
			// 将菜单隐藏
			this.scrollTo(0, 0);
			once = true;
		}
	}

	@Override
	public boolean onTouchEvent(MotionEvent ev) {
		int action = ev.getAction();
		switch (action) {
		case MotionEvent.ACTION_UP:
			int scrollX = getScrollX();
			if (scrollX > mHalfMenuWidth) {
				this.smoothScrollTo(mMenuWidth, 0);
				isOpen = true;
			} else {
				this.smoothScrollTo(0, 0);
				 MyApplication.isOpenByClick = false;
				isOpen = false;
			}
			return true;
		}
		return super.onTouchEvent(ev);
	}

	/**
	 * 打开菜单
	 */
	public void openMenu() {
		MyApplication.isOpenByClick = true;
		if (isOpen)
			return;
		this.smoothScrollTo(mMenuWidth, 0);
		isOpen = true;
	}

	/**
	 * 关闭菜单
	 */
	public void closeMenu() {
		if (isOpen) {
			this.smoothScrollTo(0, 0);
			MyApplication.isOpenByClick = false;
			isOpen = false;
		}
	}

	/**
	 * 切换菜单状态
	 */
	public void toggle() {
		if (isOpen) {
			closeMenu();
		} else {
			openMenu();
		}
	}

	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		super.onScrollChanged(l, t, oldl, oldt);
		float scale = l * 1.0f / mMenuWidth;
		float leftScale = 1 - 0.3f * scale;
		float rightScale = 0.8f + scale * 0.2f;

		ViewHelper.setScaleX(mContent, leftScale);
		ViewHelper.setScaleY(mContent, leftScale);
		ViewHelper.setTranslationX(mContent, -mContent.getWidth() * scale * 0.01f);

		ViewHelper.setAlpha(mMenu, 0.6f + 0.4f * scale);
		ViewHelper.setPivotX(mMenu, 0);
		ViewHelper.setPivotY(mMenu, mMenu.getHeight() / 2);
		ViewHelper.setScaleX(mMenu, rightScale);
		ViewHelper.setScaleY(mMenu, rightScale);

	}
	
	@Override
	public boolean onInterceptTouchEvent(MotionEvent ev) {
		int action = ev.getAction();
		switch (action) {
		case MotionEvent.ACTION_DOWN:
			MyApplication.downXPosition = ev.getX();
			
		case MotionEvent.ACTION_MOVE:
			if(MyApplication.workmainCurrentPage == 3 && ev.getX() > MyApplication.downXPosition && ! isOpen){
				MyApplication.isCanControlMenu = false;
			}
		}
		
		return super.onInterceptTouchEvent(ev) && (MyApplication.isCanControlMenu || MyApplication.isOpenByClick);
	}
	
}

 

 

 


 
 

 

重写 viewpager 代码
 

/*  
 * 文件名：     ViewPager.java 
 * 文件描述： ()
 * 修改人：     [hongdameng] 
 * 生成时间：  2015-1-5 下午1:56:59 
 * 修改记录：
 */
package com.have.ingeniousmusicplayer.business.workmain.view;

import com.have.ingeniousmusicplayer.MyApplication;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;

/**
 * <首页viewpager>
 * 
 * @author hongdameng
 * @version： [版本号， 2015-1-5]
 * 
 */
public class ViewPager extends android.support.v4.view.ViewPager {

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

	@Override
	public boolean onTouchEvent(MotionEvent ev) {
		switch (ev.getAction()) {
		case MotionEvent.ACTION_DOWN:
			MyApplication.downXPosition = ev.getX();
			return super.onTouchEvent(ev);
		case MotionEvent.ACTION_MOVE:
			if (this.getCurrentItem() == 3 && MyApplication.downXPosition > ev.getX()) {
				MyApplication.isCanControlMenu = true;
				return super.onTouchEvent(ev);
			} else {
				return super.onTouchEvent(ev);
			}

		default:
			return super.onTouchEvent(ev);
		}
	}

}

 

</pre><pre name="code" class="html">
 

为了在页面切换过程中判断是否要打开菜单，我在application保存了一些状态
 

 

public class MyApplication extends BaseApplication {
	public static int workmainCurrentPage = 0;
	
	public static boolean isCanControlMenu = false;
	
	public static float downXPosition = 0;
	
	public static boolean isOpenByClick = false;
	
	@Override
	public void onCreate() {
		super.onCreate();
		
		initService();
	}

	/** 
	 * 初始化服务
	 */
	private void initService() {
		//TODO
		workmainCurrentPage = 0; //可以通过读取 SharedPreferences 设置当前页
	}
}
 

 

 

1. 原理
 

重写HorizontalScrollView ，实现划出和收起菜单和QQ类似的效果，在用户滑动再抬起手的时候判断露出菜单的偏移量来打开或者关闭菜单，在viewpager滑动过程中，如果是滑到最后一页，再向左滑动机打开菜单，里面的状态都是通过application保存着。
 

 


 

                

        

        

    




    

      

        

            

              
                
                  HongdaMeng
                
              
            

            

                关注
              
            

        

        

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

      

      

            

                专栏目录
          










                



	

		

			

				
					
HorizontalScrollView 实现图片横向滚动

				
			

			

				

					u011996917的博客
				

				

					06-22
					
					1527
					
				

			

		

		

			
				
功能是这样的，一个HorizontalScrollView，里面装了一个自定义的图表DrawChartsView，图表可以左右滑动查看内容
XML文件&lt;!--设置图表可以横向滑动--&gt;
&lt;HorizontalScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_con...

			
		

	



                

              
                



	

		

			

				
					
一款健壮性良好，高度可扩展的iOS水平轮播组件 LBHorizontalLoopView，使用三个视图完成轮播逻辑，内部使用了重用，支持同时展示不同样式轮播内容，支持快速拖动,支持pod导入

				
			

			

				

					liubo的博客
				

				

					08-31
					
					315
					
				

			

		

		

			
				
首先看效果图

一
本框架使用三个视图实现轮播效果原理
底部有一个s c rolllview , scrollview的内容宽度为3 * 视图宽度
首次展示第一个展示在中间，左边展示最后一个，右边展示第二个
，当向右拖动一次之后，迅速将scrollView的偏移量
恢复到中间，并且当前索引增加一，并根据当前索引刷新三个子视图
，这样就达到了轮播的效果，并且该框架支持多种内容视图同时展示，
扩展性更好
二 核心代码
///这里是结束滚动之后需要将改变当前索引，并恢复偏移量，并刷新数据
- (void)scro

			
		

	



                


  
              

                


	

		

			

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

				
			

			

				

					G11176593的博客
				

				

					10-02
					
					886
					
				

			

		

		

			
				
今日空闲花了点时间对以前自主实现的项目功能进行改进和优化， 其实一些界面的小功能有时候没实现过，也没经验类似项目功能经验，反而耗费的时间会更多。下面我所描述的界面功能就是我在对用RecyclerView控件不熟悉的情况下使用了HorizontalScrollView来实现的，在我把它优化成RecyclerView控件之前在此做个笔录，方便以后查阅。       按照以往的惯例，先上效果图（既可以手势监听，也可以按钮监听）1.HorizontalScrollView滑动到最左边的时候，左边箭头光标变灰色2.H

			
		

	





	

		

			

				
					
导航栏联动效果（ HorizontalScrollView+ViewPager）

				
			

			

				

					01-05
				

			

		

		

			
				
以HorizontalScrollView与Viewpager实现分页滑动，类似淘宝分页滑动效果，其中头部局可以自定义

			
		

	



		

			
		



	

		

			

				
					
HorizontalScrollView与ViewPager组合实现联动仿新浪微博热门微博页面

				
			

			

				

					05-20
				

			

		

		

			
				
HorizontalScrollView通常用于展示可以水平滑动的内容，而ViewPager则常用于实现页面间的滑动切换，两者结合能实现更复杂的布局和交互效果。  **HorizontalScrollView** 是Android SDK提供的一种视图容器，它可以...

			
		

	





	

		

			

				
					
Android利用HorizontalScrollView仿ViewPager设计简单相册

				
			

			

				

					01-20
				

			

		

		

			
				
在Android开发中，HorizontalScrollView和ViewPager都是用于展示可滑动视图的组件，但它们各自有不同的特性和使用场景。在本案例中，我们探讨的是如何利用HorizontalScrollView来模仿ViewPager的功能，尤其是在实现...

			
		

	





	

		

			

				
					
HorizontalScrollView和ViewPager联动效果

				
			

			

				

					04-12
				

			

		

		

			
				
HorizontalScrollView允许用户水平滚动一个包含多个View的布局，而ViewPager则通常用于实现滑动页面的效果，如在应用的TabLayout下展示多个Fragment。这两者联动可以创建出更加丰富的用户交互体验。  在Android开发...

			
		

	





	

		

			

				
					
Android重写HorizontalScrollView仿ViewPager效果

				
			

			

				

					weixin_33913332的博客
				

				

					11-11
					
					280
					
				

			

		

		

			
				
Android提供的ViewPager类太复杂，有时候没有必要使用，所以重写一个HorizontalScrollView来实现类似的效果，也可以当做Gallery来用
思路很简单，就是重写onTouchEvent事件，在手指抬起或者取消的时候，进行smoothScroll的操作，具体请看代码：
布局文件：activity_test.xml

 1 &lt;?xml version="1.0...

			
		

	





	

		

			

				
					
HorizontalScrollView 与 viewpager冲突的解决

				
			

			

				

					11-25
				

			

		

		

			
				
HorizontalScrollView中嵌套viewpager的冲突的解决方法

			
		

	





	

		

			

				
					
Android 自定义 HorizontalScrollView 实现ViewPager效果，打造再多图片（控件）也不怕 OOM

				
			

			

				

					z240336124的专栏
				

				

					03-13
					
					1万+
					
				

			

		

		

			
				
1. 效果上次实现了这个IOS Reveal效果，能够确保中间部分是彩色其余部分是灰色，但是也遗留了两个问题： 
　　(1)如果把它做成ViewPager效果的方式可能会更好； 
　　(2)HorizontalScrollView没有重用机制，虽然可能我们并不会加载很多的图片，但是一旦过多肯定会出现OOM问题；

			
		

	





	

		

			

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

				
			

			

				

					u013835855的专栏
				

				

					05-04
					
					2580
					
				

			

		

		

			
				
目前滑动指示器最著名的是JakeWarton的ViewpagerIndicator，用别人的东西固然方便，但是也带来很多使用上的疑惑，这篇博客，我们使用HorizontalScrollView自己写一个viewPager指示器。
这里首先说一下很多自己写的indicator只限于可视范围内不能移动的指示器，所以tab的数量有限，一般最多五个就已经很拥挤了，可是我们发现开源的ViewpagerIn

			
		

	





	

		

			

				
					
HorizontalScrollView+Viewpager

				
			

			

				

					cn_JackChen的博客
				

				

					06-11
					
					393
					
				

			

		

		

			
				
依赖-->compile 
'org.xutils:xutils:3.5.0'


AndroidManifest里配置-->
uses-permission android:name="android.permission.INTERNET">uses-permission>


--------------------------------------------------

			
		

	





	

		

			

				
					
HorizontalScrollView+ViewPager导航栏

				
			

			

				

					yin_chenglong的博客
				

				

					01-12
					
					263
					
				

			

		

		

			
				
//主页面
package fragment;


import android.graphics.Color;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.su

			
		

	





	

		

			

				
					
仿ViewPager相册（使用HorizontalScrollView）

				
			

			

				

					SunShanai的博客
				

				

					05-21
					
					6000
					
				

			

		

		

			
				
近期看了一堂某在线IT学习的视频公开课，这里就不说名字了，省的有打广告的嫌疑。讲到了利用HorizontalScrollView仿ViewPager设计的一个简单相册。其实主要用了ViewPager缓存的思想。此篇博客参考http://blog.csdn.net/lmj623565791/article/details/38140505（这篇博客与公开课的讲的大致一样）
       这里简单说

			
		

	





	

		

			

				
					
iOS学习笔记——滚动视图（scrollView）

					
热门推荐

				
			

			

				

					hengshujiyi的专栏
				

				

					03-20
					
					6万+
					
				

			

		

		

			
				
原始地址：http://blog.csdn.net/u012889435/article/details/17523705






滚动视图：在根视图中添加UIScrollViewDelegate协议，声明一些对象属性





[objc] view
 plaincopy






@interface BoViewController : UIV

			
		

	





	

		

			

				
					
HorizontalScrollView作为导航栏和HorizontalScrollView的滑动

				
			

			

				

					Bruce的博客
				

				

					07-18
					
					3732
					
				

			

		

		

			
				
HorizantalScrollView和ScrollView差不多，不过就是滑动的方向是水平方向上的，可以做APP的分类导航栏，就比如下图：  
但是呢，导航栏不只是“推荐”、“体育”、“文艺”、“娱乐”这五个分类，在“娱乐”的右边还有3噶分类，只是没显示出来出来而已。下面分类的具体内容用的是ViewPager，翻页的时候分类名称下那条红色的线条也会跟着移动到相应的分类名称下，就像是这样（这是翻页

			
		

	





	

		

			

				
					
android HorizontalScrollView与viewpager联动，如何实现HorizontalScrollView自动滚动展示被遮盖的tab

					
最新发布

				
			

			

				

					03-31
				

			

		

		

			
				
实现HorizontalScrollView自动滚动展示被遮盖的tab可以通过以下步骤：  1. 获取HorizontalScrollView中的子view的宽度总和  2. 获取HorizontalScrollView的宽度  3. 计算出需要自动滚动的距离，即子view总宽度减去...

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

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

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值