viewpager+fragment附带导航条跟随手指晃动改变位置

最新推荐文章于 2022-11-14 15:43:00 发布
最新推荐文章于 2022-11-14 15:43:00 发布
阅读量1.3k 收藏 1
点赞数
分类专栏： Android
本文为博主原创文章，未经博主允许不得转载，如需强制转载，请注明出处且需对文章进行评论声明转载。
本文链接：https://blog.csdn.net/u014449096/article/details/41746307
版权
如果不能看

请看这个

效果图

直接上代码

package com.qiao.viewpageranimation;

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

import com.qiao.Fragment.FragmentOne;
import com.qiao.Fragment.FragmentThr;
import com.qiao.Fragment.FragmentTwo;


import android.graphics.BitmapFactory;
import android.graphics.Color;
import android.graphics.Matrix;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
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.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
/**
 * viewpager+fragment侧滑+导航条动画
 * @author 有点凉了
 * QQ群：123869487
 * 求基友共同进步，求大神入群指点
 * -----------------------------
 * 被注释掉的方法是页面滑动后的移动效果
 */
public class MainActivity extends FragmentActivity {
	private static final String TAG="MainActivity";
	private ImageView cusor;
	private int bmpW;// 动画图片宽度
	private int offset = 0;// 动画图片偏移量
	private List<Fragment> list = null;//
	
	private TextView textView_one,textView_two,textView_thr;
	
	
	private ViewPager mPager;
	private int currIndex = 0;// 当前页卡编号
	
    /**
     * ViewPager的当前选中页
     */
    private int currentIndex;
    /**
     * 屏幕的宽度
     */
    private int screenWidth;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		findById();
		init();
		initTabLineWidth();
		
//		普通的动画移动
//		InitImageView();
//		InitTextView();
//		InitViewPager();
	}

	   /**
     * 重置颜色
     */
    private void resetTextView() {
    	textView_one.setTextColor(Color.BLACK);
    	textView_two.setTextColor(Color.BLACK);
    	textView_thr.setTextColor(Color.BLACK);
    }
	private void initTabLineWidth() {
		   DisplayMetrics dpMetrics = new DisplayMetrics();
	        getWindow().getWindowManager().getDefaultDisplay()
	                .getMetrics(dpMetrics);
	        screenWidth = dpMetrics.widthPixels;
	        LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) cusor
	                .getLayoutParams();
	        lp.width = screenWidth / 3;
//	        Log.i(TAG, "==lp.width:="+lp.width);
	        cusor.setLayoutParams(lp);
	        
	}

	private void init() {
		list = new ArrayList<Fragment>();
		FragmentOne fragmentOne = new FragmentOne();
		list.add(fragmentOne);
		FragmentTwo fragmentTwo = new FragmentTwo();
		list.add(fragmentTwo);
		FragmentThr fragmentThr = new FragmentThr();
		list.add(fragmentThr);
		mPager.setAdapter(new MyAdapter(getSupportFragmentManager(),list));
		mPager.setCurrentItem(0);
		mPager.setOnPageChangeListener(new OnPageChangeListener() {
			
			@Override
			public void onPageSelected(int position) {
				// TODO Auto-generated method stub
				resetTextView();
				switch (position) {
				case 0:
					textView_one.setTextColor(Color.BLUE);
					break;
				case 1:
					textView_two.setTextColor(Color.BLUE);
					break;
				case 2:
					textView_thr.setTextColor(Color.BLUE);
					break;

				default:
					break;
				}
				currentIndex = position;
			}
			
			 /**
             * position :当前页面，及你点击滑动的页面 offset:当前页面偏移的百分比
             * offsetPixels:当前页面偏移的像素位置
             */
			@Override
			public void onPageScrolled(int position, float offset, int offsetPixels) {
				// TODO Auto-generated method stub
				 LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) cusor
	                        .getLayoutParams();
	 
//				 Log.i(TAG, "==offset:="+offset);
	                /**
	                 * 利用currentIndex(当前所在页面)和position(下一个页面)以及offset来
	                 * 设置mTabLineIv的左边距 滑动场景：
	                 * 记3个页面,
	                 * 从左到右分别为0,1,2 
	                 * 0->1; 1->2; 2->1; 1->0
	                 */
	 
				 
				 Log.i(TAG, "==-->currentIndex:="+currentIndex+"  position:="+position );
				if (currentIndex == 0 && position == 0)// 0->1
				{
					lp.leftMargin = (int) (offset * (screenWidth * 1.0 / 3) + currentIndex
							* (screenWidth / 3));
					Log.i(TAG, "==走了0——>1：="+lp.leftMargin);

				} else if (currentIndex == 1 && position == 0) // 1->0
				{
					lp.leftMargin = (int) (-(1 - offset) * (screenWidth * 1.0 / 3) + currentIndex * (screenWidth / 3));

					Log.i(TAG, "==走了 1->0：="+lp.leftMargin);

				} else if (currentIndex == 1 && position == 1) // 1->2
				{
					lp.leftMargin = (int) (offset * (screenWidth * 1.0 / 3) + currentIndex
							* (screenWidth / 3));
					Log.i(TAG, "==走了1->2");
					// Log.i(TAG, "==lp.leftMargin:=  1->2:="+lp.leftMargin);
				} else if (currentIndex == 2 && position == 1) // 2->1
				{
					lp.leftMargin = (int) (-(1 - offset) * (screenWidth * 1.0 / 3) + currentIndex * (screenWidth / 3));
					Log.i(TAG, "==走了2->1");
				}
	                cusor.setLayoutParams(lp);
			}
			 /**
             * state滑动中的状态 有三种状态（0，1，2） 1：正在滑动 2：滑动完毕 0：什么都没做。
             */
			@Override
			public void onPageScrollStateChanged(int state) {
				// TODO Auto-generated method stub
				
			}
		});
	}

	private void findById() {
		// TODO Auto-generated method stub
		mPager = (ViewPager) findViewById(R.id.viewPager);
		cusor = (ImageView) findViewById(R.id.cusor);
		textView_one = (TextView) findViewById(R.id.textView_one);
		textView_two = (TextView) findViewById(R.id.textView_two);
		textView_thr = (TextView) findViewById(R.id.textView_thr);
	}

/*	private void InitViewPager() {
		mPager = (ViewPager) findViewById(R.id.viewPager);
		list = new ArrayList<Fragment>();
		FragmentOne fragmentOne = new FragmentOne();
		list.add(fragmentOne);
		FragmentTwo fragmentTwo = new FragmentTwo();
		list.add(fragmentTwo);
		FragmentThr fragmentThr = new FragmentThr();
		list.add(fragmentThr);
		mPager.setAdapter(new MyAdapter(getSupportFragmentManager(),list));
		mPager.setCurrentItem(0);
		mPager.setOnPageChangeListener(new MyOnPageChangeListener());
	}*/

/*	private void InitTextView() {
		textView_one = (TextView) findViewById(R.id.textView_one);
		textView_two = (TextView) findViewById(R.id.textView_two);
		textView_thr = (TextView) findViewById(R.id.textView_thr);
		textView_one.setOnClickListener(new MyOnClickListener(0));
		textView_two.setOnClickListener(new MyOnClickListener(1));
		textView_thr.setOnClickListener(new MyOnClickListener(2));
	}*/

/*	private void InitImageView() {
		
		bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.dotx11)
				.getWidth();// 获取图片宽度
		DisplayMetrics dm = new DisplayMetrics();
		getWindowManager().getDefaultDisplay().getMetrics(dm);
		int screenW = dm.widthPixels;// 获取分辨率宽度
		offset = (screenW / 3 - bmpW) / 2;// 计算偏移量
		Matrix matrix = new Matrix();
		matrix.postTranslate(offset, 0);
		cusor.setImageMatrix(matrix);// 设置动画初始位置
	}*/

	
/*	*//**
	 * 头标点击监听
	 *//*
	public class MyOnClickListener implements View.OnClickListener {
		private int index = 0;

		public MyOnClickListener(int i) {
			index = i;
		}

		@Override
		public void onClick(View v) {
			mPager.setCurrentItem(index);
		}
	};*/
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {

		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

/*	*//**
	 * 页卡切换监听
	 *//*
	public class MyOnPageChangeListener implements OnPageChangeListener {

		int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量
		int two = one * 2;// 页卡1 -> 页卡3 偏移量

		@Override
		public void onPageSelected(int arg0) {
			Animation animation = null;
			switch (arg0) {
			case 0:
				if (currIndex == 1) {
					animation = new TranslateAnimation(one, 0, 0, 0);
				} else if (currIndex == 2) {
					animation = new TranslateAnimation(two, 0, 0, 0);
				}
				break;
			case 1:
				if (currIndex == 0) {
					animation = new TranslateAnimation(offset, one, 0, 0);
				} else if (currIndex == 2) {
					animation = new TranslateAnimation(two, one, 0, 0);
				}
				break;
			case 2:
				if (currIndex == 0) {
					animation = new TranslateAnimation(offset, two, 0, 0);
				} else if (currIndex == 1) {
					animation = new TranslateAnimation(one, two, 0, 0);
				}
				break;
			}
			currIndex = arg0;
			animation.setFillAfter(true);// True:图片停在动画结束位置
			animation.setDuration(300);
			cusor.startAnimation(animation);
		}

		 *//**
         * position :当前页面，及你点击滑动的页面 offset:当前页面偏移的百分比
         * offsetPixels:当前页面偏移的像素位置
         *//*
		@Override
		public void onPageScrolled(int position, float offset, int offsetPixels) {
			 LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) cusor
                     .getLayoutParams();
			 if (currentIndex == 0 && position == 0)// 0->1
             {
                 lp.leftMargin = (int) (offset * (screenWidth * 1.0 / 3) + currentIndex
                         * (screenWidth / 3));

             } else if (currentIndex == 1 && position == 0) // 1->0
             {
                 lp.leftMargin = (int) (-(1 - offset)
                         * (screenWidth * 1.0 / 3) + currentIndex
                         * (screenWidth / 3));

             } else if (currentIndex == 1 && position == 1) // 1->2
             {
                 lp.leftMargin = (int) (offset * (screenWidth * 1.0 / 3) + currentIndex
                         * (screenWidth / 3));
             } else if (currentIndex == 2 && position == 1) // 2->1
             {
                 lp.leftMargin = (int) (-(1 - offset)
                         * (screenWidth * 1.0 / 3) + currentIndex
                         * (screenWidth / 3));
             }
             cusor.setLayoutParams(lp);
		}

		@Override
		public void onPageScrollStateChanged(int arg0) {
		}
	}*/
	
	
	
	class MyAdapter extends FragmentPagerAdapter {
		private List<Fragment> list = null;

		public MyAdapter(FragmentManager fm, List<Fragment> list) {
			super(fm);
			this.list = list;
		}

		@Override
		public Fragment getItem(int arg0) {
			// TODO Auto-generated method stub
			return list.get(arg0);
		}

		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return list.size();
		}

		@Override
		public void destroyItem(ViewGroup container, int position, Object object) {
			// TODO Auto-generated method stub
			super.destroyItem(container, position, object);
		}
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		// Handle action bar item clicks here. The action bar will
		// automatically handle clicks on the Home/Up button, so long
		// as you specify a parent activity in AndroidManifest.xml.
		int id = item.getItemId();
		if (id == R.id.action_settings) {
			return true;
		}
		return super.onOptionsItemSelected(item);
	}



}

关键性的

demo地址  

砍掉侧边就行 单独的demo源码丢了，这也没差多少，，，注释几行代码就是标题所示了


有时有晌
关注
专栏目录
Android--高德地图fragment中定位
超宇的博客
10-31 2223
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" ...
利用手势实现fragment的滑动切换小demo
12-16
本例使用手势实现了对fragment的滑动切换
Android最简单的实现View拖拽跟随手指移动效果
魏成林的专栏
08-21 1万+
今天想实现这个功能，但是网上搜索代码，都是利用setPadding，setMargin 等方法去实现的，这在Android 4.0 以前是没问题的，但是，Android 4.0 后系统已经提供了更简单的方法给我们用了，就是setTranslationX() 和setTranslationY() 。这两个是View的属性方法。现在我就用这两个方法实现一个View可以跟着手指移动拖拽的效果。代码非常非
Android Studio基础学习（入门四）——跟随手指移动的小兔子【FrameLayout帧布局】
Te_zzx_amo的博客
03-04 1678
【FrameLayout帧布局】 话不多说，上代码（我这个兔子有点大，略略略……）： activity_main.xml: &lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app=...
android ViewPager + Fragment + Tablayout 实现嵌套页面导航
最新发布
威威的博客
11-14 4802
android ViewPager + Fragment + Tablayout 实现嵌套页面导航详细实现过程+原码
BottomNavigationView+ViewPager+Fragment 底部导航按钮
热门推荐
你若盛开，蜜蜂自来
07-23 2万+
博主声明： 转载请在开头附加本文链接及作者信息，并标记为转载。本文由博主威威喵原创，请多支持与指教。 本文首发于此 博主：威威喵|博客主页：https://blog.csdn.net/smile_running 感受 Material Design UI 魅力，你不能错过的Material Design 全系列文章： Material Design 之一 Bott...
TabLayout+ViewPager+Fragment实现导航栏页面
weixin_43846184的博客
10-29 2131
TabLayout+ViewPager+Fragment实现导航栏页面 1. 创建Fragment类和Fragment布局文件 在这里把你需要的Fragment类创建好来 这里需要重写Fragment的onCreateView方法（将fragment布局文件加载进来） public class Fragment1 extends Fragment { @Nullable @Override public View onCreateView(LayoutInflater inflate
Android之Viewpager+Fragment实现懒加载示例
08-31
"Android之Viewpager+Fragment实现懒加载示例" Android应用开发中，Viewpager和Fragment是非常常用的两个组件，Viewpager可以实现页面的滑动切换，而Fragment可以实现屏幕上的局部更新。但是，在使用Viewpager和...
viewpager+tabLayout+fragment联动导航栏
12-06
`viewpager+tabLayout+fragment`的组合是实现这一功能的标准方法，它能够为用户提供流畅的滑动切换和清晰的页面导航。下面我们将深入探讨这个话题，了解如何通过这些组件构建一个功能完备的导航栏。 首先，`...
安卓：ViewPager+Fragment+RadioButton实现底部菜单栏滑动切换
01-03
1.ViewPager简单介绍 ViewPager就是一个简单的页面切换组件，我们可以往里面填充多个View，然后我们可以左右滑动...另外，Google官方是建议我们使用Fragment来填充ViewPager的，这样> 可以更加方便的生成每个Page，以及
ViewPager+Fragment左右滑动+上下滑动不冲突
06-12
在Android开发中，`ViewPager`和`Fragment`是两个常用组件，它们被广泛用于构建具有动态内容和交互性丰富的用户界面。本篇文章将深入探讨如何实现`ViewPager`与`Fragment`结合，使得用户可以左右滑动浏览页面，同时...
BottomNavigationView+ViewPager+Fragment底部导航栏切换功能的实现
09-18
本篇文章将详细讲解如何实现一个 BottomNavigationView + ViewPager + Fragment 的底部导航栏切换功能。 首先，我们需要在布局文件中添加BottomNavigationView。在XML布局文件中，定义一个`BottomNavigationView`...
Android 自定义 UI-----跟随手指滑动的小球
timesongjie的专栏
12-24 4268
本文通过自定义android view，实现跟随手指滑动的小球小游戏 需要自定义用户界面，一般是通过继承 View 抽象类，重写onDraw（Canvas canvas）方法。 小游戏，通过实现监听用户手机触摸事件，获取当前用户手指在屏幕中位置，然后实时更改 自定义界面中 X 和 Y值，并调用界面中invalidate（）方法，不断回调onDraw方法， 在onDraw方法中画一个圆。 p
android 自定义View ，跟随手指滑动
jingzz1的博客
04-05 565
为方便内部嵌套，这里选择重写ConstraintLayout，换成其他控件也可以 public class FollowConstraintLayout extends ConstraintLayout { //移动 private GestureDetector gestureDetector; private OnClickListener l; publ...
关于adnroidStudio一直提示Task 'generateDebugSources' not found in project ':app'
骑猪也能看夕阳
08-24 1万+
AS中踩的这个坑儿在项目中碰到了，我在gradle syc 之后出现了这个东西，而且无法再次syc ， clean bulid 完全不在生效 即使执行也是提示Task ‘generateDebugSources’ not found in project ‘:app’。 后来注意到在代码框上方始终提示一个Gradle project syc in progress gradle 始终在syc
Tablayout的简单使用-单文字+图片文字展示效果
骑猪也能看夕阳
08-24 1万+
tablayout每个icon包含图片与文字 Tablayout是安卓新特性中的组件，之前很多地方都会用到这样的组件，只是我们一般都是通过tabactivity加fragment或者其他第三方框架来实现，谷歌推出tablayout以后，使这个组件简化了许多，只需要一个tablayout加一个viewpager就可以实现想要的效果。今天就讲一下tablayout如何配合viewpager一起...
Android检测wifi信号强度，检测网络是否通畅
骑猪也能看夕阳
01-27 8268
android实时网络通畅检测，信号检测，
使用BottomBar+ViewPager+Fragment打造Android底部导航
"这篇教程介绍了如何在Android开发中利用BottomBar、ViewPager和Fragment构建炫酷的底部导航功能。BottomBar是一个流行的开源库，虽然在1.3.3版本后不再直接支持Fragment，但通过自定义配置依然可以实现。文中提到了...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

有时有晌

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值