安卓、IOS 应用设置icon和启动页

2,715 阅读3分钟

一、安卓

1、设置安卓应用的图标

安卓设置图标的方式比较简单, 只要在 app 的文件入口位置,右键选择 new Image Asset 即可 image.png

打开后选择要用的icon然后调整大小 image.png

保存后会存在res文件夹下面的 mipmap 中

2、设置安卓应用的启动页

安卓启动页简单设置

1、 将你想要作为启动页显示的图片放置在res/drawable目录下。假设图片命名为splash_image.png

2、 在res/layout目录下创建一个新的布局文件,例如activity_splash.xml,并添加一个ImageView来显示图片, 拖拽 ImageView 后点击选择图片即可

3、创建一个新的 SplashActivity.kt 用来展示启动页

package com.kalodata.kalodata_android;
import android.os.Bundle
import android.webkit.WebView
import androidx.activity.ComponentActivity
import android.os.Handler
import android.content.Intent

class SplashActivity : ComponentActivity() {
    private lateinit var webView: WebView
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_splash)
        // 设置延时跳转到主Activity,这里设置为3秒
        Handler().postDelayed({
            startActivity(Intent(this, MainActivity::class.java))
            finish()
        }, 3000)
    }
}

4、设置 AndroidMainfest.xml 文件,替换原来的 Activity, 如下

<!--          <activity-->
<!--            android:name=".MainActivity"-->
<!--            android:exported="true"-->
<!--            android:label="@string/app_name"-->
<!--            android:theme="@style/Theme.Kalodata_android" >-->
<!--            <intent-filter>-->
<!--                <action android:name="android.intent.action.MAIN" />-->

<!--                <category android:name="android.intent.category.LAUNCHER" />-->
<!--            </intent-filter>-->
<!--        </activity>-->
        <activity android:name=".SplashActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".MainActivity" android:launchMode="standard">
            <!-- 如果MainActivity之前是启动Activity,移除其intent-filter部分 -->
        </activity>

二、IOS应用

1、ios 设置icon 比较简单只需要在 Assets 中的 AppIcon 中选择 icon 即可

image.png

2、ios 启动页设置

ios 启动页设置分两种情况, 可以新建一个 Launch Screen.storyboard 拖入一个图片

image.png

image.png

然后在项目设置里面,选择启动页即可, 这种方式比较简单,但是有一个问题,就是现在手机性能都比较好,这种方式设置的启动页,会很快就消失,用户看不清

所以一般我们选择下面的方式, 或者上面的方式和下面的方式结合, 让两种方式设置的启动页长的一模一样即可无缝衔接

1、新建 SplashView 文件

image.png

SplashView.m 文件中编写代码

#import "SplashView.h"
@interface SplashView()
@property(nonatomic, strong, readwrite)UIButton *button;
@end
@implementation SplashView
-(instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if(self) {
        self.image = [UIImage imageNamed:@"icon.bundle/splash.png"];
        self.userInteractionEnabled = YES;
    }
    return self;
}
#pragma mark -
-(void)_removeSplashView{
    [self removeFromSuperview];
}
@end

2、新建 icon.bundle 文件夹 放入 splash.png

3、SceneDelegate.m 文件中,添加闪屏页面,增加一个子页面,并设置 3秒后关闭

#import "SceneDelegate.h"
#import "ViewController.h"
#import "SplashView.h"

@interface SceneDelegate ()
@end
@implementation SceneDelegate

- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
    
    UIWindowScene *windowScene = (UIWindowScene *)scene;
    self.window = [[UIWindow alloc] initWithWindowScene:windowScene];
    ViewController *launchVC = [[ViewController alloc] init];
    self.window.rootViewController    = launchVC;
    self.window.backgroundColor       = [UIColor whiteColor];
    [self.window makeKeyAndVisible];
    
    // 添加一个闪屏页面
    [self.window addSubview:({
        SplashView *splashView = [[SplashView alloc] initWithFrame: self.window.bounds];
        // 3秒后关闭这个页面
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
            // 从父视图中移除闪屏页面
            [splashView removeFromSuperview];
        });
        
        splashView;
    })];
}

- (void)sceneDidDisconnect:(UIScene *)scene {
    NSLog(@"场景已经断开连接");
// (注意,以后它可能被重新连接)
}
- (void)sceneDidBecomeActive:(UIScene *)scene {
    NSLog(@"已经从后台进入前台 ");
//(例如从应用切换器中选择场景)
}
- (void)sceneWillResignActive:(UIScene *)scene {
    NSLog(@"即将从前台进入后台");
//(例如通过切换器切换到另一个场景)
}
- (void)sceneWillEnterForeground:(UIScene *)scene {
    NSLog(@"即将从后台进入前台");
}
- (void)sceneDidEnterBackground:(UIScene *)scene {
    NSLog(@"已经从前台进入后台");
}
@end

4、上面代码设置完, 应该还是无法生效, 因为最新版本更改了视图的展示, 默认使用 Main 进行视图展示

image.png

需要在项目的设置中,对这两个设置进行删除, 让我们手动接管启动页的设置。

三、优化

详见 文章 APP 启动页开发与白屏优化