我目前正在尝试迁移到 Cordova 11 并掌握新的 Splash Screen API,但我发现文档在所有方面并不完全清楚。如果有人能为我指出其中一些内容的方向,我将非常感激。
生成自适应图标的最佳方法是什么?
在启动屏幕文档中,它在Android 特定文档中特别提到您可以为自适应图标创建 XML 文件:
<platform name="android">
<!-- Default -->
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/screen/android/splashscreen.xml" />
</platform>
但我不知道这个
splashscreen.xml
文件中应该包含什么内容,而且我似乎找不到任何与之相关的具体文档 - 有什么想法应该放在这里吗?我们以前从未需要创建这个,因为 config.xml
中的所有属性都足够了。
谢谢, 班格拉
为了在 cordova-android 11.0.0 应用程序中生成用于初始屏幕的 XML 文件,我在 Android Studio 中创建了一个示例 Android 应用程序,并按照 这些说明 向示例应用程序添加图标,指定了前景层成为我想要的闪屏图标的 SVG 文件。我指定背景层为白色。 然后我复制了新生成的文件
MyApplication/app/src/main/res/drawable/ic_launcher_foreground.xml
进入我的 Cordova 应用程序并将其重命名为 resources/android/splash/splashscreen.xml
。
最后,我更新了我的 Cordova 应用程序的
config.xml
文件,如下所示:
<platform name="android">
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="resources/android/splash/splashscreen.xml" />
<preference name="AndroidWindowSplashScreenBackground" value="#FFFFFF" />
</platform>
可能值得注意的是,我的图标没有以任何方式动画。
经过大量的尝试和错误,我在这方面取得了一些进展。首先,我使用 Android Studio 创建了一个自适应图标。 Livecode.com 有一个关于如何执行此操作的非常好的指南。生成资产后,这将创建一个新的
res
文件夹,其中包含以下内容:
C:\MyApplication\app\src\main\res>tree /f
Folder PATH listing for volume Windows
Volume serial number is E47A-1E3F
C:.
├───drawable
├───drawable-v24
│ ic_launcher_foreground.xml
│
├───layout
│ activity_main.xml
│
├───mipmap-anydpi-v26
│ ic_launcher.xml
│ ic_launcher_round.xml
│
├───mipmap-hdpi
│ ic_launcher.png
│ ic_launcher.webp
│ ic_launcher_foreground.png
│ ic_launcher_round.png
│ ic_launcher_round.webp
│
├───mipmap-mdpi
│ ic_launcher.png
│ ic_launcher.webp
│ ic_launcher_foreground.png
│ ic_launcher_round.png
│ ic_launcher_round.webp
│
├───mipmap-xhdpi
│ ic_launcher.png
│ ic_launcher.webp
│ ic_launcher_foreground.png
│ ic_launcher_round.png
│ ic_launcher_round.webp
│
├───mipmap-xxhdpi
│ ic_launcher.png
│ ic_launcher.webp
│ ic_launcher_foreground.png
│ ic_launcher_round.png
│ ic_launcher_round.webp
│
├───mipmap-xxxhdpi
│ ic_launcher.png
│ ic_launcher.webp
│ ic_launcher_foreground.png
│ ic_launcher_round.png
│ ic_launcher_round.webp
│
├───values
│ colors.xml
│ ic_launcher_background.xml
│ strings.xml
│ themes.xml
│
└───values-night
themes.xml
接下来,我更新了 Cordova 项目的
config.xml
文件,特别是 AndroidWindowSplashScreenAnimatedIcon 属性,以指向刚刚生成的 activity_main.xml 文件:
<platform name="android">
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/screen/android/layout/activity_main.xml" />
</platform>
最后,如果您查看 activity_main.xml 文件,它将包含一些引用 约束布局 的标记。如果您此时构建应用程序,您可能会收到如下错误:
错误:找不到属性layout_constraintBottom_toBottomOf(又名com.yjr.jinguantong:layout_constraintBottom_toBottomOf)。
您的项目似乎缺少依赖项,您可以通过打开
project.properties
并添加以下属性来添加该依赖项:
cordova.system.library.2=com.android.support.constraint:constraint-layout:1.1.3
在此 Github 问题页面 上找到了更多信息 - 当然,将其添加到 project.properties 意味着如果您删除 platforms 文件夹,则必须手动重新添加它。我无法找到一种方法来简单地添加此依赖项。我确实通过从 activity_main.xml 文件中删除一些 constraint 标记来解决这个问题。我的项目是这样构建的:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity">
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" />
</androidx.constraintlayout.widget.ConstraintLayout>
希望这对其他正在挣扎的人有帮助。
本格拉
我不确定这是否是最好的解决方案,但如果像我一样您只是想要快速简单的东西,您可以指向现有的图标文件之一(而不是新的 .xml),如下所示:
<platform name="android">
<!-- Default -->
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/android/screen/splash-port-xxxhdpi.png"/>
</platform>
我的图标文件是矩形的,在启动画面中它是圆形的,而且很小。不过,对我来说已经足够了
我终于知道xml文件里应该有什么了! 你要做的就是,用 android studio 创建一个像 Bengrah 所说的那样的图像。但是,您使用的是 .SVG 文件,而不是 .png。这会生成一个 icon.xml 文件,然后您可以将其添加到 cordova 项目中并在 config.xml 中引用。
这对于我的应用程序来说看起来仍然很糟糕。我认为让它与 pgn 一起工作可能更容易。据我现在的理解,您需要一个大小为 288dp 的正方形图标,并且图标本身需要居中并适合 192dp 的圆。 (假设你不使用背景)
我还不确定如何确保你的图像是 dp 而不是像素。或者如果这是自动完成的。
我从最大的 PNG 图像在线创建了矢量 xml 文件 使用网站 https://svg2vector.com/ 我删除了下面的所有行:
<platform name="android">
<splash density="land-hdpi" src="res/screens/android/screen-hdpi-landscape.png" />
<splash density="land-ldpi" src="res/screens/android/screen-ldpi-landscape.png" />
<splash density="land-mdpi" src="res/screens/android/screen-mdpi-landscape.png" />
<splash density="land-xhdpi" src="res/screens/android/screen-xhdpi-landscape.png" />
<splash density="port-hdpi" src="res/screens/android/screen-hdpi-portrait.png" />
<splash density="port-ldpi" src="res/screens/android/screen-ldpi-portrait.png" />
<splash density="port-mdpi" src="res/screens/android/screen-mdpi-portrait.png" />
<splash density="port-xhdpi" src="res/screens/android/screen-xhdpi-portrait.png" />
</platform>
并输入这一行:
<platform name="android">
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/screens/android/splashscreen.xml"/>
</platform>
它解决了我的问题
谢谢@Zvika,你的回答对我来说已经足够好了。我添加了 .png 而不是 .xml,还添加了背景颜色、启动画面延迟和淡入淡出。
<platform name="android">
...
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/screen/android/ic_launcher-gelb-192.png"/>
<preference name="AndroidWindowSplashScreenBackground" value="#155169" />
<preference name="SplashScreenDelay" value="1000" />
<preference name="AutoHideSplashScreen" value="true" />
<preference name="FadeSplashScreen" value="true"/>
<preference name="FadeSplashScreenDuration" value="2000"/>
...
</platform>
Livecode 创建图像资源,如本网站所示。然后创建文件夹 res/screen/android(和 ios)/
创建splashscreen.xml 文件 插入以下代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Loading...."
/>
</LinearLayout>
保存它。
终于
<preference name="AndroidWindowSplashScreenAnimatedIcon"
value="res/screen/android/splashscreen.xml" />
将此添加到配置 xml。现在开始构建