Aller au contenu

barre de progression

Featured Replies

Posté(e)

bonjour.

j'aimerais faire une barre de progression avec un pourcentage voir ici (tout en bas) mai je n'y arrive pas (je debute en php :transpi: ).

j'ai donc essayer quelque script dont celui ci c'est exactement ce que je veu mai il fo rentrer un endroi x,y (les pixel de l'ecran) ou l'on veut qu'il s'affiche et si la resolution change ça ne colle plus.

j'ai essayer de le modifier un peu mais la barre n'est plus en face du texte (elle est en dessou).

si quelqu'un pouvait m'aider.

merci

Posté(e)

gd ça veut dire gros débutant jsutement

nan sérieusement c'est le système de manipulation d'images que tu utiliuse avec PHP

il y a un tutoriel sur www.phpdebutant.org, dans la barre à gauche, le 21 : images dynamiques

je pense que c'est ce que tu cherche non?

Posté(e)

Je trouve que GD est gourmant en resource alors qu'il suffirait d'utiliser un style

ce serait plus simple.

style="background-image: url(barre.jpg);background-position-x :<? echo $pour ?>;background-position-x : 100%"

avec $pour contenant le pourcentage de la barre de progression

non ?

Posté(e)

Oui et non la le style fixe l'image d'arrière plan en fonction de la taille de l'élément ou elle est mise mais si l'élément à un width fixe par exemple 200px ca change pas en fonction de la résolution contrairement si la width est en pourcentage.

Cba

Posté(e)
  • Auteur

bon voila j'utilise la methode gd (c'est pas très lisible mais sa marche :D )

la barre

<?php
header ("Content-type: image/png");
$largeur = 102;
$hauteur = 15;
$im = ImageCreate ($largeur, $hauteur)
		or die ("Erreur lors de la création de l'image"); 
$blanc = ImageColorAllocate ($im, 255, 255, 255); // couleur du fond
$noir = ImageColorAllocate ($im, 0, 0, 0); // couleur du cadre et des chiffres
$gris = ImageColorAllocate ($im, 180, 180, 180); // couleur de la barre d'avancement

// on déssine un rectangle vide pour faire plus jolie :)
ImageRectangle ($im, 0, 0, $largeur-1, $hauteur-1, $noir);

// tracé de la barre
include "wbfhq_bestkill.php";
$rank = $bf2stats['rank'];
$score = $bf2stats['scor'];
$rank0 = 0;
$rank1 = 150;
$rank2 = 500;
$rank3 = 800;
$rank4 = 2500;
$rank5 = 5000;
$rank6 = 8000;
$rank7 = 20000;
$rank8 = 20000;
$rank9 = 50000;
$rank10 = 0;
$rank11 = 200000;
if ($rank == 0)
{
$nxtscore0 = ($score - $rank0) / ($rank1 - $rank0) * 100; // calcul du pourcentage
$pourcentage0 = round($nxtscore0, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage0, 13, $gris);
}}
else if ($rank == 1)
{
$nxtscore1 = ($score - $rank1) / ($rank2 - $rank1) * 100;
$pourcentage1 = round($nxtscore1, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage1, 13, $gris);
}}
else if ($rank == 2)
{
$nxtscore2 = ($score - $rank2) / ($rank3 - $rank2) * 100;
$pourcentage2 = round($nxtscore2, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage2, 13, $gris);
}}
else if ($rank == 3)
{
$nxtscore3 = ($score - $rank3) / ($rank4 - $rank3) * 100;
$pourcentage3 = round($nxtscore3, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage3, 13, $gris);
}}
else if ($rank == 4)
{
$nxtscore4 = ($score - $rank4) / ($rank5 - $rank4) * 100;
$pourcentage4 = round($nxtscore4, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage4, 13, $gris);
}}
else if ($rank == 5)
{
$nxtscore5 = ($score - $rank5) / ($rank6 - $rank5) * 100;
$pourcentage5 = round($nxtscore5, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage5, 13, $gris);
}}
else if ($rank == 6)
{
$nxtscore6 = ($score - $rank6) / ($rank7 - $rank6) * 100;
$pourcentage6 = round($nxtscore6, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage6, 13, $gris);
}}
else if ($rank == 7)
{
$nxtscore7 = ($score - $rank7) / ($rank8 - $rank7) * 100;
$pourcentage7 = round($nxtscore7, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage7, 13, $gris);
}}
else if ($rank == 8)
{
$nxtscore8 = ($score - $rank8) / ($rank9 - $rank8) * 100;
$pourcentage8 = round($nxtscore8, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage8, 13, $gris);
}}
else if ($rank == 9)
{
$nxtscore9 = ($score - $rank9) / ($rank10 - $rank9) * 100;
$pourcentage9 = round($nxtscore9, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage9, 13, $gris);
}}
else if ($rank == 10)
{
$nxtscore10 = ($score - $rank10) / ($rank11 - $rank10) * 100;
$pourcentage10 = round($nxtscore10, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage10, 13, $gris);
}}
else if ($rank == 11)
{
$nxtscore11 = ($score - $rank11) / ($rank12 - $rank11) * 100;
$pourcentage11 = round($nxtscore11, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage11, 13, $gris);
}}
else if ($rank == 12)
{$nxtscore12 = ($score - $rank12) / ($rank12 - $rank12) * 100;
$pourcentage12 = round($nxtscore12, 2);
for ($pourcentage=0; $pourcentage<=100; $pourcentage++) {
ImageFilledRectangle ($im, 1, 1, $pourcentage12, 13, $gris);
}}

ImagePng ($im);
?>

vous me dite s'il existe une methode plus simple parce que la sa fait beaucoup de ligne pour une petite barre :p

il ne me reste plus qua metre le pourcentage sur la barre et c'est bon :mdr2:.

Modifié par rollerman

Posté(e)
  • Auteur

bon voila ma barre est fini (enfin presque).

comment je fait pour ajouter le signe "%" ?

encore une petite question, comment je fais pour que mon image soi enregistrable ?

Modifié par rollerman

Posté(e)

En général, une barre de progression c'est un pourcentage de 0 à 1 (ou 0 à 100%).

Si tu prends une image qui fait 1px de largeur, de la couleur de la barre de progression. Et tu détermine la largeur de l'image quand le pourcentage vaut 1 (100%). Ex: 400px = 100%.

Et là, paf:

<img src="mabarre.png" width="<?php echo floor(400*$progress); ?>" alt="<?php echo round($progress*100, 2); ?> %" />

Pas besoin de GD.

Archivé

Ce sujet est désormais archivé et ne peut plus recevoir de nouvelles réponses.