web-dev-qa-db-fra.com

Importation Android Studio SVG avec ERROR @ <masque> non prise en charge

J'ai reçu le message "ERROR@ <mask> is not supported" lorsque j'essaie d'importer du SVG avec

 Android Studio 3.0.1
Build #AI-171.4443003, built on November 10, 2017
JRE: 1.8.0_152-release-915-b08 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Mac OS X 10.12.6

Quoi qu'il en soit, importer SVG et les afficher correctement?

android-studiosvgvectorideandroid-vectordrawable
9
UmAnusorn

Solution 1

Flattern image in Sketch et utiliser ce site convertir SVG en xml pour Android

Solution 2

J'utilise nonZero au lieu de evenOdd et l'ouvre dans Sketch pour inverser l'Ordre après l'inverse, il va changer pathData et supprimer Android: fillType et tout fonctionne correctement sous Android 21+.

Solution 3 

PNG

TLDR

Après quelques recherches, j'ai découvert qu'il existait deux méthodes de propriété de règle de remplissage pour les graphiques vectoriels, les SVG, le «evenodd» et le «non nul».

J'ai ouvert l'icône SVG dans Sketch et inspecté le trou en haut de l'icône. Comme prévu, il utilise la propriété fill-rule: evenodd. Maintenant, je dois changer la règle de remplissage pour utiliser la propriété «différente de zéro». Comment? Sélectionnez le chemin. Sur le côté droit, il y a une icône de paramètres dans la propriété «Fills». Cliquez dessus et choisissez «non nul».

Dans le menu principal, choisissez Calque → Chemins → Ordre inverse. J'ai eu le trou en haut de l'icône et le trou dans l'application, aussi.

Pour plus de détail

5
UmAnusorn

Si vous ne disposez que du fichier .svg, vous pouvez manipuler le balisage .svg à la main pour supprimer le masque et appliquer un remplissage en ligne. 

Si vous travaillez avec un concepteur, vous pouvez lui demander de prendre l’icône, de retirer tout ce qui se trouve à l’intérieur du masque et d’appliquer un remplissage à l’icône. Ensuite, faites en sorte que le concepteur exporte le fichier .svg et relancez l'importation dans Android Studio. 

Lorsque l'actif que vous essayez d'importer est exporté à partir d'un logiciel de conception tel que Sketch ou autre, ET que l'icône est un masque (et non un remplissage), elle sera exportée avec cette balise. Android Studio accepte uniquement les fichiers .svg avec des remplissages (ce n'est pas un problème avec iOS)

5
velasco622

Dans mon cas, cela résultait d'une substitution de symbole dans Sketch, une technique connue permettant de changer facilement la couleur d'un symbole. Vous devez utiliser un symbole (couleur) dans un symbole (symboles imbriqués) en tant que masque. C'est le masque qui causait des problèmes.

Ma solution était simplement de créer une version d'exportation du symbole d'origine dans laquelle je supprime le masque. 

0
jessems