Faire un sortingangle en utilisant les définitions XML?

Est-il possible de spécifier une forme de sortingangle dans un fichier xml?

    

pouvons-nous le faire avec une forme de chemin ou quelque chose? J’ai juste besoin d’un sortingangle équilatéral.

Merci

Dans cet article, je décris comment le faire. Et voici le sortingangle de définition XML:

            

Reportez-vous à mon message si quelque chose n’est pas clair ou si vous avez besoin d’explications sur sa construction. On fait pivoter un rectangle de découpe 🙂 c’est une solution très intelligente et qui fonctionne bien.

EDIT: pour créer une flèche pointant comme -> utiliser:

 ... android:fromDegrees="45" android:toDegrees="45" android:pivotX="13%" android:pivotY="-40%" > ... 

Et pour créer une flèche pointant comme <- use:

 android:fromDegrees="45" android:toDegrees="45" android:pivotX="87%" android:pivotY="140%" > 
  

Vous pouvez obtenir ici plus d’options.

Vous pouvez utiliser le vector pour faire un sortingangle comme celui-ci

ic_sortingangle_right.xml

    

Ensuite, utilisez-le comme

  

Pour changer la couleur et la direction, utilisez android:tint et android:rotation

  

Résultat

entrer la description de l'image ici

Pour changer la forme du vecteur, vous pouvez modifier la largeur / hauteur du vecteur. Exemple changer la largeur à 10dp

  ...  

entrer la description de l'image ici

La solution de Jacek Milewski fonctionne pour moi et, en fonction de sa solution, si vous avez besoin d’un sortingangle inversé, vous pouvez utiliser ceci:

           

Je voudrais absolument aller dans la mise en œuvre d’une vue dans ce cas:

 import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.util.AtsortingbuteSet; import android.view.View; public class TriangleShapeView extends View { public TriangleShapeView(Context context) { super(context); } public TriangleShapeView(Context context, AtsortingbuteSet attrs, int defStyle) { super(context, attrs, defStyle); } public TriangleShapeView(Context context, AtsortingbuteSet attrs) { super(context, attrs); } protected void onDraw(Canvas canvas) { super.onDraw(canvas); int w = getWidth() / 2; Path path = new Path(); path.moveTo( w, 0); path.lineTo( 2 * w , 0); path.lineTo( 2 * w , w); path.lineTo( w , 0); path.close(); Paint p = new Paint(); p.setColor( Color.RED ); canvas.drawPath(path, p); } } 

Utilisez-le dans vos mises en page comme suit:

   

L’utilisation de cette implémentation vous donnera le résultat suivant:

entrer la description de l'image ici

Vous pouvez utiliser des dessins vectoriels .

Si votre API minimale est inférieure à 21, Android Studio crée automatiquement des bitmaps PNG pour ces versions inférieures au moment de la construction (voir Vector Asset Studio ). Si vous utilisez la bibliothèque de support, Android gère même les “vrais vecteurs” jusqu’à l’API 7 (plus de détails dans la mise à jour de ce post en bas).

Un sortingangle rouge pointant vers le haut serait:

       

Ajoutez-le à votre mise en page et n’oubliez pas de définir clipChildren = “false” si vous faites pivoter le sortingangle.

     

entrer la description de l'image ici

Modifiez la taille (width / height) du sortingangle en définissant les atsortingbuts Views layout_width / layout_height. De cette façon, vous pouvez également obtenir un sortingangle équilatéral si vous faites le calcul correctement.

MISE À JOUR 25.11.2017

Si vous utilisez la bibliothèque de support, vous pouvez utiliser des vecteurs réels (à la place de la création de bitmap) depuis l’API 7 . Ajoutez simplement:

 vectorDrawables.useSupportLibrary = true 

Faites votre defaultConfig dans le defaultConfig de votre module.

Ensuite, définissez le dessin (vectoriel XML) comme suit:

  

Tout est très bien documenté sur la page Vector Asset Studio .

Depuis cette fonctionnalité, je travaille entièrement sans bitmaps en termes d’icons. Cela réduit également la taille de l’APK un peu.

Voir la réponse ici: Flèches personnalisées sans image: Android

     

flèche

Puis-je vous aider sans utiliser XML?


Simplement,

Disposition personnalisée (tranche):

 import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Paint.Style; import android.graphics.Path; import android.graphics.Point; import android.util.AtsortingbuteSet; import android.view.View; public class Slice extends View { Paint mPaint; Path mPath; public enum Direction { NORTH, SOUTH, EAST, WEST } public Slice(Context context) { super(context); create(); } public Slice(Context context, AtsortingbuteSet attrs) { super(context, attrs); create(); } public void setColor(int color) { mPaint.setColor(color); invalidate(); } private void create() { mPaint = new Paint(); mPaint.setStyle(Style.FILL); mPaint.setColor(Color.RED); } @Override protected void onDraw(Canvas canvas) { mPath = calculate(Direction.SOUTH); canvas.drawPath(mPath, mPaint); } private Path calculate(Direction direction) { Point p1 = new Point(); p1.x = 0; p1.y = 0; Point p2 = null, p3 = null; int width = getWidth(); if (direction == Direction.NORTH) { p2 = new Point(p1.x + width, p1.y); p3 = new Point(p1.x + (width / 2), p1.y - width); } else if (direction == Direction.SOUTH) { p2 = new Point(p1.x + width, p1.y); p3 = new Point(p1.x + (width / 2), p1.y + width); } else if (direction == Direction.EAST) { p2 = new Point(p1.x, p1.y + width); p3 = new Point(p1.x - width, p1.y + (width / 2)); } else if (direction == Direction.WEST) { p2 = new Point(p1.x, p1.y + width); p3 = new Point(p1.x + width, p1.y + (width / 2)); } Path path = new Path(); path.moveTo(p1.x, p1.y); path.lineTo(p2.x, p2.y); path.lineTo(p3.x, p3.y); return path; } } 

Votre activité (exemple):

 import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.view.ViewGroup.LayoutParams; import android.widget.LinearLayout; public class Layout extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); Slice mySlice = new Slice(getApplicationContext()); mySlice.setBackgroundColor(Color.WHITE); setContentView(mySlice, new LinearLayout.LayoutParams( LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); } } 

Exemple de travail:

entrer la description de l'image ici


Une autre fonction de Calculate absolument simple peut vous intéresser ..

 private Path Calculate(Point A, Point B, Point C) { Path Pencil = new Path(); Pencil.moveTo(Ax, Ay); Pencil.lineTo(Bx, By); Pencil.lineTo(Cx, Cy); return Pencil; } 

Pour ceux qui veulent une flèche en forme de sortingangle rectangle, voilà:

ÉTAPE 1: Créez un fichier XML pouvant être dessiné, copiez et collez le contenu XML suivant dans votre fichier XML extractible. (Veuillez noter que vous pouvez utiliser n’importe quel nom pour votre fichier XML pouvant être dessiné. Pour mon cas, je le nomme “v_right_arrow”)

            

ÉTAPE 2: Dans le fichier XML de votre mise en page, créez une vue et associez son arrière-plan au code XML pouvant être dessiné que vous venez de créer à l’étape 1 . Pour mon cas, je lie v_right_arrow à la propriété d’arrière-plan de mon View.

   

Sortie de l’échantillon:

entrer la description de l'image ici

En espérant que ça aide, bonne chance!

            

Je n’ai jamais fait cela, mais d’après ce que j’ai compris, vous pouvez utiliser la classe PathShape: http://developer.android.com/reference/android/graphics/drawable/shapes/PathShape.html

            

Je suis en retard pour faire la fête et je suis tombé sur le même problème et Google m’a indiqué ce thread StackOverflow comme premier résultat.

J’ai essayé d’utiliser la méthode xml pour append un sortingangle et trouver un problème, à savoir que la forme du sortingangle par approche xml prend plus d’espace qu’il n’y paraît.

Voir la capture d’écran avec les limites de mise en page sur

entrer la description de l'image ici

Donc fini de faire cette classe de vue personnalisée qui peut dessiner un sortingangle de l’un des types suivants: –

  1. en pointant
  2. pointant vers le bas
  3. gauche pointant &
  4. droit pointant

asas

 package com.hiteshsahu.materialupvotewidget; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.support.annotation.NonNull; import android.util.AtsortingbuteSet; import android.view.View; public class TriangleShapeView extends View { private int colorCode = Color.DKGRAY; public int getColorCode() { return colorCode; } public void setColorCode(int colorCode) { this.colorCode = colorCode; } public TriangleShapeView(Context context) { super(context); if (isInEditMode()) return; } public TriangleShapeView(Context context, AtsortingbuteSet attrs) { super(context, attrs); if (isInEditMode()) return; } public TriangleShapeView(Context context, AtsortingbuteSet attrs, int defStyle) { super(context, attrs, defStyle); if (isInEditMode()) return; } protected void onDraw(Canvas canvas) { super.onDraw(canvas); int w = getWidth() / 2; int h = getHeight() / 2; //Choose what type of sortingangle you want here Path path = getLeftTriangle(w, h); path.close(); Paint p = new Paint(); p.setColor(colorCode); p.setAntiAlias(true); canvas.drawPath(path, p); } @NonNull /** * Return Path for down facing sortingangle */ private Path getInvertedTriangle(int w, int h) { Path path = new Path(); path.moveTo(0, 0); path.lineTo(w, 2 * h); path.lineTo(2 * w, 0); path.lineTo(0, 0); return path; } @NonNull /** * Return Path for Up facing sortingangle */ private Path getUpTriangle(int w, int h) { Path path = new Path(); path.moveTo(0, 2 * h); path.lineTo(w, 0); path.lineTo(2 * w, 2 * h); path.lineTo(0, 2 * h); return path; } @NonNull /** * Return Path for Right pointing sortingangle */ private Path getRightTriangle(int w, int h) { Path path = new Path(); path.moveTo(0, 0); path.lineTo(2 * w, h); path.lineTo(0, 2 * h); path.lineTo(0, 0); return path; } @NonNull /** * Return Path for Left pointing sortingangle */ private Path getLeftTriangle(int w, int h) { Path path = new Path(); path.moveTo(2 * w, 0); path.lineTo(0, h); path.lineTo(2 * w, 2 * h); path.lineTo(2 * w, 0); return path; } } 

Vous pouvez simplement l’utiliser en format XML comme celui-ci

   

Je sais que les solutions OP veulent dans la solution xml mais comme j’ai signalé le problème avec l’approche xml. J’espère que cela pourrait aider quelqu’un.

Vous pouvez append le sortingangle suivant en arrière-plan en utilisant le code XML suivant

       

Toute la logique de personnalisation de la conception xml se trouve dans les données de chemin. Considérez en haut à gauche comme (0,0) et concevez la mise en page selon vos besoins. Cochez cette réponse.

    

                

Google fournit un sortingangle équilatéral ici .
Choisissez VectorDrawable afin que la taille soit flexible.
Il est intégré dans Android Studio en tant que plugin.

Si vous avez une image SVG, vous pouvez l’utiliser pour la convertir en VectorDrawable.

Une fois que vous avez un VectorDrawable, changer de couleur et de rotation est facile, comme d’autres l’ont mentionné.