Создание иконок iOS и Android в Cordova / PhoneGap
у меня есть недавно созданный проект Cordova со следующим config.xml setup (используется инструкция из http://docs.phonegap.com/en/edge/config_ref_images.md.html). Я также добавил 2 Платформы (iOS и Android).
когда я бегу либо cordova run ios или cordova run android, проект по-прежнему имеет значки Cordova по умолчанию. Мое понимание из документации заключается в том, что Corodva должен автоматически создавать значки на основе icon.png Я поставил в config.xml.
config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.testapp" version="1.1.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>SingleApp</name>
<preference name="DisallowOverscroll" value="true" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="Fullscreen" value="false" />
<preference name="target-device" value="handset" />
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<icon src="icon.png" />
</widget>
7 ответов
Я написал скрипт, который автоматически генерирует значки для cordova с помощью ImageMagick:
https://github.com/AlexDisler/cordova-icon
чтобы использовать его, создайте значок".png " и поместите его в корневую папку вашего проекта, затем запустите:
cordova-icon
и он будет генерировать все необходимые значки для платформ вашего проекта.
вы также можете настроить его как крючок в вашем проекте cordova, чтобы значки создавались каждый раз вы создаете проект на основе значка.png вы добавили. (инструкции в README).
Если вы используете cordova 3.5.0, они обновили документы. В старых версиях мне всегда приходилось заменять значки вручную в проекте, но последняя версия cordova работает нормально.
http://cordova.apache.org/docs/en/3.5.0/config_ref_images.md.html#Icons%20and%20Splash%20Screens
Как вы можете видеть здесь https://github.com/phonegap/phonegap-cli/issues/58 это была общая проблема. Поэтому, если вы используете более старую версию cordova рекомендую обновить его командой npm update -g cordova
и после этого вы должны обновить свой конфиг.xml для чего-то вроде этого:
<icon src="www/res/drawable-xxxhdpi/icon.png" />
<platform name="android">
<icon src="www/res/drawable-ldpi/icon.png" density="ldpi" />
<icon src="www/res/drawable-mdpi/icon.png" density="mdpi" />
<icon src="www/res/drawable-hdpi/icon.png" density="hdpi" />
<icon src="www/res/drawable-xhdpi/icon.png" density="xhdpi" />
</platform>
<platform name="ios">
<!-- iOS 7.0+ -->
<!-- iPhone / iPod Touch -->
<icon src="www/res/ios/icon-60.png" width="60" height="60" />
<icon src="www/res/ios/icon-60@2x.png" width="120" height="120" />
<!-- iPad -->
<icon src="www/res/ios/icon-76.png" width="76" height="76" />
<icon src="www/res/ios/icon-76@2x.png" width="152" height="152" />
<!-- iOS 6.1 -->
<!-- Spotlight Icon -->
<icon src="www/res/ios/icon-40.png" width="40" height="40" />
<icon src="www/res/ios/icon-40@2x.png" width="80" height="80" />
<!-- iPhone / iPod Touch -->
<icon src="www/res/ios/icon.png" width="57" height="57" />
<icon src="www/res/ios/icon@2x.png" width="114" height="114" />
<!-- iPad -->
<icon src="www/res/ios/icon-72.png" width="72" height="72" />
<icon src="www/res/ios/icon-72@2x.png" width="144" height="144" />
<!-- iPhone Spotlight and Settings Icon -->
<icon src="www/res/ios/icon-small.png" width="29" height="29" />
<icon src="www/res/ios/icon-small@2x.png" width="58" height="58" />
<!-- iPad Spotlight and Settings Icon -->
<icon src="www/res/ios/icon-50.png" width="50" height="50" />
<icon src="www/res/ios/icon-50@2x.png" width="100" height="100" />
</platform>
Как вы можете видеть, URI относятся к пути проекта cordova, а не к папке www.
на config.xml настройки значков работают только со службой сборки PhoneGap. После добавления обоих платформ вам нужно вручную (или вы можете создать крюк, но я не сделал это сам) разместить иконы в правильном пути.
для iOS:
PROJECT_PATH/platforms/ios/PROJECT_NAME/Resources/icons
Для Android:
PROJECT_PATH/platforms/android/res/drawable
Android имеет много res/drawable-* папки, использовать как относится к вашему приложению, но как минимум добавить в res/drawable
cordova prepare или build или runесли вы готовы установить дополнительное программное обеспечение для генерации значков, вы можете использовать Ionic, который имеет такую функцию.
сделать следующее:
npm install ionic -g- положить png, psd или .ai файлы для иконок и / или splashscreens в
${project_location}/resources ionic resources
если вы хотите создавать значки только есть удобный ключ для этого:
ionic resources --icon
более подробная информация здесь
разве вам не нужно указать папку, в которой есть значок? Cordova заменяет значок значком по умолчанию, когда он не найден.
вы пытались заменить что-то вроде:
<icon src="res/icon.png" />
попробуйте следовать https://www.npmjs.org/package/cordova-gen-icon
пример:
$ cordova create hello com.example.hello
Creating a new cordova project with name "HelloCordova" and id "com.example.hello" at location "hello"
$ cd hello
$ cordova platform add ios
Creating ios project...
Preparing ios project
$ cordova-gen-icon
Generate cordova icons with
project: .
icon : ./www/img/logo.png
target :
generate iOS icons
Success generate icon set
небольшое объяснение для людей, которые говорят <icon src="res/icon.png" /> не работает !
вы должны поставить значок.png в обеих этих папках
имя_проекта/res/
и
имя_проекта / платформы / имя_платформы/res/
действия:
cordova create hello com.example.hello HelloWorld
cd hello
скопировать значок.png в project_name/res/
Открыть config.xml и поставить <icon src="res/icon.png" />
после этого бегите
cordova platform add android
теперь скопируйте значок.png для ... hello/platforms/android/res/
затем
cordova build android
и наконец
adb install platforms/android/build/outputs/apk/android-debug.apk
после этого вы можете увидеть на устройстве свое приложение со значком