转载自: https://blog.csdn.net/zhulove86/article/details/52573417
避免在Android上冷启动
在过去几周,在android开发者社区中看一些关于冷启动(clod start)、闪屏(splash screen)、启动界面的动画。在本文中,我将阐明这些动画是否有必要,如何使用以及如何更好提供极致的用户体验。
本文中提到的代码和示例,可以在GitHub上获取。
Splash Screen,lunch screen和cold start
柯尔特(Colt McAnlis,在谷歌开发人员倡导者)通过在Cyril Morrier分享了主题文章,再次展开关于Splash/Lanuce screen在Android系统上使用的讨论。其中除其他事项外,讨论了为什么应该避免使用在Android上使用Splash Screen,声称这会伤害了用户体验,增加应用的大小等。
在我看来,用户应该尽快的看到应用的内容。但不可避免的,当用户启动一个应用程序时,Android会创建一个新的进程。在应用加载中,显示一个由应用theme构建的黑/白屏,或是第一个Activity的theme。
当我们应用非常复杂,并且我们重写了很多被用于初始化分析,报错等功能的对象,应用启动的负载就会变的很大。
Airbnb在应用初始化中显示白屏。
对于用户黑屏并不是最好的选择。如果我们的应用加载的时间很慢,我们应该使用一个占位,用实际内容简单的填充;或另一方面,如果我们的开发工作是复杂的,我们可以显示应用的logo,以增强品牌效应。
AliExpress 在初始化中显示其logo
你的新伙伴, windowBackground
如之前讨论,在进程加载状态时由WindowManager显示的窗口被设置为application主题。具体在android:windowBackground中值。参考lan Lake的文章,如果我们通过使用设定 这个属性,main activity的背景色之上在最中心显示一个bitmap,我们可以获得如下的效果:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque">
<item android:drawable="@color/grey"/>
<item>
<bitmap
android:gravity="center"
android:src="@drawable/img_pizza"/>
</item>
</layer-list>
我们必须牢记以避免出现问题,应该是不透明的,android:opacity=”opaque”。并且在layout中该activity的父activity背景色也应该被一种颜色填充,如果没有的话, 在启动时所展示的将被保留在你的activity中。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@color/grey"
>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?colorPrimary"
android:elevation="4dp"
/>
</LinearLayout>
改变应用引导(onboarding)样式
利用窗口背景色,我们可以丰富用户体验的效果。如果我们的应用复杂,并且要展示一个类似登录或者选择的不透明界面,我们采用位图相同的定位点(anchor point)和动画实现,可以达到非常好的效果。
这个动画,转变一个ImageView,其中包含了相同的的资源 。
ViewCompat.animate(logoImageView)
.translationY(-250)
.setStartDelay(STARTUP_DELAY)
.setDuration(ANIM_ITEM_DURATION).setInterpolator(
new DecelerateInterpolator(1.2f)).start();
这个ImageView略高于屏幕的中心,这可以通过状态栏的影响,离 top 边缘12dp,正好是状态栏一半的高度。
<ImageView
android:id="@+id/img_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:src="@drawable/img_face"
tools:visibility="gone"
/>
改变占位的样式
通过 我们可以创建一个占位的UI,在该UI中显示main activity的内容。举例,我们可以利用 模拟一个工具栏。
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque"
>
<item>
<shape>
<solid android:color="@color/grey"/>
</shape>
</item>
<item
android:height="180dp"
android:gravity="top">
<shape android:shape="rectangle">
<solid android:color="?colorPrimary"/>
</shape>
</item>
</layer-list>
在这种情况下,第二个 模拟工具栏来显示实际的内容,甚至我们可以设置相同的高度(略小于状态栏的宽度),并且在工具栏上使用一些好的动画,可以给用户提供较好的用户体验。
private void collapseToolbar() {
int toolBarHeight;
TypedValue tv = new TypedValue();
getTheme().resolveAttribute(android.R.attr.actionBarSize, tv, true);
toolBarHeight = TypedValue.complexToDimensionPixelSize(
tv.data, getResources().getDisplayMetrics());
ValueAnimator valueHeightAnimator = ValueAnimator
.ofInt(mContentViewHeight, toolBarHeight);
valueHeightAnimator.addUpdateListener(
new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
ViewGroup.LayoutParams lp = mToolbar.getLayoutParams();
lp.height = (Integer) animation.getAnimatedValue();
mToolbar.setLayoutParams(lp);
}
});
valueHeightAnimator.start();
valueHeightAnimator.addListener(
new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
// Fire recycler animator
mAdapter.addAll(ModelItem.getFakeItems());
// Animate fab
ViewCompat.animate(mFab).setStartDelay(600)
.setDuration(400).scaleY(1).scaleX(1).start();
}
});
}
相关资料:
onboarding-examples - Github
Uber onboarding
Use cold start time effectively with a branded launch theme - Ian Lake
Splash Screens Are Evil, Don’t Use Them! - Cyril Mottier
Launch screens - Material Design Spec
Launch screens - MaterialDoc, Gonzalo Toledano
由于时间仓促、翻译水平有限,其中有许多不足之处在所难免,敬请批评指正。