Android仿微信图片放大动画 - 简书
<div class="fixed-btn note-fixed-download" data-toggle="popover" data-placement="left" data-html="true" data-trigger="hover" data-content=''>
写了7782字，被68人关注，获得了197个喜欢
Android仿微信图片放大动画
＃今年三月份直接上手做的android，代码写的不规范，有问题希望指出，谢谢（app数英）
类似于微信 图片浏览的效果，我的做法是在两个activity A\B之间传递图片的位置信息
思路：在activity A的list view上有一张图片，通过方法获取到此image view相对于 window 的坐标（也就是 距离手机屏幕上侧和左侧的距离），然后将这些参数传递给 activity B，此时activity B创建一个 image view，image view的宽高是 activity A 里点击的图片的宽高，然后设置 margin left
margin top，此时就造成一种假象（activity a 的图片直接传递到了 activity B），下面就是 缩放代码
注意：根据你的代码 可能 activity a 里边计算出来的 上侧距离可能要减去 活着加上
状态条的高度，具体根据个人代码判断。
上边的 gif
只是粗略的演示，如有疑问，可以留言 一同解决
下边是部分主要代码：
#activity A
//获取上边距，左边距，以及图片宽高
//可能几个人计算出的margintop要减去 状态栏高度
int[] position = new int[2];
headerImageV.getLocationInWindow(position);
int margin_top = position[1];
int margin_left = position[0];
int width = headerImageV.getWidth();
int height = headerImageV.getHeight();
Intent intent = new Intent(getActivity(), EnlargeimagevActivity.class);
intent.putExtra(EnlargeimagevActivity.IMG_URL, personModel.getAvatar_320());startActivity(intent);
//由于是在已发布的项目上更改的代码，我这只是简单的演示， 所以没有做参数传递， 直接在b页面写死的
#activity B
//由于我使用的第三方库 PhotoView（处理图片放大缩小），实际上我的图片并不是正方形（我这边放大的图片和手机的比例一样），所以下边高度及 缩放比例的计算会出现不同
final int width = 495;
final int height = (int)((float)Constant.getScreenHeight(this)/Constant.getScreenWidth(this) * width);
final int mar_left = 45;
final int mar_top = 1030;
RelativeLayout.LayoutParams para = new RelativeLayout.LayoutParams(width, height);
para.leftMargin = mar_
para.topMargin = mar_top - (height/2 - width/2);
layout.addView(bigImage, para);
//水平 和 竖直方向上的 偏转量，一定要设置
bigImage.setPivotX(0f);
bigImage.setPivotY(0f);
final float startScale = (float)width / Constant.getScreenWidth(this);
final float startHeightScale = ((float)height / Constant.getScreenHeight(this));
//AnimationSet提供了一个把多个动画组合成一个组合的机制，并可设置组中动画的时序关系，如同时播放，顺序播放等
//解释，2秒内 bigimage 的x由 mar_left 到0；
//bigimage的y由mar_top到0；
//然后缩放比例
//起初我写的是//with(ObjectAnimator.ofFloat(bigImage,View.SCALE_X,startScale,1f)).
//发现并没有效果， 我一直以为 最大只能1f，后来实验下才知道
//如有错误，请指出
AnimatorSet set = new AnimatorSet();
set.play(ObjectAnimator.ofFloat(bigImage,View.X,mar_left,0)).
with(ObjectAnimator.ofFloat(bigImage, View.Y, mar_top - (height / 2 - width / 2), 0)).
with(ObjectAnimator.ofFloat(bigImage,View.SCALE_X,startScale*(1/startScale),1f*(1/startScale))).
with(ObjectAnimator.ofFloat(bigImage, View.SCALE_Y, startHeightScale * (1 / startHeightScale), 1f * (1 / startHeightScale)));
set.setDuration(2000);
set.setInterpolator(new DecelerateInterpolator());
set.start();
//点击缩小，返回 activity A
Constant.bindImage(bigImage, imgurl, false);
bigImage.setOnPhotoTapListener(new PhotoViewAttacher.OnPhotoTapListener() {
public void onPhotoTap(View view, float x, float y) {
AnimatorSet set = new AnimatorSet();
set.play(ObjectAnimator.ofFloat(bigImage,View.X,0,mar_left)).
with(ObjectAnimator.ofFloat(bigImage,View.Y, 0,mar_top - (height/2 - width/2))).
with(ObjectAnimator.ofFloat(bigImage,View.SCALE_X,1f*(1/startScale),startScale*(1/startScale))).
with(ObjectAnimator.ofFloat(bigImage,View.SCALE_Y,1f*(1/startHeightScale),startHeightScale*(1/startHeightScale)));
set.setDuration(2000);
set.setInterpolator(new DecelerateInterpolator());
set.addListener(new AnimatorListenerAdapter() {
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
overridePendingTransition(R.anim.slide_other, R.anim.slide_other);
public void onAnimationCancel(Animator animation) {
super.onAnimationCancel(animation);
set.start();
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮
被以下专题收入，发现更多相似内容：
如果你是程序员，或者有一颗喜欢写程序的心，喜欢分享技术干货、项目经验、程序员日常囧事等等，欢迎投稿《程序员》专题。
专题主编：小...
· 244183人关注
玩转简书的第一步，从这个专题开始。
想上首页热门榜么？好内容想被更多人看到么？来投稿吧！如果被拒也不要灰心哦～入选文章会进一个队...
· 143056人关注
Android老鸟给新人的建议、资源。
更优质的原创内容，欢迎关注技术公众号，微信搜索：“Open软件开发小组”或者“open_dev”
· 14175人关注
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
选择支付方式：& & Animation mScaleAnimation = new ScaleAnimation(0.5f, 1.0f, 0.5f,& & 1.0f,// 整个屏幕就0.0到1.0的大小//缩放& & Animation.INFINITE, 0.5f,& & Animation.INFINITE, 0.5f);& & mScaleAnimation.setDuration(1000);& & mScaleAnimation.setFillAfter(true);& & Animation mTranslateAnimation = new TranslateAnimation(-100*SetRobot2Activity.mDensity,0, -15*SetRobot2Activity.mDensity, 0);// 移动& & mTranslateAnimation.setDuration(1000);& & AnimationSet mAnimationSet=new AnimationSet(false);& & mAnimationSet.addAnimation(mScaleAnimation);& & mAnimationSet.setFillAfter(true);& & mAnimationSet.addAnimation(mTranslateAnimation);& & iv.startAnimation(mAnimationSet);& & 摘自 liuxiIT的专栏
声明：该文章系网友上传分享，此内容仅代表网友个人经验或观点，不代表本网站立场和观点；若未进行原创声明，则表明该文章系转载自互联网；若该文章内容涉嫌侵权，请及时向
论文写作技巧
上一篇：下一篇：
相关经验教程今天看啥 热点：
【安卓】自定义基于onDraw的任意动画(不仅仅是平移/旋转/缩放/alpha)、！，
1.基于时间的显示映射。如:给定度数,显示圆弧,加上时序,即可有圆弧动画的效果
2.给定时序。用于驱动动画的一帧帧绘制
方案一、基于ObjectAnimator。动画运作时会调用degree对应set函数(基于放射调用),即setDegree。
ObjectAnimator ani=ObjectAnimator.ofInt(myView, &degree&, 0,300);
ani.start();
注:1&混编后,默认会将setDegree混掉,导致找不到函数,故混编后这种机制会失效。解决方法是1.proguard中防止该段代码混编(具体方法百度) 2.使用方法二
& & &2&ObjectAnimator在3.0后才支持,可使用NineOldAndroids库,效果完全一样。
方案二、仍然基于ObjectAnimator。但基于回调,这种方法未用到反射,故混编时仍ok
ObjectAnimator ani=ObjectAnimator.ofInt(myView, new Prop(), 0,300);
ani.start();
class Prop extends Property&View, Integer& {
public Prop() {
// TODO Auto-generated constructor stub
super(Integer.class, &kk&);
public void set(View object, Integer value) {
// TODO Auto-generated method stub
((MyView1)object).setDegree(value);
public Integer get(View object) {
// TODO Auto-generated method stub
方案三、用animation提供时序。interpolatedTime为0~1,即时间的百分比。
Animation ani=new Animation() {
protected void applyTransformation(float interpolatedTime,
Transformation t) {
// TODO Auto-generated method stub
myView.setDegree((int)(interpolatedTime*300f));
ani.setDuration(3000);
myView.startAnimation(ani);
//===========================================================================
自定义视图,setDegress可改变圆弧角度:
private class MyView1 extends ImageView {
public int degree = 0;
public MyView1(Context ct) {
// TODO Auto-generated constructor stub
super(ct);
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
Rect r = new Rect();
getLocalVisibleRect(r);
canvas.drawArc(new RectF(r), 0, degree, true, pt);
public void setDegree(int degree) {
this.degree =
invalidate();
相关搜索：
相关阅读：
相关频道：
Android教程最近更新Android动画效果translate(位移)、scale(缩放)、alpha(淡入淡出)、rotate(旋转)
Android动画效果translate(位移)、scale(缩放)、alpha(淡入淡出)、rotate(旋转)
overridePendingTransition只支持android2.0以上版本,动画效果在anim目录下的xml文件中定义，在程序中用AnimationUtils.loadAnimation(Contextcontext,intResourcesId)载入成Animation对象，在需要显示动画效果时，执行需要动画的View的startAnimation方法，传入Animation,即可。切换Activity也可以应用动画效果，在startActivity方法后，执行overridePendingTransition方法，两个参数分别是切换前的动画效果，切换后的动画效果，下面的例子中传入的是两个alpha动画,以实现切换Activity时淡出淡入，渐隐渐现效果。
a1.xml 淡出
&?xml&version="1.0"&encoding="utf-8"?&&&
&set&xmlns:android="/apk/res/android"&&&
&&&&alpha&&
&&&android:fromAlpha="1.0"&&
&&&android:toAlpha="0.0"&&
&&&android:duration="500"&&
fromAlpha:开始时透明度&&
toAlpha：结束时透明度&&
duration：动画持续时间&&
&--&&&&?xml version="1.0" encoding="utf-8"?&
&set xmlns:android="/apk/res/android"&
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:duration="500"
fromAlpha:开始时透明度
toAlpha：结束时透明度
duration：动画持续时间
--&a2.xml 淡入
&?xml&version="1.0"&encoding="utf-8"?&&&
&set&xmlns:android="/apk/res/android"&&&
&&&&alpha&&
&&&android:fromAlpha="0.0"&&
&&&android:toAlpha="1.0"&&
&&&android:duration="500"&&
&/set& &rotate.xml 旋转效果：
&?xml&version="1.0"&encoding="utf-8"?&&&
&set&xmlns:android="/apk/res/android"&&&
android:interpolator="@android:anim/accelerate_decelerate_interpolator"&&
android:fromDegrees="300"&&
android:toDegrees="-360"&&
android:pivotX="10%"&&
android:pivotY="100%"&&
android:duration="10000"&/&&&
fromDegrees开始时的角度&&
toDegrees动画结束时角度&&
pivotX,pivotY不太清楚，看效果应该是定义旋转的圆心的&&
&--&&&&?xml version="1.0" encoding="utf-8"?&
&set xmlns:android="/apk/res/android"&
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromDegrees="300"
android:toDegrees="-360"
android:pivotX="10%"
android:pivotY="100%"
android:duration="10000" /&
fromDegrees开始时的角度
toDegrees动画结束时角度
pivotX,pivotY不太清楚，看效果应该是定义旋转的圆心的
sacle.xml 缩放效果：
&?xml&version="1.0"&encoding="utf-8"?&&&
&set&xmlns:android="/apk/res/android"&&&
&&&&&&scale&&&&
&&&&&android:interpolator=&"@android:anim/decelerate_interpolator"&&&&&&
&&&&&android:fromXScale="0.0"&&&&&&
&&&&&android:toXScale="1.5"&&&&&&
&&&&&android:fromYScale="0.0"&&&&&&
&&&&&android:toYScale="1.5"&&&&&&
&&&&&android:pivotX="50%"&&&&&&
&&&&&android:pivotY="50%"&&&&&&
&&&&&android:startOffset="0"&&&&&&
&&&&&android:duration="10000"&&
&&&&&android:repeatCount="1"&&&&
&&&&&android:repeatMode="reverse"&&
interpolator指定动画插入器，常见的有加速减速插入器accelerate_decelerate_interpolator，加速插入器accelerate_interpolator，减速插入器decelerate_interpolator。&&
fromXScale,fromYScale，动画开始前X,Y的缩放，0.0为不显示，1.0为正常大小&&
toXScale，toYScale，动画最终缩放的倍数，1.0为正常大小，大于1.0放大&&
pivotX，pivotY动画起始位置，相对于屏幕的百分比,两个都为50%表示动画从屏幕中间开始&&
startOffset，动画多次执行的间隔时间，如果只执行一次，执行前会暂停这段时间，单位毫秒&&
duration，一次动画效果消耗的时间，单位毫秒，值越小动画速度越快&&
repeatCount，动画重复的计数，动画将会执行该值+1次&&
repeatMode，动画重复的模式，reverse为反向，当第偶次执行时，动画方向会相反。restart为重新执行，方向不变&&
&--&&&&?xml version="1.0" encoding="utf-8"?&
&set xmlns:android="/apk/res/android"&
android:interpolator= "@android:anim/decelerate_interpolator"
android:fromXScale="0.0"
android:toXScale="1.5"
android:fromYScale="0.0"
android:toYScale="1.5"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:duration="10000"
android:repeatCount="1"
android:repeatMode="reverse"
interpolator指定动画插入器，常见的有加速减速插入器accelerate_decelerate_interpolator，加速插入器accelerate_interpolator，减速插入器decelerate_interpolator。
fromXScale,fromYScale，动画开始前X,Y的缩放，0.0为不显示，1.0为正常大小
toXScale，toYScale，动画最终缩放的倍数，1.0为正常大小，大于1.0放大
pivotX，pivotY动画起始位置，相对于屏幕的百分比,两个都为50%表示动画从屏幕中间开始
startOffset，动画多次执行的间隔时间，如果只执行一次，执行前会暂停这段时间，单位毫秒
duration，一次动画效果消耗的时间，单位毫秒，值越小动画速度越快
repeatCount，动画重复的计数，动画将会执行该值+1次
repeatMode，动画重复的模式，reverse为反向，当第偶次执行时，动画方向会相反。restart为重新执行，方向不变
--&translate 移动效果：
&?xml&version="1.0"&encoding="utf-8"?&&&
&&set&xmlns:android="/apk/res/android"&&&
&&translate&&
&android:fromXDelta="320"&&
&android:toXDelta="0"&&
&android:fromYDelta="480"&&
&android:toYDelta="0"&&
&android:duration="10000"&/&&&
fromXDelta,fromYDelta起始时X，Y座标,屏幕右下角的座标是X:320,Y:480&&
&toXDelta，toYDelta动画结束时X,Y的座标&&
发表评论：
TA的最新馆藏[转]&[转]&[转]&[转]&[转]&[转]&