UIImageView / UIScrollView forçant un format d'image fixe pour s'adapter à l'écran

Je fais une simple application pour iPad qui se compose d'un géant de l'image que vous pouvez effectuer un zoom in/out sur et à naviguer.

Cette image est placée à l'intérieur d'un UIImageViewqui est ensuite placé à l'intérieur d'un UIScrollView.

La navigation et de zoom à 100% d'accord; cependant, l'image est chargée fixe à un rapport d'aspect de l'écran, et ne changera jamais (même lorsque le zoom-in).

J'ai le sentiment que l'Interface Builder est la définition de certains biens que je ne suis pas au courant, mais j'ai essayé tout ce que je peux penser de résoudre ce problème.

Le Problème:

Lors de l'application du chargement initialement, le contenu à l'intérieur de la UIScrollView est automatiquement redimensionné pour ajuster l'écran de l'iPad par le rapport d'aspect a changé./fixe; l'image réelle est grand (plus grand que l'iPad résolution). Cette échelle aspect ratio demeure même lorsque le zoom sur l'image, et les causes de l'image à regarder tendu.

Peu importe ce que j'essaie, je ne peux pas arrêter l'iPad automatiquement changer la taille de mon image. Je veux simplement l'application à lancer avec mon image s'affiche normalement (zoom 100%) sur l'iPad, avec la partie qui actuellement s'inscrit sur l'écran de l'iPad étant le coin supérieur gauche de l'image.

Ce que j'ai essayé de résoudre le problème:

J'ai essayé de changer les UIImageView's contenu mode dans Interface Builder "en Haut à Gauche". Cela semblait fonctionner parfaitement, mais ensuite j'ai réalisé que la UIScrollView ne serait pas vous laisser défiler autour de l'image passé l'affichage initial de la partie (en haut à gauche). Vous pourriez faire un zoom avant sur la partie supérieure gauche de la portion et de défilement, mais jamais passé ce qui était d'abord montré sur l'écran.

Code:

Voici le code que j'utilise pour la configuration de la vue. imageScrollView est le UIScrollViewet imageView est le UIImageView. Ils sont à la fois IBOutlets.

   //Set the needed attributes of the imageView
    [imageView setImage:[UIImage imageNamed: @"TestImage.png"]];
    imageView.userInteractionEnabled = YES;

    //Set a bunch of the imageScrollView attributes.

    //calculate minimum scale to perfectly fit image width, and begin at that scale
    float minimumScale = [imageScrollView frame].size.width  / [imageView frame].size.width;
    [imageScrollView setMinimumZoomScale:minimumScale];
    [imageScrollView setZoomScale:1];
    [imageScrollView setMaximumZoomScale:10];
    [imageScrollView setContentSize:CGSizeMake(imageView.frame.size.width, imageView.frame.size.height)];
    [imageScrollView setScrollEnabled:YES];
    [imageScrollView setUserInteractionEnabled:YES];
    imageScrollView.clipsToBounds = YES;
    imageScrollView.bounces = FALSE;
    imageScrollView.bouncesZoom = FALSE;

J'ai également deux UIGestureRecongizers à la poignée du robinet-zoom, mais je ne crois pas qu'ils sont le problème. Quand j'en commentaires, rien ne change.

Toute aide serait extrêmement apprécié.

source d'informationauteur AlexFZ

16

J'ai corrigé!

Pour toute autre personne ayant le même problème, voici comment j'ai corrigé le code:

La Cause de la correction d'un bug de l'Interface Builder a été de forcer le point de vue de l'utilisation de la ScaleToFill contentMode. Réglage de la ScrollView's contentMode à UIViewContentModeScaleAspectFit ne fonctionne pas sur son propre, depuis la imageView était encore d'être déformée.

Le Correctif:

Le code suivant devait être ajouté à la fin de l'installation pour les UIScrollView et UIImageView (à l'intérieur de la viewDidLoad() méthode):
```
    [imageScrollView setContentMode:UIViewContentModeScaleAspectFit];
    [imageView sizeToFit];
    [imageScrollView setContentSize:CGSizeMake(imageView.frame.size.width, imageView.frame.size.height)];
```
Explication:

Tout d'abord, le UIScrollView's contentMode est fixé à AspectFitcomme @Mike suggéré. Ensuite, sizeToFit() est appelée sur le imageView pour remplacer Interface Builder est ennuyeux presets, et afin de rendre l'image de la bonne taille.

La dernière ligne est important. Vous doit définir la contentSize pour la ScrollView une fois que vous re-taille de l' imageView. Sinon, le ScrollView pense que l'image est encore la taille de l'écran de l'iPad, et donc ne pense pas qu'il n'y a rien à faire défiler. Réglage de la taille de la ScrollView après le redimensionnement de la ImageView et la modification de la ScrollView's contentMode rend le ScrollView la taille réelle de l'image.

Espère que contribué à!

Merci pour l'aide de Mike, il m'a fait sur la bonne voie 🙂
- Alex
1

Depuis le imageView est le contenu de la scrollview, essayez de changer le ScrollView's mode de contenu pour UIViewContentModeScaleAspectFit. Essayez d'appeler setNeedsDisplay sur le imageview.
0

Pour ceux qui luttent pour corriger les proportions de l'image en mode paysage tout en utilisant UICollectionView tout en ayant besoin de l'image pour être en plein écran.

Dans votre - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath procédez de la manière suivante:
```
CGFloat newWidth = self.view.bounds.size.width; //if iPad in landscape and fullscreen value is 1024
CGFloat newHeight = image.size.height / image.size.width * newWidth;

cell.clipsToBounds = YES;
cell.imageView.frame = CGRectMake(0, 0, newWidth, newHeight);
cell.imageView.contentMode = UIViewContentModeScaleAspectFill;
cell.imageView.image = image;
cell.scrollView.contentSize = cell.imageView.frame.size;
```
La clé, c'est de faire d'affichage de l'image image de la bonne taille tout en gardant le ratio d'aspect correct.

Ce code a fonctionné pour moi: (Swift)

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    let imgView = UIImageView(image: UIImage(named: "MyImage"))
    imgView.contentMode = .ScaleAspectFit
    var size = imgView.frame.size
    size.height = size.height / size.width * scrollView.frame.width
    size.width = scrollView.frame.width
    imgView.frame.size = size
    scrollView.addSubview(imgView)
    scrollView.contentSize = size
}

Vous devez vous connecter pour publier un commentaire.