MaterialDesign动画
MaterialDesign动画提供了一些标准的动画效果,下面一一介绍。
Touch Feedback(触摸反馈)
5.0+的手机是自带的。
通过给控件设置background的属性值即可实现:
<Button
android:id="@+id/btn_test"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:background="?attr/selectableItemBackgroundBorderless"
android:text="测试"/>
其中,selectableItemBackground是有边界的水波纹效果,selectableItemBackgroundBorderless是没有边界的水波纹效果。
可以修改背景颜色和水波纹的颜色,并且最好使用AppcompatActivity:
<item name="colorControlHighlight">@color/colorPrimary_pink</item>
<item name="colorButtonNormal">@color/material_blue_grey_800</item>
如果想改变个别控件的颜色的话,可以通过在外面再嵌套一层布局实现。
Reveal Effect(揭露效果)
例子:Activity的揭露出现的效果。主要使用ViewAnimationUtil工具类实现:
//圆形水波纹揭露效果
ViewAnimationUtils.createCircularReveal(
view, //作用在哪个View上面
centerX, centerY, //扩散的中心点
startRadius, //开始扩散初始半径
endRadius)//扩散结束半径
其中,扩散的半径通过勾股定理进行计算,例如:
(float) Math.hypot(view.getWidth() / 2, view.getHeight() / 2)
例子如下:
@Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
view_root = (LinearLayoutCompat) findViewById(R.id.llc_test);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Animator animator = ViewAnimationUtils.createCircularReveal(view_root, view_root.getWidth() / 2, view_root.getHeight() / 2, 0f, (float) Math.hypot(view_root.getWidth() / 2, view_root.getHeight() / 2));
animator.setDuration(1000);
animator.setInterpolator(new AccelerateInterpolator());
animator.start();
}
}
因为动画播放是依附在window上面的,而在Activity onCreate方法中调用时Window还未初始化完毕,因此需要在onWindowFocusChanged中执行动画。
Activity transition(Activity转场动画效果)
概念:两个Activity进行跳转的时候,转场动画。以前我们是通过overridePendingTransition方法实现。
主要使用ActivityOptions类。只支持API21以上的版本。版本判断会比较麻烦,谷歌很贴心 设计了一个兼容类:ActivityOptionsCompat(v4包中),但是此类在低版本上面并没有转场动画效果,只是解决了我们手动去判断版本的问题而已。
使用转换动画前提:需要给两个Activity都设置如下,让其允许使用转场动画。
//方法一:
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
//方法二:
修改主题:<item name="android:windowContentTransitions">true</item>
转场动画可以分为两大类:共享元素转换和普通的转换。
一、共享元素转换
单个元素:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(MDAnimActivity.this, iv_test, "test");
Intent intent = new Intent(MDAnimActivity.this, MDAnimSceneTransitionActivity.class);
startActivity(intent, options.toBundle());
}
多个元素同时转换:
ActivityOptionsCompat optionsCompat = ActivityOptionsCompat
.makeSceneTransitionAnimation(this, Pair.create((View)iv1, "iv1"),Pair.create((View)bt, "bt"));
Intent intent = new Intent(this, SecondActivity.class);
startActivity(intent, optionsCompat.toBundle());
页面返回的时候系统自动实现了,请看FragmentActivity的onBackPressed方法:
@Override
public void onBackPressed() {
if (!mFragments.getSupportFragmentManager().popBackStackImmediate()) {
super.onBackPressed();
}
}
二、非共享元素的转换
只有API 21才有下面自带效果,因此使用的时候需要判断版本号。
三种系统带的:滑动效果(Slide)、展开效果Explode、渐变显示隐藏效果Fade。下面以Fade为例子介绍:
//最好两个Activity都设置一些,效果会比较好看
Fade fade = new Fade();
fade.setDuration(1000);
getWindow().setExitTransition(fade);//出去的动画
getWindow().setEnterTransition(fade);//进来的动画
//如果有共享元素,可以设置共享元素,那么它就会按照共享元素动画执行,其他的子view就会按照Fade动画执行。
ActivityOptionsCompat optionsCompat = ActivityOptionsCompat.makeSceneTransitionAnimation(MainActivity.this);
Intent intent = new Intent(this, SecondActivity.class);
startActivity(intent, optionsCompat.toBundle());
Curved motion(曲线运动)
设计:view的平移旋转等效果结合Path、Interpolator插值器。
View State change (视图的状态改变)
例子:按下一个控件,例如FloatingActionButton,会有Z轴的阴影加深效果。
如果觉得我的文字对你有所帮助的话,欢迎关注我的公众号:
我的群欢迎大家进来探讨各种技术与非技术的话题,有兴趣的朋友们加我私人微信huannan88,我拉你进群交(♂)流(♀)。