Кордова - Адаптивные иконки на Android

У меня есть сгенерированный набор иконок с использованием Android Image Asset Studio. Тем не менее, я не знаю, как я могу установить эти значки для моего приложения в Cordova,

Следуя документации по иконкам в Cordova, мне удалось установить квадратные значки для моего проекта, используя следующий код:

<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>

Однако, скажем, в Android Oreo значки приложений имеют круглую форму, и на моем телефоне значок приложения не отображается должным образом. Значок сжимается внутри круга и имеет белый фон вокруг него.

Итак, мой вопрос: как я могу установить округленные значки, которые Image Asset Studio сгенерировал для моего проекта Cordova?

Источник

5 ответов

Решение

Ниже тестируется и работает решение по моему производственному проекту.

Скопируйте все созданные значки в res/android в корне вашего проекта (тот же уровень, что и resources или же platforms папки) и добавьте приведенную ниже конфигурацию в 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/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>

Не забудьте добавить xmlns:android="http://schemas.android.com/apk/res/android" на ваш <widget,

Удалить <icon если у вас есть в <widget => <platform => <icon

После добавления вышеуказанных изменений в ваш config.xml, удалите свою платформу Android с помощью ionic cordova platform remove android или же sudo ionic cordova platform remove android (в зависимости от настроек среды), а затем снова добавьте платформу Android ionic cordova platform add android или же sudo ionic cordova platform add android,

Создать сборку, установить и проверить результаты. Я использовал вышеуказанные конфигурации в своем производственном коде, и вот результаты:

Я надеюсь, что это поможет вам.

Источник

Этот пост SO является самым популярным среди тех, кто ищет в Google "адаптивные значки Android Cordova". Предлагаемые здесь методы, в частности ответ @VicJordan, являются полным решением. Однако следует отметить, что версия 8 Cordova Android представила собственный способ поддержки адаптивных значков, которые не требуют использования Android Asset Studio.

Вот что вам нужно сделать

  • Удалите старый стиль <icon density="?dpi" src = "path/to/icon/resource"/> заявления в config.xml файл для вашего приложения Cordova
  • Обеспечить <icon density = "?dpi" background = "path/to/icon/background"/> директива
  • Обеспечьте соответствие <icon density = "?dpi" background="path/to/icon/foreground"/> директива

где ? = l|m|h|x|xx|xxx

Вы также можете использовать цветные черные поля вместо изображений. Для получения полной информации обо всем этом обратитесь к документации Cordova 8.

Источник

Способ, как это сделать с помощью адаптивного векторного значка, следующий. Asset Studio создаст 3 файла (в платформеresиерархия) мы должны скопировать в папку в корне проекта Cordova. Давай такandroid-res/например. Файлы, которые мы ищем:ic_launcher.xml,ic_launcher_background.xmlиic_launcher_foreground.xml.

Эти файлы ресурсов должны быть добавлены вconfig.xml:

      <icon src="icon.png" platform="android" />

<platform name="android">
    <!-- Adaptive icon -->
    <resource-file src="android-res/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
    <resource-file src="android-res/ic_launcher_background.xml" target="app/src/main/res/values/ic_launcher_background.xml" />
    <resource-file src="android-res/ic_launcher_foreground.xml" target="app/src/main/res/drawable/ic_launcher_foreground.xml" />

    <!-- rest of Android platform stuff ...  -->
</platform>

Таким образом, предположим, что вы хотите использовать один и тот же значок как для обычного, так и для круглого значка. Имейте в виду, что адаптивная иконка не обязательно должна быть круглой! Это зависит от лаунчера. Адаптивные значки поддерживаются с API 26, поэтому мы должны оставить там наши значения по умолчанию/устаревшие.icon.pngв формате PNG.

Источник

Вы можете попробовать это: После выбора изображения для значка приложения в Image Asset, установите свойство Shape (находится на вкладке Legacy в Image Asset) от Square до None.

Источник 
<splash platform="android" src="package-assets/splash_320_426.png" density="ldpi" width="320" height="426" orientation="portrait"/>

Вы можете изменить Android на IOS, изменить Src="путь" на что угодно, изменить плотность на одну из известных настроек, установить ширину и высоту изображений и ориентацию. Ориентация значков не имеет значения, но всплеск и другие изображения не могут быть. Иконки установлены так:

<icon platform="android" src="package-assets/ldpi.png" density="ldpi" width="36" height="36"/>

Конечно, это происходит в config.xml, и вам не нужно размещать его внутри разделов платформы, так как вы указываете платформу в теге.

Источник
Другие вопросы по тегам