Dessiner Seekbar personnalisé sur Android

Question

Je sais qu'il y a beaucoup de bibliothèques à propos de ça sur GitHub et plusieurs questions sur les débordements de pile à propos de cet argument. Mais aucun d'entre eux ne correspond à mes besoins.

J'ai juste besoin de dessiner quelque chose comme ceci:

La ligne de progression doit être jaune sans le pouce.

Merci à l'avance.

Answer 1

Vous devez créer une vue pour cela. Jetez un oeil à Android creating custom view

En outre, une solution plus facile que je peux penser est de créer une barre de progression rectangulaire qui occupes toute la largeur et de tirer au-dessus sur le milieu, le bouton de lecture

Answer 2

Vous pouvez utiliser quelque chose de similaire à ce que j'ai expliqué here. Utilisez simplement un rectangle à la place d'un cercle.

Utilisez la taille modifiée pour calculer la taille réelle du rectangle et avoir une méthode pour changer le pourcentage et recalculer la taille de votre rectangle/recréer votre chemin.

Lorsque vous modifiez le chemin, vous devez simplement appeler invalidate() pour provoquer un retrait.

Code Pseudo:

public void setProgress(float progress) { 
    this.progress = progress; 
    refreshProgressBar(); 
} 

@Override 
protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
    super.onSizeChanged(w, h, oldw, oldh); 
    this.currentW = w; 
    this.currentH = h; 
    refreshProgressBar(); 
} 

private void refreshProgressBar() { 
    path.reset(); 
    // build your clipping path using progress/currentW/currentH 
    path.close(); 
    invalidate(); 
} 

Vous pouvez faire tout avec une seule vue personnalisée ou avoir 2 vues sur le dessus de l'autre, celui qui contient le « remplissage » de la barre est clipsé avec la méthode je l'ai expliqué au dessus. Gardez à l'esprit que le découpage se produit sur le canevas. Donc, si vous utilisez une vue personnalisée, il suffit de définir l'écrêtage avant de dessiner la vue de progression et de l'enlever lorsque vous avez terminé (vous pouvez également dessiner directement la couleur dans ce cas - mais si vous avez un motif de couleur complexe). Si vous utilisez un ViewGroup de découpage comme dans le lien que je vous ai donné, vous devrez construire votre mise en page en conséquence de sorte que la vue découpée ne soit que la progression.

Si vous jouez un peu avec les mathématiques, vous pouvez également dessiner un tracé correspondant à votre travail et l'utiliser sur un rectangle de couleur au-dessus de votre mise en page. Si vous ajoutez ensemble un rectangle et un cercle, puis supprimez un cercle (utilisez OP pour ajouter/soustraire/multiplier sur le chemin), vous devez obtenir un chemin (forme) semblable à celui de votre dessin à main.

Bonne chance.