硬币反转效果
发表时间:2020-10-19
发布人:葵宇科技
浏览次数:44
反转效不雅是很常见的,以前应用的时刻,每次都要从新写,如今写了一个对象类,便利应用。
这里主如果感化于两个View之间的反转,类似于硬币的反转。
1.应用扭迁移转变画RotateAnimation,然则要应用带有深度的RotateAnimation动画
下载地址:http://download.csdn.net/detail/forwardyzk/8328895
2.如不雅是点击的┞俘面View,顺时针扭转,那么就先把父窗体(包含正面View和后头View)扭转大年夜0~90,动画停止后,正面View隐蔽,后头view显示出来。
如不雅点击的是后头View,逆时针扭转,那么就把父窗体大年夜扭转180~90,动画停止后,正面View显示出来,后头View隐蔽。
3.为第一个动画添加动画监听,在动画停止后,履行另一半的动画。
设置点击View的第一个动画
/** * @param position * 0表示的是顺时针 1表示的是逆时针 * @param start * 开端扭转的角度 * @param end * 停止的角度 */ private void applyRotation(int position, float start, float end) { // 获取View的中间肠位 final float centerX = mContainer.getWidth() / 2.0f; final float centerY = mContainer.getHeight() / 2.0f; // 创建一个带有深度3D扭迁移转变画 final RotateAnimation rotation = new RotateAnimation(start, end, centerX, centerY, 310.0f, true); rotation.setDuration(500); rotation.setFillAfter(true); // 加快效不雅 rotation.setInterpolator(new AccelerateInterpolator()); rotation.setAnimationListener(new DisplayNextView(position));// 当前动画的监听器,当前动画停止时,可以进行开启下一动画 mContainer.startAnimation(rotation); }
个中RotateAnimation rotation = new RotateAnimation(start, end,centerX, centerY, 310.0f, true);
310.0表示扭转的深度,就是在Z轴偏向的深度。
给这个动画添加了监听DisplayNextView,表示动画的监听器
private final class DisplayNextView implements Animation.AnimationListener { private final int mPosition; private DisplayNextView(int position) { mPosition = position; } public void onAnimationStart(Animation animation) { } public void onAnimationEnd(Animation animation) { mContainer.post(new SwapViews(mPosition)); } public void onAnimationRepeat(Animation animation) { } }
个中position表示的是,在第一次的动画的时刻,是顺时针照样逆时针。
在onAnimationEnd中发送了一个通知,开启了一个线程,履行另一半动画。
/** * 交换正不和的另一半的动画效不雅 * */ private final class SwapViews implements Runnable { private final int mPosition; public SwapViews(int position) { mPosition = position; } public void run() { final float centerX = mContainer.getWidth() / 2.0f; final float centerY = mContainer.getHeight() / 2.0f; RotateAnimation rotation; if (mPosition == 0) { // 点击的┞俘面 mFrontView.setVisibility(View.GONE); mBackView.setVisibility(View.VISIBLE); rotation = new RotateAnimation(90, 180, centerX, centerY, 310.0f, false); } else { // 点击的后头 mBackView.setVisibility(View.GONE); mFrontView.setVisibility(View.VISIBLE); rotation = new RotateAnimation(90, 0, centerX, centerY, 310.0f, false); } rotation.setDuration(500); rotation.setFillAfter(true); // 减速效不雅 rotation.setInterpolator(new DecelerateInterpolator()); mContainer.startAnimation(rotation); } }
会根据第一次的的position,
如不雅是表示的是顺时针,那么后面一半的动画也应当是顺时针。扭转角度连起来就是0~90,90~180。
如不雅是表示的是逆时针,那么后面一半的动画也应当是逆时针。扭转角度连起来就是180~90,90~0。
下面把顺时针扭转和逆时针扭转封装各自的办法
/** * 点击默认正面View的动画效不雅 * * @param container * 最外部的View,frontView和backView的父窗体 * @param frontView * 默认的┞俘面展示的View * @param backView * 默认后头展示的View */ public void clickFrontViewAnimation(View container, View frontView, View backView) { if (container == null || frontView == null || backView == null) { return; } this.mContainer = container; this.mFrontView = frontView; this.mBackView = backView; applyRotation(0, 0, 90); }
点击默认后头的办法
/** * 点击默认后头View的动画效不雅 * * @param container * 最外部的View,frontView和backView的父窗体 * @param frontView * 默认的┞俘面展示的View * @param backView * 默认后头展示的View */ public void clickBackViewAnimation(View container, View frontView, View backView) { if (container == null || frontView == null || backView == null) { return; } this.mContainer = container; this.mFrontView = frontView; this.mBackView = backView; applyRotation(1, 180, 90); }
下面介绍应用步调:
在activity_main.xml的构造
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.yzk.rotatetow.MainActivity" > <ImageView android:id="@+id/front" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/front" android:visibility="visible" /> <ImageView android:id="@+id/back" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/back" android:visibility="gone" /> </RelativeLayout>
在MainActivity中写入代码
[img]http://img.blog.csdn.net/20150105165621062?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9yd2FyZHl6aw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center [img]http://img.blog.csdn.net/20150105165742886?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9yd2FyZHl6aw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center [img]http://img.blog.csdn.net/20150105165810576?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9yd2FyZHl6aw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
思路:
public class MainActivity extends Activity implements OnClickListener { private RelativeLayout container; private ImageView front; private ImageView back; private TowRotateAnimation animaton; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); initData(); } private void initView() { container = (RelativeLayout) findViewById(R.id.container); front = (ImageView) findViewById(R.id.front); back = (ImageView) findViewById(R.id.back); front.setOnClickListener(this); back.setOnClickListener(this); } private void initData() { animaton = new TowRotateAnimation(); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.front: animaton.clickFrontViewAnimation(container, front, back); break; case R.id.back: animaton.clickBackViewAnimation(container, front, back); break; default: break; } } }
直接在View的点击事宜中应用TowRotateAnimation对象的办法。
效不雅图:
源码下载:http://download.csdn.net/detail/forwardyzk/8329211