Visionneuse d'images / de photos UIScrollView avec pagination activée et zoom

Question

OK, je pense qu'il est temps de faire un lieu officiel sur l'internet pour résoudre ce problème: Comment faire un UIScrollView photoviewer avec la pagination et le zoom. Bienvenue à mes collègues UIScrollView pirates.

J'ai un UIScrollView avec la pagination est activée, et je suis affichant UIImageViews comme le haut-app photos. (Est-ce son familier?)

J'ai trouvé la suite du projet sur github:

http://wiki.github.com/andreyvit/ScrollingMadness

Qui montre comment mettre en œuvre le zoom dans un rouleau de vue lors de la pagination est activée. Si quelqu'un d'autre essaie de tout ça, j'ai effectivement eu à supprimer l' UIScrollView sous-classe et de l'utilisation de la classe native sinon ça ne marche pas. Je pense que c'est à cause de changements dans le SDK 3.0 relatives à la façon de la faire défiler la vue intercepte les événements tactiles.

Donc, l'idée est de supprimer tous les autres points de vue lorsque vous commencer à s'éloigner, et la vue de (0, 0) dans l' scrollview, la mise à jour de l' contentsize etc. Ensuite, lorsque vous effectuez un zoom arrière à 1.0 f, il ajoute les autres vues de dos et de met les choses en ordre.

De toute façon, ce projet fonctionne parfaitement dans le simulateur, mais sur l'appareil il y a une certaine mauvaise circulation de la vue vous sont redimensionnement, qui ressemble à elle est causée par le fait de la modification de l' contentsize/offset etc. pour la vue en cours de redimensionnement. Que vous avez à faire ce déplacement de la vue sinon vous pouvez vous déplacer à gauche à travers les espaces laissés par les autres vues.

Je l'ai trouvé intéressant de noter que dans les "Problèmes Connus" de la 3.0 SDK notes de publication:

UIScrollView: Après le zoom, le contenu de l'encart est ignoré et le contenu est laissé dans la mauvaise position.

Ce genre de sons comme ce qui se passe ici. Après un zoom avant, la vue se décale à l'écran parce que vous avez changé le décalage etc.

J'ai passé des heures sur ce déjà et je suis un ralentissement à venir de la triste constat que ce n'est tout simplement pas aller travailler.

Three20 photo viewer est hors de question: il est trop lourd, le poids et il est trop inutile d'INTERFACE utilisateur et d'autres comportements.

Intégré dans l'application Photo semble faire de la magie. Si vous effectuez un zoom avant sur une image et poêle à bords, la photo se déplace indépendamment de la photo à côté de lui qui n'est pas ce que vous obtenez lorsque vous essayez cela avec une norme UIScrollView.

J'ai vu la discussion sur l'imbrication de l' UIScrollViews', mais je n'ai vraiment pas envie d'y aller.

Personne n'a réussi à la norme UIScrollView (et travaille dans la 2.2 et 3.0)? Je n'ai pas envie de rouler mes propres zoom + de rebond de + pan + pagination code.

Answer 1

Mise à JOUR

J'ai supprimé ma réponse précédente à cause de la news ci-dessous...

Grande nouvelle pour ceux qui n'ont pas entendu. Apple a publié en 2010 la WWDC session des vidéos pour tous les membres de l'iphone developer program. L'un des thèmes abordés est comment ils ont créé l'application photos!!! Ils ont construit une application similaire, étape par étape, et ont fait tout le code disponible gratuitement.

Il n'a pas l'utilisation privée de l'api. Voici un lien vers l'exemple de code de téléchargement. Vous aurez probablement besoin de vous connecter pour y avoir accès.

Cochez Cette

Et voici un lien vers l'iTunes de la WWDC page:

Cochez Cette

Answer 2

J'ai écrit un simple et facile à utiliser le navigateur de photo appelé MWPhotoBrowser. J'ai décidé de créer Three20 était trop lourd/ballonné comme j'avais besoin d'une visionneuse de photo.

MWPhotoBrowser peut afficher une ou plusieurs images, par la fourniture de UIImage des objets, ou des Url de fichiers, d'images pour le web ou des actifs de bibliothèque. La photo navigateur gère le téléchargement et la mise en cache de photos sur le web de façon transparente. Les Photos peuvent être agrandies et panoramique, et en option (personnalisable) sous-titres. Le navigateur peut également être utilisé pour permettre à l'utilisateur de sélectionner une ou plusieurs photos à l'aide soit de la grille ou principale d'affichage de l'image.

Answer 3

Vous dites que vous avez vu les discussions de nidification UIScrollViews, mais ne veulent pas y aller - mais c'est le chemin à parcourir! Il se travaille facilement et bien.

C'est essentiellement ce qu'Apple le fait dans son PhotoScroller exemple (et en 2010 de la WWDC parler liée à la réponse de Jonas). Seulement, dans ces exemples, ils ont ajouté tout un tas de complexes, de carrelage et d'autres la gestion de la mémoire. Si vous n'avez pas besoin de poser le carrelage etc. et si vous ne voulez pas passer au travers de ces exemples et d'essayer de supprimer les bits sont liées, le principe sous-jacent de nidification UIScrollViews est en fait assez simple:

• Créer un extérieur UIScrollView et définir sa pagingEnabled = true. Ajouter à votre principal d'afficher et de définir la largeur et la hauteur de votre vue principale sur la largeur et la hauteur.

• Créer autant d'intérieure UIScrollViews que vous voulez des images. Définir la largeur et la hauteur de votre vue principale sur la largeur et la hauteur. Ajouter des sous-vues à l'extérieur de UIScrollView, chaque l'un à côté de l'autre, de gauche à droite.

• Définir la taille du contenu de l'extérieur UIScrollView à la somme des largeurs de tous les intérieurs UIScrollViews côté par côté (qui est égal à [votre vue principale de la largeur d']*[plusieurs images]).

• Ajouter vos images UIImageViews à l'intérieur UIScrollViews, une UIImageView de chaque intérieur UIScrollView. Réglez chaque UIScrollView de la taille du contenu de chaque UIImageView de la taille.

• Set min et max zoom échelles pour chaque intérieur UIScrollView et régler chaque intérieur UIScrollView est délégué à votre Vue-Contrôleur. Le délégué du viewForZoomingInScrollView, de retour approprié UIImageView pour la UIScrollView qui est transmis. (Pour ce faire, il suffit de garder chacun de l'UIImageViews dans un NSArray et mettre en UIScrollView la propriété tag de l'indice de la UIImageView. Vous pouvez lire le numéro de série dans le UIScrollView passé à viewForZoomingInScrollView et retour approprié UIImageView de la NSArray).

C'est tout. Fonctionne exactement comme la photo app.

Si vous avez beaucoup de photos, pour économiser de la mémoire, vous pouvez juste avoir deux intérieure UIScrollViews et deux UIImagesViews. Vous ensuite de façon dynamique flip entre eux, déplacement de leur position au sein de l'extérieur UIScrollView et la modification de leurs images que l'utilisateur fait défiler l'extérieur UIScrollView. C'est un peu plus complexe, mais le même principe.

Answer 4

J'ai fait un peu jouer avec le natif de l'application Photos, et je pense que je peux dire avec confiance qu'ils sont à l'aide d'un seul UIScrollView. Le cadeau est ceci: un zoom sur une image, et de la tirer vers la gauche ou la droite. Vous verrez la suivante ou à la précédente photo. Si vous tirez trop fort, il sera même page à la photo suivante à 1.0 f zoom. Retourner en arrière et précédemment photo agrandie sera de retour à 1.0 f zoom.

Obivously je n'ai pas écrit les Photos.app, mais je vais prendre un sauvage deviner comment ils ont fait:

• Un seul UIScrollView et un seul UIScrollViewDelegate
• Remplir le UIScrollView avec UIImageView enfants
• Écoutez scrollViewDidScroll:
• Faire quelques calculs et de déterminer quelle page vous vous trouvez actuellement sur
• Écoutez viewForZoomingInScrollView:
• De retour d'un point de vue différent en fonction de l'index de la page
• Écoutez scrollViewDidEndZooming:withView:atScale: et éventuellement faire quelques anti-aliasing, etc basé sur le contenu

Si vous décidez d'essayer ça, laissez-moi savoir comment cela fonctionne pour vous. J'aimerais savoir comment vous finalement se présente au travail. Mieux encore, de les publier sur github.

Answer 5

J'ai fait un peu de jouer avec les native app Photos, et je pense que je peux dire avec confiance qu'ils sont à l'aide d'un seul UIScrollView. Le cadeau est ce: zoom sur une image, et tirez-le pour le la gauche ou la droite. Vous verrez suivante ou précédente photo. Si vous remorqueur assez dur, il sera même page à la photo suivante à 1.0 f zoom. Retourner en arrière et précédemment photo agrandie sera retour à 1.0 f zoom.

Ce qui est faux. Je suis aide imbriquée scrollviews, et obtenir exactement le même effet. Si vous êtes à l'aide de certains gestion de la mémoire système (que j'ai eu pour commencer à utiliser... mon numéro de page est assez élevé ('bout de 50 chaque dans 2 scrollViews)), alors vous pouvez utiliser un mécanisme similaire à ce que vous avez le déclenchement de votre page se charge / décharge pour déclencher un zoom reset pour les pages de -1 et +1 à partir de la page en cours.

Je soupçonne que apple définit cette éteint dès que le précédent pic a disparu.

Ce que je ne comprends pas est de savoir comment parvenir à défilement lisse entre les pages, il y a toujours un très court accrocher au moment de la transition. Ne l'obtenez pas. J'ai reçu assez profondément dans la fixation elle - NSInvocationOperations ont été mon premier arrêt, j'ai fait une réutilisables vue de la file d'attente pour les vues de page (qui conservent leur image de vues)... toujours cette durned accrocher.

Je n'ai qu'une NSOperationQueue en cours d'exécution, et j'ai essayé de jongler avec le nombre max d'opérations simultanées. Je pensais que le thread principal était de se obstrué par la concurrence des Files d'attente, ou peut-être même une file d'attente d'essayer de faire beaucoup... encore, l'accrocher.

J'ai même essayé de créer des super bas-qual versions de mes fichiers multimédia, dans le cas où était le problème. Avec chaque image, pesant environ 10k (ce sont des fichiers jpeg, vous l'esprit)... vous l'aurez deviné. Le hang est toujours là.

Je suis à peu près résolu à faire ce que j'ai fait avant et à l'utilisation TTPhotoViewController de Three20. J'ai passé quelques heures de natation par le biais de ce code, et c'est toujours une bonne éducation. À ce stade, cependant, je voudrais vraiment savoir où diable cette accrocher vient de, si seulement pour que je puisse passer mon ne-heures de sommeil vous demandez-vous à propos de quelque chose de moins cerveau en ébullition.