文档章节

将图片实现镜面翻转效果

火文乐武
 火文乐武
发布于 2016/05/23 19:16
字数 492
阅读 22
收藏 0

实现步骤:

1、在main_activity.xml中添加要实现的两个图片,布局为相对布局

2、在主方法中,定义两个ScaleAnimation 对象,用来实现图片翻转效果,将图片初始化

3、定义两个内部类,实现图片的显示效果

4、对布局文件设置监听事件,监听点击的发生,实现图片的点击反应

5、对其中一个ScaleAnimation对象做监听,用来实现对另一个对象的连续操作

代码如下

1、XML中的代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/rl"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.day2505.MainActivity" >

    <ImageView
        android:id="@+id/iv1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/hello_world"
        android:src="@drawable/image_a" />
    <ImageView
        android:id="@+id/iv2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/hello_world"
        android:src="@drawable/image_b" />

</RelativeLayout>

2、MainActivity中的代码:

public class MainActivity extends Activity {

	private ImageView ivA, ivB;
	private RelativeLayout rl = null;

	private ScaleAnimation sa1 = new ScaleAnimation(1, 0, 1, 1,
			Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

	private ScaleAnimation sa2 = new ScaleAnimation(0, 1, 1, 1,
			Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		initView();

		// 两张图片所对应容器的监听
		rl.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				// ivA可见
				if (ivA.getVisibility() == View.VISIBLE) {
					ivA.startAnimation(sa1);
				} else { // ivA不可见(ivB可见)
					ivB.startAnimation(sa1);
				}
			}
		});
	}

	private void initView() {
		ivA = (ImageView) findViewById(R.id.ivA);
		ivB = (ImageView) findViewById(R.id.ivB);

		rl = (RelativeLayout) findViewById(R.id.rl);

		// 默认开始时,显示ivA
		showA();

		// 分别设置两个动画的持续时间
		sa1.setDuration(1000);
		sa2.setDuration(1000);

		// 给sa1设置动画监听
		sa1.setAnimationListener(new AnimationListener() {

			/**
			 * 动画开始时调用该方法
			 * 
			 * @Override
			 */
			public void onAnimationStart(Animation animation) {

			}

			/**
			 * 动画重复时调用该方法
			 * 
			 * @Override
			 */
			public void onAnimationRepeat(Animation animation) {

			}

			/**
			 * 动画结束时调用该方法
			 * 
			 * @Override
			 */
			public void onAnimationEnd(Animation animation) {
				if (ivA.getVisibility() == View.VISIBLE) {
					ivA.setAnimation(null);
					showB();
					ivB.startAnimation(sa2);
				} else {
					ivB.setAnimation(null);
					showA();
					ivA.startAnimation(sa2);
				}
			}
		});
	}

	// 显示图片A
	private void showA() {
		ivA.setVisibility(View.VISIBLE);
		ivB.setVisibility(View.INVISIBLE);
	}

	// 显示图片B
	private void showB() {
		ivB.setVisibility(View.VISIBLE);
		ivA.setVisibility(View.INVISIBLE);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

 

 

© 著作权归作者所有

共有 人打赏支持
火文乐武
粉丝 7
博文 38
码字总数 17183
作品 0
郑州
Android工程师
私信 提问
【Unity3D技术文档翻译】第2.3.2篇 金属与镜面工作流对比

上一章:【Unity3D技术文档翻译】第2.3.1篇 光照内容与光照环境 本章原文所在章节:【Unity Manual】→【Graphics】→【Graphics Overview】→【Materials, Shaders & Textures】→【Standar...

何三思
2018/06/17
0
0
DirectX11 With Windows SDK--12 深度/模板状态

前言 DirectX11 With Windows SDK完整目录:http://www.cnblogs.com/X-Jun/p/9028764.html 深度/模板测试使用的是与后备缓冲区同等分辨率大小的缓冲区,每个元素的一部分连续位用于深度测试,...

X_Jun
2018/07/28
0
0
【Unity3D技术文档翻译】第2.3.3.3篇 镜面模式:镜面参数

上一章:【Unity3D技术文档翻译】第2.3.3.2篇 反照率颜色与透明度(Albedo Color and Transparency) 本章原文所在章节:【Unity Manual】→【Graphics】→【Graphics Overview】→【Materia...

何三思
2018/06/19
0
0
学习OpenGL ES之教你造一面镜子

本系列所有文章目录 获取示例代码 我是闷骚的占位图 前言 在基于CubeMap的反射效果一文中,介绍到如何使用CubeMap让物体反射环境的光,从而制造逼真的3D效果。本文将介绍另一种反射效果的制作...

handyTOOL
2017/09/05
0
0
css3实现3D立体翻转导航特效

css3实现3D立体翻转导航特效 效果描述: 当鼠标悬停在导航上,会有一个立体式翻转效果,效果很逼真 css3特效,不支持低版本浏览器 附件中的案例没有实用任何图片,所以对于大家来说,省去了路...

wybo521
2016/01/18
43
0

没有更多内容

加载失败,请刷新页面

加载更多

记录replugin使用的一个坑

反复编译插件放入宿主中,一直出现如下错误: android.content.res.Resources$NotFoundException: Resource ID #0x7f050000 type #0x5 is not valid 回滚代码,重启AS还是出错。最终发现将宿...

Gemini-Lin
今天
1
0
Vert.x系列(二)--EventBusImpl源码分析

前言:Vert.x 实现了2种完成不同的eventBus: EventBusImpl(A local event bus implementation)和 它的子类 ClusteredEventBus(An event bus implementation that clusters with other Ve......

冷基
今天
1
0
Perl - 获取文件项目

参考:http://www.runoob.com/perl/perl-directories.html 下面返回JSON格式的文件列表 #!/usr/bin/perluse strict;use warnings;use utf8;use feature ':5.26';require Fi......

wffger
昨天
2
0
vue组件系列3、查询下载

直接源码,虽然样式样式不好看,逻辑也不是最优,但是可以留作纪念。毕竟以后类似的功能只需要优化就可以了,不用每次都重头开始。。。 <template> <div class="pre_upload"> <div ...

轻轻的往前走
昨天
2
0
java浅复制和深复制

之前写了数组的复制,所以这里继续总结一下浅复制和深复制。 浅拷贝:对基本数据类型进行值传递,对引用数据类型进行引用传递般的拷贝。 深拷贝:对基本数据类型进行值传递,对引用数据类型,...

woshixin
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部