只是想知道是否有人能够在Cordova for Android Oreo上设置自适应图标?我正在使用android 6.4.0,我的方形图标缩小以适应圆圈。我只是想让它不缩水。我不在乎是否将圆角从圆角上剪下来。
我按照https://developer.android.com/studio/write/image-asset-studio.html#create-adaptive中的描述创建了图标,将它们复制到res/android
并使用以下配置:
config.xml文件:
<widget ... xmlns:android="http://schemas.android.com/apk/res/android">
<platform name="android">
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
<resource-file src="res/android/drawable/ic_launcher_background.xml" target="app/src/main/res/drawable/ic_launcher_background.xml" />
<resource-file src="res/android/drawable/ic_launcher_foreground.xml" target="app/src/main/res/drawable/ic_launcher_foreground.xml" />
<resource-file src="res/android/mipmap-anydpi-v26/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
<resource-file src="res/android/mipmap-anydpi-v26/ic_launcher_round.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<resource-file src="res/android/mipmap-hdpi/ic_launcher.png" target="app/src/main/res/mipmap-hdpi/ic_launcher.png" />
<resource-file src="res/android/mipmap-hdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_round.png" />
<resource-file src="res/android/mipmap-mdpi/ic_launcher.png" target="app/src/main/res/mipmap-mdpi/ic_launcher.png" />
<resource-file src="res/android/mipmap-mdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_round.png" />
<resource-file src="res/android/mipmap-xhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher.png" />
<resource-file src="res/android/mipmap-xhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_round.png" />
<resource-file src="res/android/mipmap-xxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher.png" />
<resource-file src="res/android/mipmap-xxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png" />
<resource-file src="res/android/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher.png" />
<resource-file src="res/android/mipmap-xxxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png" />
</platform>
</widget>
因此,虽然上述答案帮助我得到了答案,但它们要么过时,要么不完整。所以,为了帮助任何前进的人,这是我能想到的所有细节的完整答案。
第1步:创建图标
您将要使用Image Asset Studio(https://developer.android.com/studio/write/image-asset-studio)执行此操作。这方面有很多指南。
第2步:将图标移动到离子/ cordova项目
将整个res
文件夹复制到您的项目中。以下示例适用于离子v1。
cp -a AndroidStudioProjects/MyApplication4/app/src/main/res MyIonicProject/myapp/resources/android/adaptiveicon
第3步:编辑config.xml
首先,要使用图标(其他答案中缺少这些图标),您需要更改顶部的widget
线。你想要添加xmlns:android="schemas.android.com/apk/res/android"
,所以看起来如下所示。这允许系统更改AndroidMenifest.xml
文件。
<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:android="schemas.android.com/apk/res/android" xmlns:cdv="http://cordova.apache.org/ns/1.0">
接下来,您需要调整config.xml
的平台部分。
首先从<icon density= ... />
部分删除任何<platform name="android">
实例。
然后,添加对Android Manifest
文件的更改:
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
最后,对于新resources/android/adaptiveicon
文件夹中的每个文件,您需要添加如下所示的行:
<resource-file src="resources/android/adaptiveicon/<folder>/<file>" target="app/src/main/res/<folder>/<file>" />
确保每个文件都有代表!您的最终platform
部分可能看起来像这样(此示例适用于将PNG用于前景和背景时):
<platform name="android">
<allow-intent href="market:*" />
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
<resource-file src="resources/android/adaptiveicon/drawable/ic_launcher_background.xml" target="app/src/main/res/drawable/ic_launcher_background.xml" />
<resource-file src="resources/android/adaptiveicon/drawable-v24/ic_launcher_foreground.xml" target="app/src/main/res/drawable-v24/ic_launcher_foreground.xml" />
<resource-file src="resources/android/adaptiveicon/mipmap-anydpi-v26/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
<resource-file src="resources/android/adaptiveicon/mipmap-anydpi-v26/ic_launcher_round.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher.png" target="app/src/main/res/mipmap-hdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher.png" target="app/src/main/res/mipmap-mdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png" />
</platform>
第4步:安全播放,清理Android平台
运行以下命令清理平台。
cd myapp
rm -rf platforms/android
ionic cordova prepare
为了更好的衡量,使用离子的Android模拟器启动修复错误:
wget https://raw.githubusercontent.com/gegenokitaro/cordova-android/8d497784ac4a40a9689e616cd486c4ed07d3e063/bin/templates/cordova/lib/emulator.js -O platforms/android/cordova/lib/emulator.js
第5步:构建!
建立:
ionic cordova build android
或模仿:
ionic cordova emulate android --consolelogs --serverlogs --target "Android8"
现在,Cordova Android 8.0.0支持此功能。参见announcement和documentation。
例如,在config.xml中按如下方式定义图标:
<platform name="android">
<resource-file src="res/icons/android/colors.xml" target="/app/src/main/res/values/colors.xml" />
<icon density="ldpi" background="@color/background" foreground="res/icons/android/ldpi-foreground.png" />
<icon density="mdpi" background="@color/background" foreground="res/icons/android/mdpi-foreground.png" />
<icon density="hdpi" background="@color/background" foreground="res/icons/android/hdpi-foreground.png" />
<icon density="xhdpi" background="@color/background" foreground="res/icons/android/xhdpi-foreground.png" />
<icon density="xxhdpi" background="@color/background" foreground="res/icons/android/xxhdpi-foreground.png" />
<icon density="xxxhdpi" background="@color/background" foreground="res/icons/android/xxxhdpi-foreground.png" />
</platform>
colors.xml看起来像这样:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="background">#FFFFFF</color>
</resources>
据我所知,Cordova尚未设置自适应图标。但是在运行Cordova构建之后,手动完成很容易。
将AndroidManifest.xml中的android:icon更改为:
<application android:hardwareAccelerated="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:supportsRtl="true">
使用以下命令在res / drawable中创建ic_launcher.xml:
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@drawable/ic_launcher_background"/>
<foreground android:drawable="@drawable/ic_launcher_foreground"/>
</adaptive-icon>
然后在res / drawable中添加两个矢量文件ic_launcher_background.xml和ic_launcher_foreground.xml。这些可以使用此工具创建:http://inloop.github.io/svg2android/
你走吧!我希望科尔多瓦很快把它加入到它们的构建中。
所以这里是Ionic v4和Cordova Android的更新:6.4.0。 0x6368656174
答案的显着变化是:
app/src/main
。values
文件夹中(我没有前景,因为我使用了png)edit-config
Manifest文件位置在file="AndroidManifest.xml"
的同一目录中我挣扎了几天,但这对我有用:
config.xml中
<widget ... xmlns:android="http://schemas.android.com/apk/res/android">
<platform name="android">
<resource-file src="resources/android/values/ic_launcher_background.xml" target="res/values/ic_launcher_background.xml" />
<resource-file src="resources/android/mipmap-anydpi-v26/ic_launcher.xml" target="res/mipmap-anydpi-v26/ic_launcher.xml" />
<resource-file src="resources/android/mipmap-anydpi-v26/ic_launcher_round.xml" target="res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<resource-file src="resources/android/mipmap-hdpi/ic_launcher.png" target="res/mipmap-hdpi/ic_launcher.png" />
<resource-file src="resources/android/mipmap-hdpi/ic_launcher_round.png" target="res/mipmap-hdpi/ic_launcher_round.png" />
<resource-file src="resources/android/mipmap-mdpi/ic_launcher.png" target="res/mipmap-mdpi/ic_launcher.png" />
<resource-file src="resources/android/mipmap-mdpi/ic_launcher_round.png" target="res/mipmap-mdpi/ic_launcher_round.png" />
<resource-file src="resources/android/mipmap-xhdpi/ic_launcher.png" target="res/mipmap-xhdpi/ic_launcher.png" />
<resource-file src="resources/android/mipmap-xhdpi/ic_launcher_round.png" target="res/mipmap-xhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/mipmap-xxhdpi/ic_launcher.png" target="res/mipmap-xxhdpi/ic_launcher.png" />
<resource-file src="resources/android/mipmap-xxhdpi/ic_launcher_round.png" target="res/mipmap-xxhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/mipmap-xxxhdpi/ic_launcher.png" target="res/mipmap-xxxhdpi/ic_launcher.png" />
<resource-file src="resources/android/mipmap-xxxhdpi/ic_launcher_round.png" target="res/mipmap-xxxhdpi/ic_launcher_round.png" />
<edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
</platform>
</widget>
表示不快
我可能迟到了,但我努力让这个工作,因为(a)使用PhoneGap Build,(b)手工做,而不是使用Android Studio。所以,对于那些在家里玩的人来说,这就是我需要做的就是让自适应图标工作:
<platform name="android">
里面的config.xml
,我设置: <resource-file src="www/pwa/android/icon-bg.png" target="app/src/main/res/mipmap/ic_bg.png" />
<resource-file src="www/pwa/android/icon-fg.png" target="app/src/main/res/mipmap/ic_fg.png" />
<resource-file src="www/pwa/ic/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap/ic_launcher.png" />
<resource-file src="www/pwa/ic/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap/ic_launcher_round.png" />
<resource-file src="www/pwa/android/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
<resource-file src="www/pwa/android/ic_launcher_round.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<!-- Per https://forums.adobe.com/thread/2576077 -->
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
ic_launcher.xml
和ic_launcher_round.xml
的XML文件是相同的,我只是在源位置创建了此文件,并通过上面的资源标记将其复制。这是这两个XML文件的内容,引用为src public/pwa/android/ic_launcher.xml
和ic_launcher_round.xml
:<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@mipmap/ic_bg"/>
<foreground android:drawable="@mipmap/ic_fg"/>
</adaptive-icon>
注意我的目标是phonegap ver 8.1.1(<preference name="phonegap-version" value="cli-8.1.1" />
)https://forums.adobe.com/thread/2576077的帖子有助于阐明你必须在target
标签上使用不同的<resource-file
路径这一事实,具体取决于你使用的cli
版本。
希望这会有所帮助,如果我错过了什干杯!
最近的Android使用自适应图标,其中包含背景和前景图像以及一些xml文件。这就是我在离子应用程序中设置自适应图标所做的工作:
config.xml
,我将android-minSdkVersion
设置为26版。<preference name="android-minSdkVersion" value="26" />
<preference name="android-targetSdkVersion" value="28" />
config.xml
中,删除icon density
标签并删除这些行: <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
my-app/resources/android/adaptiveicon/
adaptiveicon
文件夹中的每个文件都正确链接在此处,否则在构建期间会抛出“未找到”错误。 <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" />
</edit-config>
<resource-file src="resources/android/adaptiveicon/mipmap-anydpi-v26/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
<resource-file src="resources/android/adaptiveicon/mipmap-anydpi-v26/ic_launcher_round.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher.png" target="app/src/main/res/mipmap-hdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher.png" target="app/src/main/res/mipmap-mdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_background.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_background.png" />
<resource-file src="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_foreground.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png" />
而已。现在该应用程序将具有自适应图标。
您首先需要将Cordova更新到7.0。 Cordova 7.0支持Android Oreo。使用Cordova 7创建应用程序后,您必须使用本机Android代码手动创建自适应图标。这个Medium blog将帮助你。一旦你创建了Adaptive Icons,就可以将它们添加到你的config.xml
中 -
<platform name="android">
<!--
ldpi : 36x36 px
mdpi : 48x48 px
hdpi : 72x72 px
xhdpi : 96x96 px
xxhdpi : 144x144 px
xxxhdpi : 192x192 px
-->
<icon src="res/android/ldpi.png" density="ldpi" />
<icon src="res/android/mdpi.png" density="mdpi" />
<icon src="res/android/hdpi.png" density="hdpi" />
<icon src="res/android/xhdpi.png" density="xhdpi" />
<icon src="res/android/xxhdpi.png" density="xxhdpi" />
<icon src="res/android/xxxhdpi.png" density="xxxhdpi" />
</platform>