web-dev-qa-db-fra.com

Comment centrer un vecteur pouvant être dessiné dans une liste de couches sans mettre à l'échelle

Je tente d'utiliser un VectorDrawable dans un LayerList sans mettre à l'échelle le vecteur. Par exemple:

<layer-list>
    <item Android:drawable="@color/grid_item_activated"/>
    <item Android:gravity="center" Android:drawable="@drawable/ic_check_white_48dp"/>
</layer-list>

Le tirable ic_check_white_48dp id défini comme:

<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:width="48dp"
        Android:height="48dp"
        Android:viewportWidth="24.0"
        Android:viewportHeight="24.0">
    <path
        Android:fillColor="#FFFFFFFF"
        Android:pathData="M9,16.17L4.83,12l-1.42,1.41L9,19 21,7l-1.41,-1.41z"/>
</vector>

L'effet souhaité est que l'icône de vérification soit centrée dans le calque pouvant être dessiné, sans mise à l'échelle. Le problème est que la liste de couches ci-dessus provoque la mise à l'échelle de l'icône de vérification pour l'adapter à la taille de la couche.

Je peut produire l'effet souhaité si je remplace le vecteur pouvant être dessiné avec des fichiers PNG pour chaque densité et si je modifie la liste des couches en tant que telle:

<layer-list>
    <item Android:drawable="@color/grid_item_activated"/>
    <item>
        <bitmap Android:gravity="center" Android:src="@drawable/ic_check_white_48dp"/>
    </item>
</layer-list>

Est-il possible de le faire en utilisant un VectorDrawable?

androidandroid-drawablelayer-listandroid-vectordrawable
79
ashughes

J'ai rencontré le même problème en essayant de centrer les vecteurs dessinables sur une liste en couches.

J'ai une solution de contournement, ce n'est pas exactement la même chose, mais ça fonctionne, vous devez définir une taille pour l'ensemble du dessinable et ajouter du rembourrage à l'élément vectoriel:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item>
        <shape>
            <size Android:height="120dp" Android:width="120dp"/>
            <solid Android:color="@color/grid_item_activated"/>
        </shape>
    </item>
    <item Android:top="24dp"
          Android:bottom="24dp"
          Android:left="24dp"
          Android:right="24dp"
          Android:drawable="@drawable/ic_check_white_48dp"/>
</layer-list>

La taille de la forme ci-dessus définit la taille de la totalité de l'élément imprimable, 120dp dans cet exemple, le remplissage sur le deuxième élément, 24dp dans cet exemple, centre l'image vectorielle.

Ce n'est pas la même chose que d'utiliser le gravity="center" mais sa méthode d’utilisation des vecteurs dans les API 21 et 22.

19
Nicolas Tyler

Été aux prises avec le même problème. Le seul moyen que j’ai trouvé pour résoudre ce problème et éviter d’être extensible était de définir sa taille et d’utiliser la gravité pour l’aligner:

<layer-list>
    <item Android:drawable="@color/grid_item_activated"/>
     <item
        Android:gravity="center"
        Android:width="48dp"
        Android:height="48dp"
        Android:drawable="@drawable/ic_check_white_48dp"/>
</layer-list>

J'espère que ça aide!

11
Felipe Duarte