区块链技术博客
www.b2bchain.cn

Android 启动页的一些坑-多图杀猫求职学习资料

本文介绍了Android 启动页的一些坑-多图杀猫求职学习资料,有助于帮助完成毕业设计以及求职,是一篇很好的资料。

对技术面试,学习经验等有一些体会,在此分享。

最近可能是新项目风口,很多人都在问启动页的适配/启动速度或者各种各样的优化,闲着没事写一篇吧

适配

首先是启动页的适配,经常有些群友在问启动页变形或者拉伸怎么办,下面用绘图软件讲一讲

Android 启动页的一些坑-多图杀猫
这里是一个微信的启动图片,红色边框是手机屏幕屏幕边界,截图手机是红米k20,屏幕长宽比为19.5比9
看起来很正常是吧,没有什么问题
如果UI基于红米K20P制作这张图片,那这张图片也是长宽比19.5比9(其实大多UI都是基于iOS的尺寸做设计图的,Android没牌面,诶)
大多数开发者都会按照UI图的基础尺寸新建一个虚拟机作为xml布局的实时预览,而启动页一般都是在xml的根布局添加一个background属性或者添加一个imageView,宽高都是match
但是如果启动页是一整张图片,运行在普通16比9或者18比9的屏幕中,就会出现下面的情况
Android 启动页的一些坑-多图杀猫
宽度没有变,但是屏幕高度变了,所以默认要把图片全部显示出来的话就会被”压扁”
当然也有人说可以给imageView添加android:scaleType=”fitCenter”或者android:scaleType=”centerCrop”
但是也会有下面的情况:
Android 启动页的一些坑-多图杀猫

Android 启动页的一些坑-多图杀猫
这两种情况就又尴尬了,虽然说第一种看起来没有问题,但那是因为这个启动图片的图标在居中的位置

Android 启动页的一些坑-多图杀猫
原谅我用一个游戏截图做说明,手机里实在没找到哪个APP的启动页有问题,上图中如果碰到小型红框的效果,那你的启动页中内容就会有一部分显示不出来,比如游戏截图中的昵称/金币和下面的导航栏等.

其实启动页也是需要适配的,目前主流方式是把启动页的零件拆散,然后根据RL或者CL布局的特性进行约束
再举例一下微信的启动页
Android 启动页的一些坑-多图杀猫
红框依旧是手机屏幕边框,这里我们把启动页分解一下,一个是黑色的background,一个是蓝框中的图片
只要设置蓝框中的imageView属性为居中+根据UI图中的宽高比设置imageView的宽高比(可以用约束布局控制宽高比或者代码计算高度)
因为黑色的background不存在拉伸变形的情况,imageView又是根据屏幕宽度计算宽高比后设置了高度,所以它始终能保证居中+宽度填充的效果

然后是小米商城的启动页
Android 启动页的一些坑-多图杀猫
这里分解一下它的布局
标号1的图片和微信图片原理相同,只是它不是居中,是从上向下顶头了
标号2的icon,可以直接沉底,水平居中然后距离底边距一个dp距离
标号3的跳过,一样是沉底,靠右然后距离底部和右边各一个dp距离

再看下淘宝的启动页,截图慢了点,能看到首页的输入栏已经显示出来了,这个是后面要说的启动页优化
Android 启动页的一些坑-多图杀猫
同样是可以看错一个图片居中
下面一个icon左右居中,保持在文字上面
下面一个文字沉底并且有个底部边距

这两个APP都避免了上面游戏截图那种过于复杂或者内容多的启动页面
实在是没找到复杂布局的启动页,谁有可以发我一下
当然了,也不是没有倔强的UI,他就是不给你做切图,并且说”人家iOS都能适配,你是不是水平不行呀?”
这种时候请你给UI穷举一下市面上Android设备的各种宽高比,而且别忘了各种小品牌机器(手机不是只有华米OV)和兼容pad类设备
然后你按照iOS的适配方法,给每种屏幕显示不一样尺寸的启动页就可以了 嘻嘻

启动页优化

这里我们分两个点说

  1. 启动速度
  2. 启动页的无感过渡

启动速度

点击APP图标以后,会先执行application中的各种初始化逻辑,关于application的优化下次再说
然后APP打开启动页,大多会根据APP主题背景色会显示白色或者黑色的等待,0.5-3S不等
这里我们能处理的是启动页的布局渲染速度,先发代码

package com.linkturing.base.base;  import android.os.Bundle; import android.view.animation.AlphaAnimation; import android.view.animation.Animation; import android.widget.LinearLayout;  import com.linkturing.base.utils.APPUtils; import com.xuexiang.xui.utils.Utils;  /**  * ================================================  * Description:  * <p>  * Created by alex on 2020/6/28 0028  * <p>  * 页面内容介绍:  * <p>  * ================================================  */ public abstract class BaseSplashActivity extends BaseActivity {     /**      * 默认启动页过渡时间      */     private static final int DEFAULT_SPLASH_DURATION_MILLIS = 500;      protected LinearLayout mWelcomeLayout;          protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         initView();         startSplash();         onCreateActivity();     }      private void initView() {         mWelcomeLayout = new LinearLayout(this);         LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);         mWelcomeLayout.setLayoutParams(params);         mWelcomeLayout.setOrientation(LinearLayout.VERTICAL); //        initSplashView(getSplashImgResId());         setViewBackground();         setContentView(mWelcomeLayout);     }      /**      * 初始化启动界面      *      *      */     private void setViewBackground() {         if (getSplashImgResId() != 0) {             mWelcomeLayout.setBackground(APPUtils.getDrawablebyResource(this, getSplashImgResId()));         }     }      /**      * 初始化启动界面背景图片      *      * 背景图片资源ID      */     protected abstract int getSplashImgResId();      /**      * activity启动后的初始化      */     protected abstract void onCreateActivity();      /**      * 启动页结束后的动作      */     protected abstract void onSplashFinished();      /**      * 启动页持续的时间      */     protected long getSplashDurationMillis() {         return DEFAULT_SPLASH_DURATION_MILLIS;     }      protected abstract boolean enableAlphaAnim();      /**      * 开启过渡      *      *      */     protected void startSplash() {         if (enableAlphaAnim()) {             startSplashAnim(new AlphaAnimation(0.2F, 1.0F));         } else {             startSplashAnim(new AlphaAnimation(1.0F, 1.0F));         }     }      /**      * 开启引导过渡动画      *      * anim      */     private void startSplashAnim(Animation anim) {         anim.setDuration(getSplashDurationMillis());         anim.setAnimationListener(new Animation.AnimationListener() {                         public void onAnimationStart(Animation animation) {             }                          public void onAnimationRepeat(Animation animation) {             }                          public void onAnimationEnd(Animation animation) {                 onSplashFinished();             }         });         mWelcomeLayout.startAnimation(anim);     }          protected void onDestroy() {         Utils.recycleBackground(mWelcomeLayout);         super.onDestroy();     } }

这个是我在用的一个简单的启动页,注意这是一个base,用你的启动页继承这个就好
主题默认颜色是白色,启动页是白色底加一个Icon,
大概逻辑是启动的时候,手机白屏,然后显示出启动页(白底+一个彩色Icon)(不会也懒得录屏发gif),
这样,APP打开以后白屏到启动页显示,就不会太突兀,给人一种彩色icon是慢慢浮现出来的效果
这里的核心是44行setContentView(mWelcomeLayout);方法,和平时不同setContentView()入参使用一个R文件中的id(int类型),
这里直接用一个View作为入参,可以减少xml加载的时间,提升加载或者渲染速度
这里setContentView在使用View作为入参时,一般会用layer-list的方法来设置样式,虽然说还是用了xml,但是先利用xml的layer-list标签方法给View设置background,然后再单独加载这个View,大部分还是可以比直接加载layout布局再快一些
比如:

<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android">     <item android:drawable=/white"/>     <item>         <bitmap android:gravity="center"                 android:src=/splash_icon"/>     </item> </layer-list>

这里分享个外链,其他大佬讲解的更清楚
Android:启动页–最佳实践

启动页过渡

AndroidManifest.xml中的application标签中设置了theme,当设置的theme是Light类型时启动白屏,当设置theme是Dark类型时启动黑屏.
首先,APP启动白屏或者黑屏,取决于设置的Theme中的设置,有些前辈的处理方式是把APP启动的黑屏或者白屏改成透明色来避免这个等待时间,但是这样用户又会有一种”这个APP打开咋这么慢,总没反应”的感觉,我个人建议还是点击就有反应,毕竟现在各厂APP也都是相同的路数,数量多也能说明这个是容易被大家接受的.

可以通过设置Theme中的windowBackground修改白色或者黑色的等待时间

APP启动的等待时间,这时候的纯色屏幕和启动页,最好是相同的底色.啥?你说你UI设计的APP主题背景色是紫色,启动页是绿色?那没办法,设计丑救不了.
比如白色过度,从白屏到白色启动页,使用淡出淡入的动画,用户只会感觉浮现出来了一个图标,或者多个内容.如果使用明显的翻页效果,那就太出戏了吧
然后启动页到首页的跳转,如果说主题色相同,用淡出淡入也挺好(比如淘宝),如果说大体颜色不相同,那么把启动页做成一个抽离的效果,也会让用户有主页权重更大的感觉,不会觉得首页只是启动页后的一个结果

总结

  1. 启动页的背景色设置和APPTheme的windowBackground颜色不要差距太大,要有能过渡的感觉
  2. 启动页中的元素与背景图片的拆分,元素与屏幕位置的适配, 在其动也中可以把手机屏幕当做一个RL父布局,元素的相对位置只要不重叠(有那么小的手机么?),就可以更好的显示内容
  3. 启动页和主页的过渡处理好,用户体验会更好
  4. 尽量使用原生适配,(autoSize等库的适配方式对启动页也有一些不友好的影响),相关内容:Android基础 – 如何做鲁棒性更高的布局

文章虎头蛇尾,凑合看吧,有空了就再丰富丰富(估计有空也懒得写了)

最近可能是新项目风口,很多人都在问启动页的适配/启动速度或者各种各样的优化,闲着没事写一篇吧

适配

首先是启动页的适配,经常有些群友在问启动页变形或者拉伸怎么办,下面用绘图软件讲一讲

Android 启动页的一些坑-多图杀猫
这里是一个微信的启动图片,红色边框是手机屏幕屏幕边界,截图手机是红米k20,屏幕长宽比为19.5比9
看起来很正常是吧,没有什么问题
如果UI基于红米K20P制作这张图片,那这张图片也是长宽比19.5比9(其实大多UI都是基于iOS的尺寸做设计图的,Android没牌面,诶)
大多数开发者都会按照UI图的基础尺寸新建一个虚拟机作为xml布局的实时预览,而启动页一般都是在xml的根布局添加一个background属性或者添加一个imageView,宽高都是match
但是如果启动页是一整张图片,运行在普通16比9或者18比9的屏幕中,就会出现下面的情况
Android 启动页的一些坑-多图杀猫
宽度没有变,但是屏幕高度变了,所以默认要把图片全部显示出来的话就会被”压扁”
当然也有人说可以给imageView添加android:scaleType=”fitCenter”或者android:scaleType=”centerCrop”
但是也会有下面的情况:
Android 启动页的一些坑-多图杀猫

Android 启动页的一些坑-多图杀猫
这两种情况就又尴尬了,虽然说第一种看起来没有问题,但那是因为这个启动图片的图标在居中的位置

Android 启动页的一些坑-多图杀猫
原谅我用一个游戏截图做说明,手机里实在没找到哪个APP的启动页有问题,上图中如果碰到小型红框的效果,那你的启动页中内容就会有一部分显示不出来,比如游戏截图中的昵称/金币和下面的导航栏等.

其实启动页也是需要适配的,目前主流方式是把启动页的零件拆散,然后根据RL或者CL布局的特性进行约束
再举例一下微信的启动页
Android 启动页的一些坑-多图杀猫
红框依旧是手机屏幕边框,这里我们把启动页分解一下,一个是黑色的background,一个是蓝框中的图片
只要设置蓝框中的imageView属性为居中+根据UI图中的宽高比设置imageView的宽高比(可以用约束布局控制宽高比或者代码计算高度)
因为黑色的background不存在拉伸变形的情况,imageView又是根据屏幕宽度计算宽高比后设置了高度,所以它始终能保证居中+宽度填充的效果

然后是小米商城的启动页
Android 启动页的一些坑-多图杀猫
这里分解一下它的布局
标号1的图片和微信图片原理相同,只是它不是居中,是从上向下顶头了
标号2的icon,可以直接沉底,水平居中然后距离底边距一个dp距离
标号3的跳过,一样是沉底,靠右然后距离底部和右边各一个dp距离

再看下淘宝的启动页,截图慢了点,能看到首页的输入栏已经显示出来了,这个是后面要说的启动页优化
Android 启动页的一些坑-多图杀猫
同样是可以看错一个图片居中
下面一个icon左右居中,保持在文字上面
下面一个文字沉底并且有个底部边距

这两个APP都避免了上面游戏截图那种过于复杂或者内容多的启动页面
实在是没找到复杂布局的启动页,谁有可以发我一下
当然了,也不是没有倔强的UI,他就是不给你做切图,并且说”人家iOS都能适配,你是不是水平不行呀?”
这种时候请你给UI穷举一下市面上Android设备的各种宽高比,而且别忘了各种小品牌机器(手机不是只有华米OV)和兼容pad类设备
然后你按照iOS的适配方法,给每种屏幕显示不一样尺寸的启动页就可以了 嘻嘻

启动页优化

这里我们分两个点说

  1. 启动速度
  2. 启动页的无感过渡

启动速度

点击APP图标以后,会先执行application中的各种初始化逻辑,关于application的优化下次再说
然后APP打开启动页,大多会根据APP主题背景色会显示白色或者黑色的等待,0.5-3S不等
这里我们能处理的是启动页的布局渲染速度,先发代码

package com.linkturing.base.base;  import android.os.Bundle; import android.view.animation.AlphaAnimation; import android.view.animation.Animation; import android.widget.LinearLayout;  import com.linkturing.base.utils.APPUtils; import com.xuexiang.xui.utils.Utils;  /**  * ================================================  * Description:  * <p>  * Created by alex on 2020/6/28 0028  * <p>  * 页面内容介绍:  * <p>  * ================================================  */ public abstract class BaseSplashActivity extends BaseActivity {     /**      * 默认启动页过渡时间      */     private static final int DEFAULT_SPLASH_DURATION_MILLIS = 500;      protected LinearLayout mWelcomeLayout;          protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         initView();         startSplash();         onCreateActivity();     }      private void initView() {         mWelcomeLayout = new LinearLayout(this);         LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);         mWelcomeLayout.setLayoutParams(params);         mWelcomeLayout.setOrientation(LinearLayout.VERTICAL); //        initSplashView(getSplashImgResId());         setViewBackground();         setContentView(mWelcomeLayout);     }      /**      * 初始化启动界面      *      *      */     private void setViewBackground() {         if (getSplashImgResId() != 0) {             mWelcomeLayout.setBackground(APPUtils.getDrawablebyResource(this, getSplashImgResId()));         }     }      /**      * 初始化启动界面背景图片      *      * 背景图片资源ID      */     protected abstract int getSplashImgResId();      /**      * activity启动后的初始化      */     protected abstract void onCreateActivity();      /**      * 启动页结束后的动作      */     protected abstract void onSplashFinished();      /**      * 启动页持续的时间      */     protected long getSplashDurationMillis() {         return DEFAULT_SPLASH_DURATION_MILLIS;     }      protected abstract boolean enableAlphaAnim();      /**      * 开启过渡      *      *      */     protected void startSplash() {         if (enableAlphaAnim()) {             startSplashAnim(new AlphaAnimation(0.2F, 1.0F));         } else {             startSplashAnim(new AlphaAnimation(1.0F, 1.0F));         }     }      /**      * 开启引导过渡动画      *      * anim      */     private void startSplashAnim(Animation anim) {         anim.setDuration(getSplashDurationMillis());         anim.setAnimationListener(new Animation.AnimationListener() {                         public void onAnimationStart(Animation animation) {             }                          public void onAnimationRepeat(Animation animation) {             }                          public void onAnimationEnd(Animation animation) {                 onSplashFinished();             }         });         mWelcomeLayout.startAnimation(anim);     }          protected void onDestroy() {         Utils.recycleBackground(mWelcomeLayout);         super.onDestroy();     } }

这个是我在用的一个简单的启动页,注意这是一个base,用你的启动页继承这个就好
主题默认颜色是白色,启动页是白色底加一个Icon,
大概逻辑是启动的时候,手机白屏,然后显示出启动页(白底+一个彩色Icon)(不会也懒得录屏发gif),
这样,APP打开以后白屏到启动页显示,就不会太突兀,给人一种彩色icon是慢慢浮现出来的效果
这里的核心是44行setContentView(mWelcomeLayout);方法,和平时不同setContentView()入参使用一个R文件中的id(int类型),
这里直接用一个View作为入参,可以减少xml加载的时间,提升加载或者渲染速度
这里setContentView在使用View作为入参时,一般会用layer-list的方法来设置样式,虽然说还是用了xml,但是先利用xml的layer-list标签方法给View设置background,然后再单独加载这个View,大部分还是可以比直接加载layout布局再快一些
比如:

<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android">     <item android:drawable=/white"/>     <item>         <bitmap android:gravity="center"                 android:src=/splash_icon"/>     </item> </layer-list>

这里分享个外链,其他大佬讲解的更清楚
Android:启动页–最佳实践

启动页过渡

AndroidManifest.xml中的application标签中设置了theme,当设置的theme是Light类型时启动白屏,当设置theme是Dark类型时启动黑屏.
首先,APP启动白屏或者黑屏,取决于设置的Theme中的设置,有些前辈的处理方式是把APP启动的黑屏或者白屏改成透明色来避免这个等待时间,但是这样用户又会有一种”这个APP打开咋这么慢,总没反应”的感觉,我个人建议还是点击就有反应,毕竟现在各厂APP也都是相同的路数,数量多也能说明这个是容易被大家接受的.

可以通过设置Theme中的windowBackground修改白色或者黑色的等待时间

APP启动的等待时间,这时候的纯色屏幕和启动页,最好是相同的底色.啥?你说你UI设计的APP主题背景色是紫色,启动页是绿色?那没办法,设计丑救不了.
比如白色过度,从白屏到白色启动页,使用淡出淡入的动画,用户只会感觉浮现出来了一个图标,或者多个内容.如果使用明显的翻页效果,那就太出戏了吧
然后启动页到首页的跳转,如果说主题色相同,用淡出淡入也挺好(比如淘宝),如果说大体颜色不相同,那么把启动页做成一个抽离的效果,也会让用户有主页权重更大的感觉,不会觉得首页只是启动页后的一个结果

总结

  1. 启动页的背景色设置和APPTheme的windowBackground颜色不要差距太大,要有能过渡的感觉
  2. 启动页中的元素与背景图片的拆分,元素与屏幕位置的适配, 在其动也中可以把手机屏幕当做一个RL父布局,元素的相对位置只要不重叠(有那么小的手机么?),就可以更好的显示内容
  3. 启动页和主页的过渡处理好,用户体验会更好
  4. 尽量使用原生适配,(autoSize等库的适配方式对启动页也有一些不友好的影响),相关内容:Android基础 – 如何做鲁棒性更高的布局

文章虎头蛇尾,凑合看吧,有空了就再丰富丰富(估计有空也懒得写了)

最近可能是新项目风口,很多人都在问启动页的适配/启动速度或者各种各样的优化,闲着没事写一篇吧

适配

首先是启动页的适配,经常有些群友在问启动页变形或者拉伸怎么办,下面用绘图软件讲一讲

Android 启动页的一些坑-多图杀猫
这里是一个微信的启动图片,红色边框是手机屏幕屏幕边界,截图手机是红米k20,屏幕长宽比为19.5比9
看起来很正常是吧,没有什么问题
如果UI基于红米K20P制作这张图片,那这张图片也是长宽比19.5比9(其实大多UI都是基于iOS的尺寸做设计图的,Android没牌面,诶)
大多数开发者都会按照UI图的基础尺寸新建一个虚拟机作为xml布局的实时预览,而启动页一般都是在xml的根布局添加一个background属性或者添加一个imageView,宽高都是match
但是如果启动页是一整张图片,运行在普通16比9或者18比9的屏幕中,就会出现下面的情况
Android 启动页的一些坑-多图杀猫
宽度没有变,但是屏幕高度变了,所以默认要把图片全部显示出来的话就会被”压扁”
当然也有人说可以给imageView添加android:scaleType=”fitCenter”或者android:scaleType=”centerCrop”
但是也会有下面的情况:
Android 启动页的一些坑-多图杀猫

Android 启动页的一些坑-多图杀猫
这两种情况就又尴尬了,虽然说第一种看起来没有问题,但那是因为这个启动图片的图标在居中的位置

Android 启动页的一些坑-多图杀猫
原谅我用一个游戏截图做说明,手机里实在没找到哪个APP的启动页有问题,上图中如果碰到小型红框的效果,那你的启动页中内容就会有一部分显示不出来,比如游戏截图中的昵称/金币和下面的导航栏等.

其实启动页也是需要适配的,目前主流方式是把启动页的零件拆散,然后根据RL或者CL布局的特性进行约束
再举例一下微信的启动页
Android 启动页的一些坑-多图杀猫
红框依旧是手机屏幕边框,这里我们把启动页分解一下,一个是黑色的background,一个是蓝框中的图片
只要设置蓝框中的imageView属性为居中+根据UI图中的宽高比设置imageView的宽高比(可以用约束布局控制宽高比或者代码计算高度)
因为黑色的background不存在拉伸变形的情况,imageView又是根据屏幕宽度计算宽高比后设置了高度,所以它始终能保证居中+宽度填充的效果

然后是小米商城的启动页
Android 启动页的一些坑-多图杀猫
这里分解一下它的布局
标号1的图片和微信图片原理相同,只是它不是居中,是从上向下顶头了
标号2的icon,可以直接沉底,水平居中然后距离底边距一个dp距离
标号3的跳过,一样是沉底,靠右然后距离底部和右边各一个dp距离

再看下淘宝的启动页,截图慢了点,能看到首页的输入栏已经显示出来了,这个是后面要说的启动页优化
Android 启动页的一些坑-多图杀猫
同样是可以看错一个图片居中
下面一个icon左右居中,保持在文字上面
下面一个文字沉底并且有个底部边距

这两个APP都避免了上面游戏截图那种过于复杂或者内容多的启动页面
实在是没找到复杂布局的启动页,谁有可以发我一下
当然了,也不是没有倔强的UI,他就是不给你做切图,并且说”人家iOS都能适配,你是不是水平不行呀?”
这种时候请你给UI穷举一下市面上Android设备的各种宽高比,而且别忘了各种小品牌机器(手机不是只有华米OV)和兼容pad类设备
然后你按照iOS的适配方法,给每种屏幕显示不一样尺寸的启动页就可以了 嘻嘻

启动页优化

这里我们分两个点说

  1. 启动速度
  2. 启动页的无感过渡

启动速度

点击APP图标以后,会先执行application中的各种初始化逻辑,关于application的优化下次再说
然后APP打开启动页,大多会根据APP主题背景色会显示白色或者黑色的等待,0.5-3S不等
这里我们能处理的是启动页的布局渲染速度,先发代码

package com.linkturing.base.base;  import android.os.Bundle; import android.view.animation.AlphaAnimation; import android.view.animation.Animation; import android.widget.LinearLayout;  import com.linkturing.base.utils.APPUtils; import com.xuexiang.xui.utils.Utils;  /**  * ================================================  * Description:  * <p>  * Created by alex on 2020/6/28 0028  * <p>  * 页面内容介绍:  * <p>  * ================================================  */ public abstract class BaseSplashActivity extends BaseActivity {     /**      * 默认启动页过渡时间      */     private static final int DEFAULT_SPLASH_DURATION_MILLIS = 500;      protected LinearLayout mWelcomeLayout;          protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         initView();         startSplash();         onCreateActivity();     }      private void initView() {         mWelcomeLayout = new LinearLayout(this);         LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);         mWelcomeLayout.setLayoutParams(params);         mWelcomeLayout.setOrientation(LinearLayout.VERTICAL); //        initSplashView(getSplashImgResId());         setViewBackground();         setContentView(mWelcomeLayout);     }      /**      * 初始化启动界面      *      *      */     private void setViewBackground() {         if (getSplashImgResId() != 0) {             mWelcomeLayout.setBackground(APPUtils.getDrawablebyResource(this, getSplashImgResId()));         }     }      /**      * 初始化启动界面背景图片      *      * 背景图片资源ID      */     protected abstract int getSplashImgResId();      /**      * activity启动后的初始化      */     protected abstract void onCreateActivity();      /**      * 启动页结束后的动作      */     protected abstract void onSplashFinished();      /**      * 启动页持续的时间      */     protected long getSplashDurationMillis() {         return DEFAULT_SPLASH_DURATION_MILLIS;     }      protected abstract boolean enableAlphaAnim();      /**      * 开启过渡      *      *      */     protected void startSplash() {         if (enableAlphaAnim()) {             startSplashAnim(new AlphaAnimation(0.2F, 1.0F));         } else {             startSplashAnim(new AlphaAnimation(1.0F, 1.0F));         }     }      /**      * 开启引导过渡动画      *      * anim      */     private void startSplashAnim(Animation anim) {         anim.setDuration(getSplashDurationMillis());         anim.setAnimationListener(new Animation.AnimationListener() {                         public void onAnimationStart(Animation animation) {             }                          public void onAnimationRepeat(Animation animation) {             }                          public void onAnimationEnd(Animation animation) {                 onSplashFinished();             }         });         mWelcomeLayout.startAnimation(anim);     }          protected void onDestroy() {         Utils.recycleBackground(mWelcomeLayout);         super.onDestroy();     } }

这个是我在用的一个简单的启动页,注意这是一个base,用你的启动页继承这个就好
主题默认颜色是白色,启动页是白色底加一个Icon,
大概逻辑是启动的时候,手机白屏,然后显示出启动页(白底+一个彩色Icon)(不会也懒得录屏发gif),
这样,APP打开以后白屏到启动页显示,就不会太突兀,给人一种彩色icon是慢慢浮现出来的效果
这里的核心是44行setContentView(mWelcomeLayout);方法,和平时不同setContentView()入参使用一个R文件中的id(int类型),
这里直接用一个View作为入参,可以减少xml加载的时间,提升加载或者渲染速度
这里setContentView在使用View作为入参时,一般会用layer-list的方法来设置样式,虽然说还是用了xml,但是先利用xml的layer-list标签方法给View设置background,然后再单独加载这个View,大部分还是可以比直接加载layout布局再快一些
比如:

<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android">     <item android:drawable=/white"/>     <item>         <bitmap android:gravity="center"                 android:src=/splash_icon"/>     </item> </layer-list>

这里分享个外链,其他大佬讲解的更清楚
Android:启动页–最佳实践

启动页过渡

AndroidManifest.xml中的application标签中设置了theme,当设置的theme是Light类型时启动白屏,当设置theme是Dark类型时启动黑屏.
首先,APP启动白屏或者黑屏,取决于设置的Theme中的设置,有些前辈的处理方式是把APP启动的黑屏或者白屏改成透明色来避免这个等待时间,但是这样用户又会有一种”这个APP打开咋这么慢,总没反应”的感觉,我个人建议还是点击就有反应,毕竟现在各厂APP也都是相同的路数,数量多也能说明这个是容易被大家接受的.

可以通过设置Theme中的windowBackground修改白色或者黑色的等待时间

APP启动的等待时间,这时候的纯色屏幕和启动页,最好是相同的底色.啥?你说你UI设计的APP主题背景色是紫色,启动页是绿色?那没办法,设计丑救不了.
比如白色过度,从白屏到白色启动页,使用淡出淡入的动画,用户只会感觉浮现出来了一个图标,或者多个内容.如果使用明显的翻页效果,那就太出戏了吧
然后启动页到首页的跳转,如果说主题色相同,用淡出淡入也挺好(比如淘宝),如果说大体颜色不相同,那么把启动页做成一个抽离的效果,也会让用户有主页权重更大的感觉,不会觉得首页只是启动页后的一个结果

总结

  1. 启动页的背景色设置和APPTheme的windowBackground颜色不要差距太大,要有能过渡的感觉
  2. 启动页中的元素与背景图片的拆分,元素与屏幕位置的适配, 在其动也中可以把手机屏幕当做一个RL父布局,元素的相对位置只要不重叠(有那么小的手机么?),就可以更好的显示内容
  3. 启动页和主页的过渡处理好,用户体验会更好
  4. 尽量使用原生适配,(autoSize等库的适配方式对启动页也有一些不友好的影响),相关内容:Android基础 – 如何做鲁棒性更高的布局

文章虎头蛇尾,凑合看吧,有空了就再丰富丰富(估计有空也懒得写了)

部分转自互联网,侵权删除联系

赞(0) 打赏
部分文章转自网络,侵权联系删除b2bchain区块链学习技术社区 » Android 启动页的一些坑-多图杀猫求职学习资料
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

b2b链

联系我们联系我们