Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
unidocs-uni-app-x-zh
提交
687212af
U
unidocs-uni-app-x-zh
项目概览
DCloud
/
unidocs-uni-app-x-zh
通知
144
Star
2
Fork
33
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
9
列表
看板
标记
里程碑
合并请求
11
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
unidocs-uni-app-x-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
9
Issue
9
列表
看板
标记
里程碑
合并请求
11
合并请求
11
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
687212af
编写于
5月 21, 2024
作者:
D
DCloud_LXH
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
chore: manifest-splashscreen.md
上级
b6293df8
变更
1
显示空白变更内容
内联
并排
Showing
1 changed file
with
41 addition
and
40 deletion
+41
-40
docs/collocation/manifest-splashscreen.md
docs/collocation/manifest-splashscreen.md
+41
-40
未找到文件。
docs/collocation/manifest-splashscreen.md
浏览文件 @
687212af
...
@@ -25,9 +25,9 @@ uni-app x 的 app-android 平台,启动界面有以下策略:
...
@@ -25,9 +25,9 @@ uni-app x 的 app-android 平台,启动界面有以下策略:
项目的manifest.json文件中,在“App启动界面配置”中的“Android启动界面设置”项下配置各设备分辨率启动图:
项目的manifest.json文件中,在“App启动界面配置”中的“Android启动界面设置”项下配置各设备分辨率启动图:
![](
../static/splash_screen_android_1.png
)
![](
../static/splash_screen_android_1.png
)
#{width="800px"}
推荐使用
.9.png
来适配不同分辨率。
推荐使用
`.9.png`
来适配不同分辨率。
#### .9.png图@9png
#### .9.png图@9png
...
@@ -106,16 +106,13 @@ Splash是因为主界面渲染慢,给用户一个等待过渡。但注意复
...
@@ -106,16 +106,13 @@ Splash是因为主界面渲染慢,给用户一个等待过渡。但注意复
1.
如不需要splash
1.
如不需要splash
不配置启动图,在SplashScreen中配置一个小的白色Logo图。
不配置启动图,在SplashScreen中配置一个小的白色Logo图。
\
这样在所有Rom中启动都不会有splash效果。
\
这样在所有Rom中启动都不会有splash效果。
如果不在SplashScreen配置白色小图,那么在支持SplashScreen的Rom上,启动会在中间渲染App的icon图标。当然这样一个小图也不会占用太多渲染资源。
如果不在SplashScreen配置白色小图,那么在支持SplashScreen的Rom上,启动会在中间渲染App的icon图标。当然这样一个小图也不会占用太多渲染资源。
2.
如需要splash
2.
如需要splash
那么首先需要配置启动图,确保不支持SplashScreen的手机上显示这个启动图。
那么首先需要配置启动图,确保不支持SplashScreen的手机上显示这个启动图。
\
然后Google SplashScreen配置中配置背景色、居中图标和底图,在支持SplashScreen的手机上,启动封面会变成这个效果。
然后Google SplashScreen配置中配置背景色、居中图标和底图,在支持SplashScreen的手机上,启动封面会变成这个效果。
3.
如只配启动图会怎么样?
3.
如只配启动图会怎么样?
...
@@ -148,30 +145,31 @@ onReady触发时机要比onShow晚一些。
...
@@ -148,30 +145,31 @@ onReady触发时机要比onShow晚一些。
配置示例:
配置示例:
```
json
```
json
"app"
:
{
{
"app"
:
{
"splashScreen"
:
{
"splashScreen"
:
{
"autoClose"
:
"onReady"
"autoClose"
:
"onReady"
}
}
}
}
}
```
```
**注意**
::: warning 注意
-
splash关闭时机中描述的
`首页`
,指的是第一个真正显示的页面,如项目中pages.json第一个页面A在onLoad生命周期被关闭重新跳转了一个新页面B并显示,则B页面就是
`首页`
,原因是显示的是页面B,A页面并未显示,
-
splash关闭时机中描述的
`首页`
,指的是第一个真正显示的页面,如项目中pages.json第一个页面A在onLoad生命周期被关闭重新跳转了一个新页面B并显示,则B页面就是
`首页`
,原因是显示的是页面B,A页面并未显示,
如果是在页面A的onShow或更晚的生命周期关闭在跳转或直接跳转,则页面A是
`首页`
,因为页面A已经显示符合第一个真正显示的页面。
如果是在页面A的onShow或更晚的生命周期关闭在跳转或直接跳转,则页面A是
`首页`
,因为页面A已经显示符合第一个真正显示的页面。
-
splash关闭后才显示开屏广告
-
splash关闭后才显示开屏广告
:::
### 不同启动方式对splash的影响@starttype
### 不同启动方式对splash的影响@starttype
应用的启动有冷启动、温启动、切换到前台,这三种方式splash展示时间是有区别的。
应用的启动有冷启动、温启动、切换到前台,这三种方式splash展示时间是有区别的。
1.
应用冷启动
1.
应用冷启动
\
指首次启动或被kill掉进程后的启动,冷启动时初始化环境,数据加载等会占用一些启动时间,所以splash展示时间长一些。
指首次启动或被kill掉进程后的启动,冷启动时初始化环境,数据加载等会占用一些启动时间,所以splash展示时间长一些。
2.
切换至前台
2.
切换至前台
\
应用未被关闭,再次启动只是激活到前台,此时不显示splash。
应用未被关闭,再次启动只是激活到前台,此时不显示splash。
3.
温启动
3.
温启动
\
指应用的activity退出但进程仍未被手机系统回收。此时启动,由于不会再初始化环境,加载数据等操作,所以相对启动时间较少,splash展示时间也会缩短。
指应用的activity退出但进程仍未被手机系统回收。此时启动,由于不会再初始化环境,加载数据等操作,所以相对启动时间较少,splash展示时间也会缩短。
由于uni-app x默认在app.uvue里使用了uni.exit,这种退出方式只关闭了activity,没有关闭应用进程。如果rom没有回收掉App进程时再启动该App,就会触发温启动。此时splash会一闪而过。
由于uni-app x默认在app.uvue里使用了uni.exit,这种退出方式只关闭了activity,没有关闭应用进程。如果rom没有回收掉App进程时再启动该App,就会触发温启动。此时splash会一闪而过。
...
@@ -192,7 +190,9 @@ Storyboard是Apple提供的一种简化的布局界面,通过xml描述界面
...
@@ -192,7 +190,9 @@ Storyboard是Apple提供的一种简化的布局界面,通过xml描述界面
storyboard的优势是启动速度快。在App的真实首页被渲染完成前,可以快速给用户提供一个基于Storyboard的启动屏。
storyboard的优势是启动速度快。在App的真实首页被渲染完成前,可以快速给用户提供一个基于Storyboard的启动屏。
### 制作storyboard文件
### 制作storyboard文件
storyboard有两种制作方式:
storyboard有两种制作方式:
**1.**
**直接使用[模板文件(点击下载)](https://native-res.dcloud.net.cn/uni-app/file/CustomStoryboard.zip)中提供的相对常用的 storyboard 模板,可在这个文件的基础上进行自定义(不需要 Mac 及 XCode,详情请查看附件中的 readme 教程)**
**1.**
**直接使用[模板文件(点击下载)](https://native-res.dcloud.net.cn/uni-app/file/CustomStoryboard.zip)中提供的相对常用的 storyboard 模板,可在这个文件的基础上进行自定义(不需要 Mac 及 XCode,详情请查看附件中的 readme 教程)**
此 storyboard 文件适用于各种 iPhone 及 iPad 设备的横竖屏,支持自定义界面元素包括
此 storyboard 文件适用于各种 iPhone 及 iPad 设备的横竖屏,支持自定义界面元素包括
...
@@ -204,9 +204,10 @@ storyboard有两种制作方式:
...
@@ -204,9 +204,10 @@ storyboard有两种制作方式:
**2.**
使用xcode自行制作。xcode提供了可视化的制作storyboard的方式,但依赖于mac电脑。在xcode中制作storyboard的教程请自行网络搜索,请注意下面的注意事项。
**2.**
使用xcode自行制作。xcode提供了可视化的制作storyboard的方式,但依赖于mac电脑。在xcode中制作storyboard的教程请自行网络搜索,请注意下面的注意事项。
HBuilderX需要的自定义storyboard文件格式为zip压缩包,里面要求包含XCode使用的.storyboard文件,以及.stroybard文件中使用的png图,如下图所示:
HBuilderX需要的自定义storyboard文件格式为zip压缩包,里面要求包含XCode使用的.storyboard文件,以及.stroybard文件中使用的png图,如下图所示:
![](
https://img.cdn.aliyun.dcloud.net.cn/client/ask/pkg/splash/storyboard.png
)
![](
https://img.cdn.aliyun.dcloud.net.cn/client/ask/pkg/splash/storyboard.png
)
**注意事项**
::: warning 注意事项
-
zip压缩包中不要包含目录,直接包含.storyboard和.png文件
-
zip压缩包中不要包含目录,直接包含.storyboard和.png文件
-
有且只有一个.storyboard文件
-
有且只有一个.storyboard文件
-
.storyboard文件可以通过xcode生成,也可以使用任何文本编辑器修改其源码,比如对.storyboard文件点右键,使用HBuilderX打开。它本质是一个xml文件。
-
.storyboard文件可以通过xcode生成,也可以使用任何文本编辑器修改其源码,比如对.storyboard文件点右键,使用HBuilderX打开。它本质是一个xml文件。
...
@@ -215,7 +216,7 @@ HBuilderX需要的自定义storyboard文件格式为zip压缩包,里面要求
...
@@ -215,7 +216,7 @@ HBuilderX需要的自定义storyboard文件格式为zip压缩包,里面要求
-
制作 storyboard 时,
**请将图片资源直接拖到放工程中,不要放到 imageset 里面,并且图片命名要保证一定的唯一性可参考附件中的示例**
-
制作 storyboard 时,
**请将图片资源直接拖到放工程中,不要放到 imageset 里面,并且图片命名要保证一定的唯一性可参考附件中的示例**
-
XCode中创建 storyboard 文件时,
**页面元素添加约束时一定要相对于**
`Superview`
,不然启动图到 loading页面过渡时页面会跳动或者变形
-
XCode中创建 storyboard 文件时,
**页面元素添加约束时一定要相对于**
`Superview`
,不然启动图到 loading页面过渡时页面会跳动或者变形
![](
https://img.cdn.aliyun.dcloud.net.cn/client/ask/pkg/splash/xcode.png
)
![](
https://img.cdn.aliyun.dcloud.net.cn/client/ask/pkg/splash/xcode.png
)
:::
### 使用storyboard文件
### 使用storyboard文件
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录