28 votes

UIProgressView et images de suivi et de progression personnalisées (propriétés iOS 5)

Je suis expérimenter avec quelques nouvelles propriétés dans iOS 5 sur UIProgressView. Ils sont les suivants:

@property(nonatomic, retain) UIImage *progressImage;
@property(nonatomic, retain) UIImage *trackImage;

Ces nouvelles propriétés permettent la personnalisation du "progrès" et de la "piste" de l'image, de sorte que vous pouvez faire de fantaisie barres de progression sans avoir à rouler.

J'ai cependant nous ne comprenons pas comment Apple "s'étend" le progrès des images, parce que la documentation est un peu excentriques / OU il existe un certain standard, je ne suis pas au courant de. Peu importe, je demande si quelqu'un peut m'aider à comprendre comment faire des progrès appropriés de suivi et d'images.

J'obtiens des résultats comme ça, lorsque je charge mes images personnalisées, peu importe la taille j'ai essayer:

Progress Example

Mes mesures sont comme suit:

  • UIProgressView longueur: 226 unités
  • trackingImage.png: 10px
  • progressImage.png: 7px

Enfin, voici mes images personnalisées:

The Progress ImageprogressImage.png

The Tracking ImagetrackImage.png

100voto

Dave DeLong Points 156978

Voici ce qu'il se passe:

Les images que vous fournissez à l' UIProgressView sont essentiellement poussé en UIImageViews, et l' UIImageView est l'étirement de l'image pour remplir l'espace.

Si vous il suffit de faire:

[progressView setTrackImage:[UIImage imageNamed:@"track.png"]];

Ensuite, vous allez obtenir des résultats bizarres, parce que c'est en essayant d'étirer un 10px à l'échelle de l'image à remplir (par exemple) un 100px de largeur d'affichage de l'image. Cela signifie (en gros) que chaque pixel de l'image est répétée 10 fois. Donc, si les pixels de l'image ont été:

0123456789

Puis mettre l'image directement dans un 100px de largeur d'affichage de l'image va s'étirer quelque chose comme ceci:

000000000011111111112222222222333333333344444444445555555555...

C'est ce qui vous arrive.

Ce que vous vraiment voulez avoir arriver, c'est ceci:

01234567812345678123456781234567812345678...123456789

En d'autres termes, vous voulez que l'image de 1 point du bord gauche, qui n'est jamais tendu, le centre de mosaïque, et à 1 point du bord droit qui n'est jamais tendu. Pour ce faire, vous aurez besoin pour faire de l'image redimensionnable:

UIImage *track = [[UIImage imageNamed:@"track"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 1, 0, 1)];
[progressView setTrackImage:track];

Si vous souhaitez que cette tuile de façon appropriée à la verticale, le bord des encarts doivent être {1, 1, 1, 1} (en supposant que vous voulez à 1 point de la frontière).

Faire de même pour l' progressImage, et vous vous retrouvez avec quelque chose qui semble correct:

Correct progressView

tl;dr:

Vos images doivent être redimensionnables.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X