Tab页面手势滑动切换以及动画效果
。
3张页卡之间的切换。带动画效果。
工程结构。
主要应用到android-support-v4.jar这个jar包。
布局文件。
1、main.xml中的代码
[html]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="100.0dip"
android:background="#FFFFFF" >
<TextView
android:id="@+id/text1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡1"
android:textColor="#000000"
android:textSize="22.0dip" />
<TextView
android:id="@+id/text2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡2"
android:textColor="#000000"
android:textSize="22.0dip" />
<TextView
android:id="@+id/text3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡3"
android:textColor="#000000"
android:textSize="22.0dip" />
</LinearLayout>
<ImageView
android:id="@+id/cursor"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="matrix"
android:src="@drawable/a" />
<android.support.v4.view.ViewPager
android:id="@+id/vPager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1.0"
android:background="#000000"
android:flipInterval="30"
android:persistentDrawingCache="animation" />
</LinearLayout>
2、lay1.xml
[html]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#158684"
android:orientation="vertical" >
</LinearLayout>
3、lay2.xml
[html]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FF8684"
android:orientation="vertical" >
</LinearLayout>
4、lay3.xml
[html]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#1586FF"
android:orientation="vertical" >
</LinearLayout>
主要代码。
[java]
/**
* Tab页面手势滑动切换以及动画效果
*
*/
public class MainActivity extends Activity {
// ViewPager是google SDk中自带的一个附加包的一个类,可以用来实现屏幕间的切换。
// android-support-v4.jar
private ViewPager mPager;// 页卡内容
private List<View> listViews; // Tab页面列表
private ImageView cursor;// 动画图片
private TextView t1, t2, t3;// 页卡头标
private int offset = 0;// 动画图片偏移量
private int currIndex = 0;// 当前页卡编号
private int bmpW;// 动画图片宽度
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
InitImageView();
InitTextView();
InitViewPager();
}
/**
* 初始化头标
*/
private void InitTextView() {
t1 = (TextView) findViewById(R.id.text1);
t2 = (TextView) findViewById(R.id.text2);
t3 = (TextView) findViewById(R.id.text3);
t1.setOnClickListener(new MyOnClickListener(0));
t2.setOnClickListener(new MyOnClickListener(1));
t3.setOnClickListener(new MyOnClickListener(2));
}
/**
* 初始化ViewPager
*/
private void InitViewPager() {
mPager = (ViewPager) findViewById(R.id.vPager);
listViews = new ArrayList<View>();
LayoutInflater mInflater = getLayoutInflater();
listViews.add(mInflater.inflate(R.layout.lay1, null));
listViews.add(mInflater.inflate(R.layout.lay2, null));
listViews.add(mInflater.inflate(R.layout.lay3, null));
mPager.setAdapter(new MyPagerAdapter(listViews));
mPager.setCurrentItem(0);
mPager.setOnPageChangeListener(new MyOnPageChangeListener());
}
/**
* 初始化动画
*/
private void InitImageView() {
cursor = (ImageView) findViewById(R.id.cursor);
bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.a)
.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);
cursor.setImageMatrix(matrix);// 设置动画初始位置
}
/**
* ViewPager适配器
*/
public class MyPagerAdapter extends PagerAdapter {
public List<View> mListViews;
public MyPagerAdapter(List<View> mListViews) {
this.mListViews = mListViews;
}
@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager) arg0).removeView(mListViews.get(arg1));
}
@Override
public void finishUpdate(View arg0) {
}
@Override
public int getCount() {
return mListViews.size();
}
@Override
public Object instantiateItem(View arg0, int arg1) {
((ViewPager) arg0).addView(mListViews.get(arg1), 0);
return mListViews.get(arg1);
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == (arg1);
}
@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {
}
@Override
public Parcelable saveState() {
return null;
}
@Override
public void startUpdate(View arg0) {
}
}
/**
* 头标点击监听
*/
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);
}
};
/**
* 页卡切换监听
*/
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);
cursor.startAnimation(animation);
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
}
}
Tab页面手势滑动切换以及动画效果相关推荐
- android切换页面上滑动动画,Android ViewPager多页面滑动切换以及动画效果
评论 #28楼[楼主] 2012-06-01 14:27D.Winter @孤寒江雪 我猜 要么在头尾各再加入一个页卡 在页卡切换监听中判断,如果选中了头尾的页卡,就返回到相邻的那个页卡.头尾页卡的界 ...
- Android ViewPager多页面滑动切换以及动画效果---换view
一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式, 白色横条会移动到相应的页卡头标下.这是一个动画效果,白条是缓慢滑动过去的.好了 ...
- [Android实例] ViewPager多页面滑动切换以及动画效果(精)
一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式,白色横条会移动到相应的页卡头标下.这是一个动画效果,白条是缓慢滑动过去的.好了, ...
- ViewPager多页面滑动切换以及动画效果
2019独角兽企业重金招聘Python工程师标准>>> 一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式,白色横 ...
- Flutter AnimatedSwitcher 实现的滑动切换数字动画效果
优美的应用体验 来自于细节的处理,更源自于码农的自我要求与努力,当然也需要码农年轻灵活的思维,不局限于思维,不局限语言限制,才是编程的最高境界. 本文章实现的效果如下图所示: 在这里定义一个Timer ...
- 手机版html页面左右滑动切换页面,移动端手指左右滑动切换内容demo
说在开头 最近移动端做了一个手指左右滑动切换内容的效果demo; 为了表示我的无私,决定分享给诸位:(详细代码见附件) 正文 先上html代码html> 穿衣助理 完成 整个页面ul部分是需要切 ...
- 仿照QQ的左右滑动切换界面的效果
模仿QQ的左右滑动切换界面的效果 暑假第四十天,在南阳,天气好闷热,幸亏下午下了一场好雨,嗯,爽啊!嘿嘿,最近四十天天宅在地下室看电脑,我的眼睛最近都有点不舒服了,哎,无语中......今天没事就来写 ...
- jQuery前端开发学习指南(18)——利用jQuery实现元素的隐藏、显示和切换及其动画效果
版权声明 本文原创作者:谷哥的小弟 作者博客地址:http://blog.csdn.net/lfdfhl 概述 在jQuery框架中可便捷地以动画形式隐藏和显示以及切换元素,常用方式有如下三种:默认方 ...
- android 桌面动画,Android 如何在Launcher的桌面滑动时添加动画效果? M
正文 目前的Launcher桌面滑动时,是没有动画的.如何在Lancher的桌面滑动时添加动画效果?Demo: 请修改Workspace.java的screenScrolled方法,如下: @Over ...
最新文章
- 数据库开发基本操作-安装Sql Server 2005出现“性能监视器计数器要求”错误解决方法...
- Android 控件架构及View、ViewGroup的测量
- java 注册忘记密码操作_Java实战项目(1):swing图书管理系统的登录,注册,找回密码,增删查,个人解析等...
- AI:2020年6月22日北京智源大会演讲分享之机器感知专题论坛—13:30-14:10山世光教授《从看脸到读心:基于视觉的情感感知技术》
- 鸿蒙OS 2.0流畅度实测:差距到底多大?
- 地理文本处理技术在高德的演进(下)
- Bezier(贝塞尔)曲线的轨迹规划在自动驾驶中的应用(三)
- Deep Learning基础--Softmax求导过程
- Atitit 发帖机实现(4 )- usbQBM1601 gui操作标准化规范与解决方案attilax总结
- Python+Django开发游戏充值管理后台
- ASCII码值是怎么计算的,怎么计算arccos的值
- 时间序列分析之Holt-Winters的R语言实现
- mysql join 性能测试_Mysql Join语法解析与性能分析
- VMware无法启动虚拟机的解决办法
- Cocos Creator 安卓复制功能
- Excel VBA ListBox列表框学习
- 智能车浅谈——控制规律篇
- 如何理解卷积:信号处理、图像处理中的应用
- CSS3 动画效果
- 家庭机器人要爆发?看客拍手叫好,戏子才知冷暖
热门文章
- 【Android 逆向】Android 系统文件分析 ( cpuinfo 处理器信息文件 | self 当前进程信息文件 | meminfo 当前内存信息文件 )
- 【开发环境】Mac 中安装 Python3 最新版本 ( 下载 Python 最新版本 | 安装 Python3 | 验证 Python3 )
- 【Binder 机制】进程通信 | 用户空间与内核空间 | MMU 与虚拟内存地址
- 【算法】哈希表 ( 两数之和 )
- 【鸿蒙 HarmonyOS】UI 布局 ( 相对布局 DependentLayout )
- 【Android 性能优化】布局渲染优化 ( CPU 渲染优化 | 减少布局的嵌套 | 测量布局绘制时间 | OnFrameMetricsAvailableListener | 布局渲染优化总结 )
- 基于IPV6的数据包分析
- jboss 反序列化 getshell
- SQL server与Oracle触发器的创建与使用
- vs2008【断点无效】解决方法