• Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法(转)


    转载: Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法   首先感谢博主分享,本文作为学习记录

    惊鸿一瞥

    微信的启动页,相信大家都不陌生。 
    不知道大家有没有发现一个现象,微信每次启动的时候,是直接进入这个启动页面。 
    我的意思是,很多应用,往往会先白屏停顿一下后再进入启动页面(Splash)。为了印证这一点,我把手机上所有的App都点了一遍。选几个例子 
    如下图: 
    微信: 
    这里写图片描述 
    斗鱼: 
    这里写图片描述 
    斗鱼和微信是直接进入了,他们的Splash页面。 
    知乎: 
    这里写图片描述 
    B站: 
    这里写图片描述 
    知乎和B站要先进入一个白屏,特别是B站,白屏后再进入的Splash页面。

    动手实现

    想一想,如果让我们自己来写一个Splash页面怎么实现?

    1. 创建SplashActivity样式,我们需要他是启动界面,固定垂直方向,全屏显示
      <activity android:name=".MainActivity" />
            <activity
                android:name=".SplashActivity"
                android:screenOrientation="portrait"
                android:theme="@style/ThemeSplash">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                    <category android:name="android.intent.category.LAUNCHER" />
                </intent-filter>
        </activity>

      2.设置主题为ThemeSplash

      <style name="ThemeSplash" parent="Theme.AppCompat.Light.NoActionBar">
            <item name="android:windowBackground">@android:color/white</item>
            <item name="android:windowNoTitle">true</item>
            <item name="android:windowFullscreen">true</item>
            <item name="windowActionBar">false</item>
             //一定要,否则有状态栏显示,不能全屏
            <item name="windowNoTitle">true</item> 
        </style>

      3.设置SplashActivity的布局文件 activity_splash.xml为背景图片的全屏显示

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@mipmap/bg_splash"
        tools:context="com.example.makeapp.SplashActivity">
    </RelativeLayout>

      4.设置SplashActivity代码,延迟2秒跳转到MainActivity

    public class SplashActivity extends AppCompatActivity {
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_splash);
            //延迟2S跳转
            new Handler().postDelayed(new Runnable() {
                @Override
                public void run() {
                    Intent intent = new Intent(SplashActivity.this, MainActivity.class);
                    startActivity(intent);
                    finish();
                }
            }, 2000);
        }
    }

    这里写图片描述 
    糟糕,出现了白屏。 
    而且不止这个应用,把以前写的几个应用都打开看了下,都有出现黑白屏的现象,斗鱼不闪屏

    看看斗鱼怎么做的

    使用apktool打开斗鱼

    >E:
    >cd E:Android反编译apktool                                                                                                                                                                                      
    E:Android反编译apktool>apktool d E:AndroidBlogdouyu.apk    

    先看他的配置清单文件

    <activity android:name="tv.douyu.view.activity.SplashActivity"
            android:screenOrientation="portrait" android:theme="@style/Theme.AppLauncher">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    因为是程序入口,很快找到,使用了Android:theme="@style/Theme.AppLauncher",那么看看他的样式Theme.AppLauncher怎么实现的

     <style name="Theme.AppLauncher" parent="@android:style/Theme.NoTitleBar.Fullscreen">
            <item name="android:windowBackground">@drawable/bg_splash</item>
        </style>

    **看到这里,我们发现他居然把@drawable/bg_splash设置成了窗口背景,而这张叫bg_splash的图片就是他们的启动图片(我们的App已经拿过来用了),继续往下看 。 
    找到他的SplashActivity布局文件,在他的res目录,根据命名规则他多半使用splash做关键字,搜索 
    这里写图片描述
    打开

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    
        <RelativeLayout
             android:id="@id/ad_layout"
             android:layout_width="fill_parent"
                android:layout_height="fill_parent"
             android:visibility="gone">
    
            <ImageView
                android:id="@id/ad_img"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:scaleType="centerCrop" />
        
            <RelativeLayout
                android:id="@id/btn_skip"
                android:layout_width="fill_parent"
                android:layout_height="64.0dip"
                android:layout_alignParentBottom="true"
                android:background="#4f333333"
                android:paddingLeft="24.0dip"
                android:paddingRight="18.0dip">
        
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_centerVertical="true"
                    android:src="@drawable/splash_ad_logo" />
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_toLeftOf="@id/start_arrow_iv"
                    android:text="进入 "
                    android:textColor="@color/text_color_white"
                    android:textSize="15.0sp" />
        
                <ImageView
                    android:id="@id/start_arrow_iv"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:src="@drawable/start_icon_anim" />
            </RelativeLayout>
        </RelativeLayout>
    </LinearLayout>

    几个关键词 进入 、@drawable/start_icon_anim@drawable/splash_ad_logo这不就是最开始,进入的广告页面么: 
    这里写图片描述
    只不过,他的这张图的大图背景,没有配置,很可能是网络获取的。

    到这里,我们大致已经清楚了,斗鱼启动是怎么个逻辑

    1. 把启动图bg_splash设置为窗体背景,避免刚刚启动App的时候出现,黑/白屏
    2. 设置为背景bg_splash显示的时候,后台负责加载资源,同时去下载广告图,广告图下载成功或者超时的时候显示SplashActivity的真实样子
    3. 随后进入MainAcitivity 
      据我观察,淘宝启动的时候和斗鱼逻辑是一样的,有兴趣可以探究下。 
      到这里,偷师成功,我们可以回来改自己的程序了。
     <style name="ThemeSplash" parent="Theme.AppCompat.Light.NoActionBar">
            <item name="android:background">@mipmap/bg_splash</item>
            <item name="android:windowNoTitle">true</item>
            <item name="android:windowFullscreen">true</item>
            <item name="windowActionBar">false</item>
            <item name="windowNoTitle">true</item>
        </style>

    这里写图片描述 
    好的已经不闪屏了。

    为什么会这样

    最后,思考一下这个问题,为什么会出现这种情况,在启动Acitivty的onCreate()方法里面,执行setContentView(R.layout.activity_splash);出现白屏。 
    设想,onCreate---setContentView这个并不是发生在,窗体绘制的第一步,系统会在执行这个步骤之前,先绘制窗体,这时候布局资源还没加载,于是就使用默认背景色。

    <style name="ThemeSplash" parent="Theme.AppCompat.Light">

    这种亮色系,造成白色闪屏

    <style name="ThemeSplash" parent="ThemeOverlay.AppCompat.Dark">

    这种暗色系主题,造成了黑色闪屏

    使用方法:

    将下面的代码放入到工程下的style.xml  ,记得将下面的@mipmap/bg_splash 图片改成自己app的图片

    <style name="ThemeSplash" parent="Theme.AppCompat.Light.NoActionBar">
            <item name="android:background">@mipmap/bg_splash</item>
            <item name="android:windowNoTitle">true</item>
            <item name="android:windowFullscreen">true</item>
            <item name="windowActionBar">false</item>
            <item name="windowNoTitle">true</item>
        </style>

    然后将启动页面的theme改成上面的style ,就ok了~

    <activity
          android:name=".activity.WelcomeActivity"
          android:configChanges="screenSize|keyboardHidden|orientation"
          android:theme="@style/ThemeSplash">
           <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>
    </activity>

    代码地址:https://github.com/zhouruikevin/makeapp

  • 相关阅读:
    设计模式-单例模式
    Java对象声明时:new与null的区别
    Mysql的UseAffectedRows问题 以及其他常见配置说明
    将form表单元素的值序列化成对象
    idea教程视频以及常用插件整理
    Ajax获取Response头信息
    BootstrapTable返回结果集递增序号
    mybaitis动态sql利用bind标签代替%拼接完成模糊查询
    Numpy库使用
    基于socket实现websocket服务
  • 原文地址:https://www.cnblogs.com/woaixingxing/p/6438484.html
Copyright © 2020-2023  润新知