web-dev-qa-db-fra.com

Comment créer des dessins vectoriels pour Android?

Je suis nouveau à VectorDrawables.

Je peux voir que les vector drawables fournis par défaut avec Android studio comme ic_menu_gallery, ic_menu_camera, etc. fonctionnent très bien. J'ai donc essayé de créer mon propre vector drawables en convertissant d'abord mon png images en svg, puis en utilisant les valeurs de chemin et de remplissage pour rendre les vecteurs dessinables, c'est-à-dire que le Android:pathData a été remplacé par d et Android:fillColor pour la balise de remplissage dans les fichiers svg. Cela donnait en quelque sorte un vecteur tirable mais déformé ou semblant à la recherche.

Si je ne prends pas la bonne approche, merci de me le suggérer.

javaandroidandroid-studiosvgandroid-vectordrawable
46
theUturn

Vous pouvez utiliser Android Studio. Convertir des outils en ligne au format png en fichiers svg PNG en SVG
File - > New -> Vector Asset

You can choose Material Icon or Local SVG file

Pour SVG, la couleur peut utiliser:

  <ImageButton
    Android:layout_width="48dp"
    Android:layout_height="48dp"
    Android:id="@+id/button"
    Android:src="@drawable/ic_more_vert_24dp"
    Android:tint="@color/primary" />

Ou

imageView.setColorFilter(getResources().getColor(Android.R.color.black), PorterDuff.Mode.SRC_IN);

Peut convertir un outil en ligne SVG en PNG: coolutils

Convertir SVG en Android drawable: inloop

67
Ahmad Aghazadeh

Voici la meilleure méthode pour convertir n'importe quel png/jpg en dessin vectoriel:

  1. Télécharger le logiciel InkScape

  2. Ouvrez votre png et suivez la procédure indiquée dans le vidéo pour le convertir en svg

  3. Utilisez le SVG to Vector Drawable pour convertir le svg en vector drawable. L'autre outil svg2Android ne fonctionne pas toujours, car parfois le svg est mal converti en un vecteur pouvant être dessiné.

  4. Copiez le code dans un nouveau fichier de ressources pouvant être dessiné. Maintenant, cela peut être utilisé comme un dessin régulier.

Si vous avez déjà un svg, commencez immédiatement à l'étape 3.

35
suku

J'ai eu ce problème aussi et j'ai trouvé ce site très utile:

https://materialdesignicons.com/

Il existe de nombreuses icônes et avec "l'exportation avancée", vous pouvez facilement modifier les paramètres. Pour moi, c’était le moyen le plus rapide et le plus simple de créer un vecteur dessinable; si vous ne voulez pas télécharger le fichier, vous pouvez simplement afficher le code et le copier, non seulement en tant que vecteur, mais même en tant que SVG ou XAML. Oh et c'est gratuit :)

  1. Choisissez une icône
  2. Cliquez sur Advanced Export
  3. Modifier les paramètres
  4. Cliquez sur "View Vector Drawable" ou téléchargez-le et mettez-le dans votre projet :)
12
Annemarie Rinyu

Dans Android Studio 3.1:

Fichier -> Nouveau -> Vecteur actif

Type d'actif: Sélectionner un fichier local

Cliquez sur le chemin pour choisir un fichier .svg ou .psd

Si vous ne possédez pas d'image, accédez à Google Images, Recherche avancée d'images. Utiliser le type de fichier: fichiers SVG

2
live-love

vous pouvez créer votre propre image ou icône svg à l'aide de photoshop/illustrator et importer des fichiers vectoriels (disponible dans Android studio 2. +). parfois, son importation entraîne une image déformée si svg est complexe ou comporte de nombreux éléments, vous pouvez l’utiliser comme élément unique comme ressources vectorielles en superposant ImageViews.

2
Cowgirl

Étape 1 La première étape consiste à le convertir au format SVG - Pour le convertisseur SVG en noir et blanc, il existe de nombreux outils, mais très peu d'outils de qualité pour les couleurs conversion. https://www.autotracer.org/ est l'un des meilleurs et cela a fonctionné pour moi. Convertissez et téléchargez le fichier SVG. Étape 2 - Dans le dossier 'Android Studio', allez dans le dossier drawables et faites un clic droit pour sélectionner Nouveau - Vecteur: Actif

Étape 3 - Choisissez le fichier SVG téléchargé à l'étape 1. Le Android Studio

Étape 4 - N'oubliez pas de définir navigationView.setItemIconTintList (null); null si les icônes de couleur sont utilisées dans un tiroir/une vue de navigation.

À votre santé!!

0
kunal