Android -- 启动页面背景图片配置(splash)

作者:opLW
好久没写博客了,6月份结束了期末考试,又进入了忙碌而充实的秋招备战阶段。自从之前用了幕布来制作脑图,现在一发不可收拾,学点什么都要用幕布记起来?,等秋招结束了整理分享出来。
最近在做一个App,之前了解了App启动优化的一些知识,但只是简单的将背景设置为透明,这次决定自己制作一个启动页面,这不踩了不少坑,这里记录一下。

江湖规矩先上图

在这里插入图片描述

如上图为最终效果,由于没有美工MM帮忙切图,所以只有**画质?。

基础知识
  • 需要先了解启动优化的相关知识 网上关于启动优化的文章实在是太多了,这里就不分析了,不了解的同学自行谷歌。
  • 需要知道.9格式图片的制作 这里还是不提,可以自行谷歌。
如何制作呢?
  • 设置.9图片为windowBackground之后屏幕严重变形。 在刚接触启动优化时,了解到可以通过
    <item name="android:windowBackground">@drawable/bg_welcome</item>
    将.9格式的图片设置为启动页面的背景图,于是满心欢喜的就做了一张.9格式的图片,并将按上述要 求添加到App的style中,结果如下:
    在这里插入图片描述
    很是尴尬?屏幕的显示内容严重变形。

  • 解决办法 谷歌了一圈找到了解决办法

    // style.xml文件
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <!-- Customize your theme here. -->
         <item name="colorPrimary">@color/colorPrimary</item>
         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
         <item name="colorAccent">@color/colorAccent</item>
     </style>
     ==1== //创建一个新的SplashTheme继承自AppTheme
     <style name="SplashTheme" parent="AppTheme">
         <item name="colorPrimary">@color/colorPrimary</item>
         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
         <item name="colorAccent">@color/colorAccent</item>
         <item name="android:windowBackground">@drawable/bg_welcome</item>
     </style>
    // AndroidManifest.xml文件
     <application
         //......
         android:theme="@style/AppTheme">
         <activity
             //...... 
     ==2==   android:theme="@style/SplashTheme">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
         </activity>
         <activity
             android:name=".ui.LoginActivity"
             android:label="@string/app_name" />
         <activity
             android:name=".ui.DetailListActivity" />
     </application>
    // MainActivity.kt文件
     override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
    ==3== setTheme(R.style.AppTheme_NoActionBar)
          setContentView(R.layout.activity_main)
     }
    
    • 1 创建一个新的SplashTheme继承自AppTheme
    • 2 对于App启动后打开的第一个Activity,我们将它的theme设置为含有.9图片的SplashTheme
    • 前两步设置完之后,打开App会最先看到我们的.9图片。但是MainActivity的背景图片会一直保持着,而我们希望的是进入操作页面之后.9图片消失,所以就有了第三步
    • 3MainActivity.onCreate()方法内部将theme重新设置为没有背景图片的theme记住setTheme方法应该在setContentView方法之前调用,因为setContentView会确定好背景。
  • 优化操作

    • 如下图。制作.9图片时,将核心要显示的内容置于图片的中心,而四周使用透明的背景。在这里插入图片描述
      再配合shape制作一张layer-list,具体代码如下
      <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
      <item>
          <shape android:shape="rectangle">
              <solid
                  android:color="#fff"/>
          </shape>
      </item>
      <item android:gravity="center">
          <nine-patch
              android:src="@drawable/bg_welcome"
              android:tileMode="disabled" />
      </item>
      </layer-list>
      
      最后将上面这个文件设为SplashThemewindowBackground即可达到开头的效果。
  • 开头效果对应的.9图片
    在这里插入图片描述
    在适配不同分辨率时,绿色部分为可以拉伸的部分,而其他部分不会受影响。

新的认知
  • 可能大部分人跟我一样认为.9图片很神奇,可以适配不同分辨率,其实不然。(真正可以随意拉伸,分辨率不受影响的是.svg图片)。那么.9图片有什么用呢????

  • 记住一点.9格式的图片相比于普通的图片的优点,就是它指明了在需要大规模拉伸的时候,被拉动变形的部分,某种程度上解决了拉伸带来的图片严重变形的问题。(注意这里对变形的定义是:图片要显示的部分发生比率上的变化,在上面图片中来说就是人物的腿部被拉长)

  • 但是当把一张分辨率很低的.9图片置于分辨率很高的机型上时,依然会导致图片模糊,只是不会导致图片变形。所以即使是.9图片,为了适配不同分辨率的机型,依然需要制作不同分辨率的.9图片。

万水千山总是情,麻烦手下别留情。
如若讲得有不妥,文末留言告知我,
如若觉得还可以,收藏点赞要一起。

opLW原创七言律诗,转载请注明出处

发布了21 篇原创文章 · 获赞 28 · 访问量 7318

猜你喜欢

转载自blog.csdn.net/qq_36518248/article/details/95193024
今日推荐