web-dev-qa-db-fra.com

Zoom UIImageView et UIScrollView

Ai-je réellement besoin d'un UIPinchGestureRecognizer dans un UIScrollView pour que le pincement fonctionne? Si oui, comment dois-je procéder? J'essaie d'implémenter ce que le flipboard a, où il fait essentiellement un zoom sur une image et a la capacité de défilement après un zoom avant. Comment faire?

MISE À JOUR:

Voici un code que j'ai qui n'appelle pas le délégué de la vue de défilement

CGRect imgFrame;
imgFrame.size.width = originalImageSize.width;
imgFrame.size.height = originalImageSize.height;
imgFrame.Origin.x = imageOriginPoint.x;
imgFrame.Origin.y = imageOriginPoint.y;

NSData *data = [request responseData];
UIImage * image = [UIImage imageWithData:data];
imageView = [[UIImageView alloc] initWithImage:image];
[imageView setUserInteractionEnabled:YES];
[imageView setBackgroundColor:[UIColor clearColor]];
[imageView setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight];
[imageView setFrame:CGRectMake(0, 0, imgFrame.size.width, imgFrame.size.height)];

UIScrollView * imgScrollView = [[UIScrollView alloc] initWithFrame:imageView.frame];
imgScrollView.delegate = self;
imgScrollView.showsVerticalScrollIndicator = NO;
imgScrollView.showsHorizontalScrollIndicator = NO;
[imgScrollView setScrollEnabled:YES];
[imgScrollView setClipsToBounds:YES];
[imgScrollView addSubview:imageView];
[imgScrollView setBackgroundColor:[UIColor blueColor]];
[imgScrollView setMaximumZoomScale:1.0];
26
adit

Tout ce que vous avez à faire est d'ajouter votre UIImageView (ou toute vue que vous souhaitez agrandir) à l'intérieur de votre UIScrollView.

Définissez votre maximumZoomScale sur votre UIScrollView sur n'importe quelle valeur supérieure à 1.0f.

Définissez-vous comme délégué de votre UIScrollView et renvoyez le UIImageView dans la méthode déléguée viewForZooming.

C'est ça. Aucun geste de pincement nécessaire, rien. UIScrollView gère le zoom par pincement pour vous.

90
Ignacio Inglese

Objectif C

Image avec zoom par pincement dans les étapes de défilement (objectif C)

1. Contraintes de vue de défilement

enter image description here

2. Ajouter ImageView dans ScrollView et définir des contraintes

enter image description here

3. Prenez IBOutlets

IBOutlet UIScrollView * bgScrollView;
IBOutlet UIImageView * imageViewOutlet;

4. Méthode viewDidLoad

- (void)viewDidLoad
 {
    [super viewDidLoad];

    float minScale=bgScrollView.frame.size.width / imageViewOutlet.frame.size.width;
    bgScrollView.minimumZoomScale = minScale;
    bgScrollView.maximumZoomScale = 3.0;
    bgScrollView.contentSize = imageViewOutlet.frame.size;
    bgScrollView.delegate = self;
}

5. Scroll View, méthode déléguée

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return imageViewOutlet;
}

Rapide

Image pincée-zoomée en étapes Scrollview (Swift)

1. Contraintes de vue de défilement

enter image description here

2. Ajouter ImageView dans ScrollView et définir des contraintes

enter image description here

3. Prenez IBOutlets

@IBOutlet weak var bgScrollView : UIScrollView!
@IBOutlet weak var imageView : UIImageView!

4. Méthode viewDidLoad

 override func viewDidLoad() {
    super.viewDidLoad()

    let minScale = bgScrollView.frame.size.width / imageView.frame.size.width;
    bgScrollView.minimumZoomScale = minScale
    bgScrollView.maximumZoomScale = 3.0
    bgScrollView.contentSize = imageView.frame.size
    bgScrollView.delegate = self
}

5. Scroll View, méthode déléguée

func viewForZooming(in scrollView: UIScrollView) -> UIView? {
    return imageView
}
16
Shrikant Tanwade

J'ai fait une visionneuse d'image personnalisée il n'y a pas longtemps sans les reconnaisseurs de pincement. Juste UIImageView au-dessus de UIScrollView. Là, vous passez une chaîne avec un lien vers l'image et il a également une barre de progression. Une fois le chargement de l'image terminé, l'image s'affiche. Voici le code:

-(UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
  return self.theImageView;
}

- (CGRect)centeredFrameForScrollView:(UIScrollView *)scroll andUIView:(UIView *)rView {
  CGSize boundsSize = scroll.bounds.size;
  CGRect frameToCenter = rView.frame;
  // center horizontally
  if (frameToCenter.size.width < boundsSize.width) {
    frameToCenter.Origin.x = (boundsSize.width - frameToCenter.size.width) / 2;
  }
  else {
    frameToCenter.Origin.x = 0;
  }
  // center vertically
  if (frameToCenter.size.height < boundsSize.height) {
    frameToCenter.Origin.y = (boundsSize.height - frameToCenter.size.height) / 2;
  }
  else {
    frameToCenter.Origin.y = 0;
  }
  return frameToCenter;
}

-(void)scrollViewDidZoom:(UIScrollView *)scrollView
{
  self.theImageView.frame = [self centeredFrameForScrollView:self.theScrollView andUIView:self.theImageView];                               
}

- (void)connection:(NSURLConnection *)connection didReceiveResponse:(NSURLResponse *)response {
  [self.resourceData setLength:0];
  self.filesize = [NSNumber numberWithLongLong:[response expectedContentLength]];
}

-(void)connection:(NSURLConnection *)connection didReceiveData:(NSData *)data
{
  [self.resourceData appendData:data];
  NSNumber *resourceLength = [NSNumber numberWithUnsignedInteger:[self.resourceData length]];
  self.progressBar.progress = [resourceLength floatValue] / [self.filesize floatValue];
}

-(void)connectionDidFinishLoading:(NSURLConnection *)connection
{
  self.theImage = [[UIImage alloc]initWithData:resourceData];
  self.theImageView.frame = CGRectMake(0, 0, self.theImage.size.width, self.theImage.size.height);
  self.theImageView.image = self.theImage;
  self.theScrollView.minimumZoomScale = self.theScrollView.frame.size.width / self.theImageView.frame.size.width;
  self.theScrollView.maximumZoomScale = 2.0;
  [self.theScrollView setZoomScale:self.theScrollView.minimumZoomScale];
  self.theScrollView.contentSize = self.theImageView.frame.size;
  self.theLabel.hidden = YES;
  self.progressBar.hidden = YES;
}

-(void)setImageInImageView
{
  NSURLRequest *req = [[NSURLRequest alloc]initWithURL:[NSURL URLWithString:self.imageLink]];
  NSURLConnection *conn = [[NSURLConnection alloc]initWithRequest:req delegate:self];
  if (conn)
  {
    self.resourceData = [NSMutableData data];
  }
  else
  {
    NSLog(@"Connection failed: IMageViewerViewController");
  }
}

-(void)loadView
{
  self.filesize = [[NSNumber alloc]init];
  self.progressBar = [[UIProgressView alloc]initWithProgressViewStyle:UIProgressViewStyleBar];
  self.progressBar.frame = CGRectMake(20, 240, 280, 40);
  [self.progressBar setProgress:0.0];
  self.theImageView = [[[UIImageView alloc]initWithFrame:[[UIScreen mainScreen]applicationFrame]]autorelease];
  self.theScrollView = [[[UIScrollView alloc]initWithFrame:[[UIScreen mainScreen]applicationFrame]]autorelease];
  self.theScrollView.delegate = self;
  [self.theScrollView addSubview:self.theImageView];
  self.view = self.theScrollView;
  self.theLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 200, 320, 40)];
  self.theLabel.font = [UIFont boldSystemFontOfSize:15.0f];
  self.theLabel.text = @"Please wait, file is being downloaded";
  self.theLabel.textAlignment = UITextAlignmentCenter;
  self.theLabel.hidden = NO;
  [self.view addSubview:self.progressBar];
  [self.view bringSubviewToFront:self.progressBar];
  [self.view addSubview:self.theLabel];
  [self.view bringSubviewToFront:self.    theLabel];
  [self performSelectorOnMainThread:@selector(setImageInImageView) withObject:nil waitUntilDone:NO];
}

Et le fichier d'en-tête:

@interface ImageViewerViewController : UIViewController<UIScrollViewDelegate, NSURLConnectionDelegate, NSURLConnectionDataDelegate>

@property (nonatomic, retain) IBOutlet UIImageView *theImageView;
@property (nonatomic, retain) IBOutlet UIScrollView *theScrollView;
@property (nonatomic, retain) NSString *imageLink;
@property (nonatomic, retain) UIImage *theImage;
@property (nonatomic, retain) UILabel *theLabel;
@property (nonatomic, retain) UIProgressView *progressBar;
@property (nonatomic, retain) NSMutableData *resourceData;
@property (nonatomic, retain) NSNumber *filesize;
@end

J'espère que cela aide

15
Novarg

Je suppose que cette réponse peut être inutile mais j'ai eu des problèmes similaires à @adit et je l'ai résolu de manière très simple (je pense) et peut-être que quelqu'un avec des défis similaires peut l'utiliser:

- (void)viewDidLoad {
    [super viewDidLoad];

    self.view.backgroundColor = [UIColor yellowColor];

    UIImage *imageToLoad = [UIImage imageNamed:@"background_green"];

    self.myImageView = [[UIImageView alloc]initWithImage:imageToLoad];
    self.myScrollView = [[UIScrollView alloc]initWithFrame:self.view.bounds];
    [self.myScrollView addSubview:self.myImageView];
    self.myScrollView.contentSize = self.myImageView.bounds.size;
    self.myScrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite;
    self.myScrollView.minimumZoomScale = 0.3f;
    self.myScrollView.maximumZoomScale = 3.0f;
    self.myScrollView.delegate = self;
    [self.view addSubview:self.myScrollView];
}

- (UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView {
    NSLog(@"viewForZoomingInScrollView");
    return self.myImageView;
} 

Mon problème était très simple, j'avais oublié d'ajouter self.myScrollView.delegate = self;, ce qui est la raison pour laquelle j'ai eu des problèmes. Il m'a fallu une éternité pour comprendre ce problème simple, je suppose que je n'ai pas vu la forêt pour tous les arbres :-)

9
PeterK

Lorsque je développais mon zoom PDF dans un UIScrollView, j'ai découvert qu'en l'exécutant sur le téléphone, le zoom était déjà implémenté dans le téléphone. Mais vous pouvez jeter un œil à ceci, http://developer.Apple.com/library/ios/#samplecode/ZoomingPDFViewer/Introduction/Intro.html c'est un exemple de code qui essaie d'implémenter la fonctionnalité de zoom, ce c'est vouloir me faire démarrer.

2
Popeye

Pour la solution 'snap-image-to-screen-bords' @Shrikant Tanwade a bien fonctionné, mais je voulais quelques encarts. J'ai essayé les constantes des contraintes de paramètres, mais cela n'a pas fonctionné.

J'ai terminé avec la solution suivante:

  1. comme pour Shrikant - définissez les contraintes de scrollView, imageView, définissez leurs constantes sur 0.

  2. définir des encarts avec scrollView.contentInset = UIEdgeInsetsMake(....

0
medvedNick