Android(Lollipop/5.0) Material Design(六) 自定义动画
来源:程序员人生 发布时间:2014-11-18 08:34:20 阅读次数:4213次
官网地址:https://developer.android.com/intl/zh-tw/training/material/animations.html
动画在Material设计中,为用户与app交互反馈他们的动作行动和提供了视觉上的联贯性。Material主题为Buttons和Activity的过渡提供了1些默许的动画,在android5.0(api21)及以上,允许自定义这些动画:
・ Touch feedback 触摸反馈
・ Circular Reveal 循环显示
・ Activity transitions 活动过渡
・ Curved motion 曲线运动
・ View state changes 视图状态变化
Customize Touch Feedback 自定义触摸反馈动画
在Material设计中,触摸反馈提供了1种在用户与UI进行交互时 即时可视化的确认接触点。关于buttons默许的触摸反馈动画,使用了RippleDrawable类,用1个波纹(涟漪)效果在两种不同的状态间过渡。
在多数情况下,你需要在view的xml定义中,定义它的背景:
?android:attr/selectableItemBackground 有界限的波纹
?android:attr/selectableItemBackgroundBorderless 延伸到view以外的波纹 note:该属性为api21添加
或,你可以用xml定义1个RippleDrawable类型的资源,并使用波纹属性。
你可以指定1个色彩给RippleDrawable对象,以改变它的默许触摸反馈色彩,使用主题的android:colorControlHighlight属性。
Use the Reveal Effect 使用展现效果
ViewAnimationUtils.createCircularReveal()方法使您能够激活1个循环显示或隐藏1个视图。
显示:
// previously invisible view
View myView = findViewById(R.id.my_view);
// get the center for the clipping circle
int cx = (myView.getLeft() + myView.getRight()) / 2;
int cy = (myView.getTop() + myView.getBottom()) / 2;
// get the final radius for the clipping circle
int finalRadius = myView.getWidth();
// create and start the animator for this view
// (the start radius is zero)
Animator anim =
ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0, finalRadius);
anim.start();
隐藏
// previously visible view
final View myView = findViewById(R.id.my_view);
// get the center for the clipping circle
int cx = (myView.getLeft() + myView.getRight()) / 2;
int cy = (myView.getTop() + myView.getBottom()) / 2;
// get the initial radius for the clipping circle
int initialRadius = myView.getWidth();
// create the animation (the final radius is zero)
Animator anim =
ViewAnimationUtils.createCircularReveal(myView, cx, cy, initialRadius, 0);
// make the view invisible when the animation is done
anim.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
myView.setVisibility(View.INVISIBLE);
}
});
// start the animation
anim.start();
Customize Activity Transitions 定义Activity的过渡动画
・1个enter transition表示,Activity的进入场景。比如1个explode enter transition,表示Views的进入场景:飞快的从外部向屏幕中心移动。
・1个exit transition表示,Activity的离开场景。比如1个explode exit transition,表示Views的离开场景:从屏幕中心散开。
・1个share transition表示,在两个Activity间同享它们的activity transtion。比如,两个Activity有1个相同的图片,而位置和尺寸不同,使用changeImageTransform这个同享元素,能在Activity间安稳的转换和缩放图片。
android5.0(api21)及以上,支持这些效果的transition(过渡):
爆炸――移动视图或从场景中心。class Explode
滑行――移动视图或从1个场景的边沿。class Slide
淡入淡出――添加或从场景中删除视图通过改变其透明度。 class Fade
也支持这些同享元素(都有对应的class)转换:
changeBounds ――View的布局的边界变化。
changeClipBounds――View的裁剪边界变化。
changeTransform――View的旋转、缩放边界变化
changeImageTransform――目标图象的尺寸和缩放变化。
当启用活动在你的利用程序转换,默许同时淡出淡入之间的过渡是激活进入和退出活动。
Specify custom transitions 自定义过渡动画
首先需要在定义主题的style中,使用android:windowContentTransitions属性,声明使用transitions。也能够定义使用的Transitions:
<?xmlversion="1.0"encoding="utf⑻"?>
<resources>
<stylename="MyTheme"parent="@android:style/Theme.Material">
<!-- enable window content transitions -->
<itemname="android:windowContentTransitions">true</item>
<!-- specify enter and exit transitions -->
<itemname="android:windowEnterTransition">@android:transition/explode</item>
<itemname="android:windowExitTransition">@android:transition/explode</item>
<!-- specify shared element transitions -->
<itemname="android:windowSharedElementEnterTransition">@android:transition/move</item>
<itemname="android:windowSharedElementExitTransition">@android:transition/slide_top</item>
</style>
</resources>
注:每一个transition的xml中定义的就是1组change的元素
在代码中启用transitions:
// inside your activity (if you did not enable transitions in your theme)
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
// set an exit transition
getWindow().setExitTransition(new Explode());
在代码中设置transitions的方法还有
Window.setEnterTransition()
Window.setExitTransition()
Window.setSharedElementEnterTransition()
Window.setSharedElementExitTransition()
要想尽快进行transitions过渡,可在Activity中调用Window.setAllowEnterTransitionOverlap()。
Start an activity using transitions 使用过渡启动Activity
如果你要启用transtions并设置为1个Activity的结束exit transtion,当你以以下方式启动另外一个Activity时,它将被激活:
startActivity(intent,
ActivityOptions.makeSceneTransitionAnimation(this).toBundle());
当你在另外一个Activity中设置了enter transtion,在其启动时,它将被激活。想要disable transitions,那末在启动另外一个Activity时:
startActivity(intent,null);
//传递null 的options bundle
Start an activity with a shared element 使用1个同享元素启动Acitvity
1.在主题中启用window content
2.在style中定义同享的过渡transitions
3.定义transitions的xml资源 res/transition
4.在layout中调用android:transitionName="" 设置第3步中定义的名字
5.调用 ActivityOptions.makeSceneTransitionAnimation()生成相应的ActivityOptions对象。
// get the element that receives the click event
final View imgContainerView = findViewById(R.id.img_container);
// get the common element for the transition in this activity
final View androidRobotView = findViewById(R.id.image_small);
// define a click listener
imgContainerView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Intent intent = new Intent(this, Activity2.class);
// create the transition animation - the images in the layouts
// of both activities are defined with android:transitionName="robot"
ActivityOptions options = ActivityOptions
.makeSceneTransitionAnimation(this, androidRobotView, "robot");
&n
生活不易,码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠
------分隔线----------------------------
------分隔线----------------------------