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

Question

J'expérimente de nouvelles propriétés dans iOS 5 concernant UIProgressView. Elles sont:

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

Ces nouvelles propriétés permettent la personnalisation de la piste " progress " et " "image, afin que vous puissiez créer des barres de progression sophistiquées sans avoir à rouler vous-même.

Je ne peux cependant pas comprendre comment Apple " étire " les images de progression, car la documentation est un peu floconneuse/OR il y a une norme dont je ne suis pas au courant. Quoi qu'il en soit, je demande si quelqu'un peut m'aider à comprendre comment faire des progrès appropriés et suivre les images.

J'obtiens des résultats comme celui-ci lorsque je charge mes images personnalisées, quelles que soient les tailles que j'essaie:

Mes mesures sont les suivantes:

• Longueur de vue: 226 unités
• trackingImage.png: 10px
• progressImage.png: 7px

Enfin, voici mes images personnalisées:

progressImage.png

trackImage.png

Answer 1

Voici ce qui se passe:

Les images que vous fournissez au UIProgressView sont en fait déplacées vers UIImageViews, et le UIImageView étire l'image pour remplir l'espace.

Si vous faites simplement:

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

Ensuite, vous obtiendrez des résultats étranges, car il essaie d'étirer une image de 10 pixels de large pour remplir (par exemple) une vue d'image de 100 pixels de large. Cela signifie (à peu près) que chaque pixel de l'image sera répété 10 fois. Donc, si les pixels de notre image étaient:

0123456789

Ensuite, mettre cette image directement dans une vue d'image de 100px de large l'étirerait quelque chose comme ceci:

000000000011111111112222222222333333333344444444445555555555...

Voilà ce qui vous arrive.

Ce que vous vraiment voulez qu'il se produise est ceci:

01234567812345678123456781234567812345678...123456789

En d'autres termes, vous voulez que l'image ait un bord gauche de 1 point qui ne soit jamais étiré, que le centre soit en mosaïque et un bord droit de 1 point qui ne soit jamais étiré. Pour ce faire, vous devrez rendre l'image redimensionnable :

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

Si vous souhaitez que cette mosaïque soit également verticale, les inserts Edge doivent être {1, 1, 1, 1} (en supposant que vous vouliez une bordure à 1 point).

Faites de même avec progressImage, et vous obtiendrez quelque chose qui semble correct:

tl; dr:

Vos images doivent être redimensionnables.