Graphiques vectoriels sous Android
Je travaille sur une application qui affiche la base de données d'images de quelqu'un d'autre. Les images qu'ils ont sont toutes des images vectorielles et peuvent être converties en n'importe quel format. Cependant, les conserver en format vectoriel est une bonne chose, car les utilisateurs voudront probablement effectuer un zoom avant étroit.
La question est de savoir s'il existe un moyen intégré d'afficher un graphique vectoriel dans Android. Le format n'a pas d'importance - nous pouvons convertir. Le format actuel que nous envisageons est le format PDF, mais étant donné qu’il n’ya pas de support natif PDF, je devrais faire quelque chose de complexe pour le rendre opérationnel (par exemple, intégrer poppler dans mon application). via le NDK). L'alternative consiste simplement à convertir les graphiques vectoriels en un format plus simple (JPG, GIF), mais je préférerais éviter cela.
Découvrez svg-Android - c'est une bibliothèque relativement nouvelle qui ne supporte que SVG Basic, mais c'est la bibliothèque utilisée pour dessiner Androidify. Il y a des exemples sur la page d’accueil sur la façon d’obtenir un Drawable d’un SVG qui semble être ce que vous cherchez.
Création de dessins vectoriels.
Je sais que cette question est ancienne, mais je suis tombé sur cette même exigence et je suis heureux d'apprendre qu'Android 5.0 prend désormais en charge les dessins vectoriels. Vous pouvez utiliser la balise <vector> et les données de chemin pour créer des dessins vectoriels. Cela fonctionne comme un charme sur API-21. Voici un exemple qui produit une image vectorielle en forme de coeur.
<!-- res/drawable/heart.xml -->
<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:height="256dp"
Android:width="256dp"
Android:viewportWidth="32"
Android:viewportHeight="32">
<!-- draw a path -->
<path Android:fillColor="#8fff"
Android:pathData="M20.5,9.5
c-1.955,0,-3.83,1.268,-4.5,3
c-0.67,-1.732,-2.547,-3,-4.5,-3
C8.957,9.5,7,11.432,7,14
c0,3.53,3.793,6.257,9,11.5
c5.207,-5.242,9,-7.97,9,-11.5
C25,11.432,23.043,9.5,20.5,9.5z" />
</vector>
Le seul problème que j'ai rencontré jusqu'à présent est que, il n'est pas inclus dans les bibliothèques de support et vous ne pouvez donc pas les utiliser dans des API plus basses. Ce qui est merveilleux, c’est que vous pouvez même animer des dessins vectoriels maintenant. Voici un exemple.
<!-- res/drawable/vectordrawable.xml -->
<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:height="64dp"
Android:width="64dp"
Android:viewportHeight="600"
Android:viewportWidth="600">
<group
Android:name="rotationGroup"
Android:pivotX="300.0"
Android:pivotY="300.0"
Android:rotation="45.0" >
<path
Android:name="v"
Android:fillColor="#000000"
Android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
</group>
</vector>
En savoir plus sur les animations vectorielles dessinées ici .
TinyLive SVG fournit un visualiseur SVG pour Android. Je n'ai pas essayé, donc je ne sais pas si c'est bon ou pas.
En lisant cette demande de bogue il semble que SVG pourrait être activé dans le navigateur - et donc vraisemblablement WebView également - dans Gingerbread. Mais puisqu'il s'agit d'une fonctionnalité possible dans les versions futures, cela ne vous aidera probablement pas beaucoup maintenant.
Regardez la BetterVectorDrawable lib avec le convertisseur SVG en VectorDrawable .
BetterVectorDrawable est l'implémentation VectorDrawable pour Android 4.0+ avec un comportement de secours configurable sur Android 5.0+.
SVG to VectorDrawable Converter est le convertisseur de lot d'images SVG en fichiers de ressources XML Android VectorDrawable. La version en ligne est ici .
Les liens pointent vers des readmes, qui fournissent suffisamment d'informations sur l'utilisation de la bibliothèque et du convertisseur.
Cette question est ancienne. Mais espérons que ma réponse aidera les futurs visiteurs ici.
Nous plaçons les fichiers VectorDrawable dans un dossier pouvant être dessiné. AnimatedVectorDrawable est également un dessinable. Par conséquent, nous plaçons également ces fichiers dans un dossier pouvant être dessiné. Vous trouverez ci-dessous des exemples des deux:
vd_omega.xml
<vector
xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:width="1536dp"
Android:height="864dp"
Android:viewportWidth="1536.0"
Android:viewportHeight="864.0">
<path
Android:name="my_vector"
Android:pathData="M 162 8
q -07 00 -41 26
q -34 27 -50 64
q -25 59 -19 117
q 07 70 53 121
q 57 63 151 62
q 87 -01 140 -66
q 46 -55 48 -142
q 01 -56 -34 -105
q -38 -52 -77 -70
l -29 -11
q 16 -01 31 -02
q 59 -01 119 -02 "
Android:strokeLineCap="round"
Android:strokeColor="#f00f"
Android:fillColor="#00000000"
Android:strokeWidth="32"
Android:trimPathEnd="0"/>
</vector>
avd_omega_animator.xml
<animated-vector
xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:aapt="http://schemas.Android.com/aapt"
Android:drawable="@drawable/vd_number8">
<target
Android:name="my_vector"
Android:animation="@animator/trimpath_animator"/>
</animated-vector>
Ensuite, vous pouvez animer en utilisant un fichier animateur comme suit:
trimpath_animator.xml
<set xmlns:Android="http://schemas.Android.com/apk/res/Android">
<objectAnimator
Android:propertyName="trimPathEnd"
Android:duration="1000"
Android:valueFrom="0"
Android:valueTo="1"
Android:repeatCount="0"
Android:repeatMode="reverse"/>
</set>
Vous pouvez avoir plusieurs animateurs dans le même fichier pour différentes propriétés.
Dans votre fichier de mise en page
activity_main.xml
<RelativeLayout
xmlna:Android="http://schemasandroid.com/apk/res/Android"
xmlna:app="http://schemasandroid.com/apk/res-auto"
xmls:tools="http:schemas.Android.com/tools"
Android:id="@+some_id"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
tools:context=".MainActivity">
<ImageView
Android:id="@+id/my_image"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:src="@drawable/avd_omega_animator"/>
</RelativeLayout>
Dans votre activité, écrivez le code suivant dans onCreate:
importer ... importer ...
public class MyActivity extends Activity{
ImageView myImage;
...
...
setContentView(R.layout.activity_main);
myImage = (ImageView)findViewById(R.id.my_image);
Drawable d = myImage.getDrawable():
if(d instance of Animatable){
d.start;
}
et voir l'amusement.
Tout comme j'ai utilisé getDrawable ci-dessus, vous pouvez également utiliser d'autres méthodes pour placer des dessins dans ImageView, comme setImageDrawable ("d"), etc.
Vous pouvez également vous reporter à "Introduction aux techniques d'animation d'icônes" de M. Alex Lockwood à l'adresse suivante:
https://www.androiddesignpatterns.com/2016/11/introduction-to-icon-animation-techniques.html
pour de bons exemples.
J'espère que je vous ai donné une réponse utile.
Tous les exemples de code que j'ai donnés ci-dessus fonctionnent. C'est aussi simple et direct.
Un auto-plug éhonté, mais peut-être que vous seriez intéressé par ribbon-vg ? C'est simple, pur Java et rapide; s'appuyant sur des techniques de pointe pour alléger le processeur dans le processus de rendu.