Aggiunta di una spaziatura tra le immagini in un UIScrollView

Question

Come si aggiunge uno spazio/spazio tra più immagini aggiunte a UIScrollView?

un esempio sarebbe l'app per le foto, che ha una spaziatura nera tra le immagini quando si usa il cercapersone.

Answer 1

E 'la matematica di base solo ..

Si aggiunge UIImageView come subviews, e calcolare lo spazio che si desidera conoscere la dimensione del tuo subviews e la contentSize del ScrollView.

EDIT:

Questo fondamentalmente costruire una galleria

-(void)photosGallery 
{ 
    UIScrollView* scrollView = [[UIScrollView alloc] initWithFrame:(CGRect){.origin.x = 0.0f, .origin.y = 0.0f, .size.width = 320.0f, .size.height = 416.0f}]; 
    scrollView.contentSize = (CGSize){.width = view.frame.size.width, .height = 372.0f}; 
    scrollView.backgroundColor = [UIColor whiteColor]; 
    scrollView.showsVerticalScrollIndicator = NO; 
    scrollView.showsHorizontalScrollIndicator = NO; 
    /// Build gallery 
    CGSize thumbSize = (CGSize){.width = 75.0f, .height = 75.0f}; 
    const CGFloat xSpace = (scrollView.frame.size.width - (thumbSize.width * kPictsPerRow))/(kPictsPerRow + 1); // kPictsPerRow = Number of pictures in a row 
    const CGFloat xInc = thumbSize.width + xSpace; 
    const CGFloat yInc = thumbSize.height + 15.0f; 
    CGFloat x = xSpace, y = 10.0f; 
    for (NSUInteger i = kMaxPictures; i--;) 
    { 
     UIImageView* pv = [[UIImageView alloc] initWithFrame:(CGRect){.origin.x = x, .origin.y = y, .size = thumbSize}]; 
     [scrollView addSubview:pv]; 
     [pv release]; 
     x += xInc; 
     const NSUInteger eor = i % kPictsPerRow; 

     if (!eor) 
      y += yInc, x = xSpace; 
    } 
    [scrollView release]; 
} 

Answer 2

sufficiente impostare i telai per l'UIImageView del con un po 'di spazio tra di loro. Per esempio, se scroll_view è un UIScrollView si potrebbe fare

scroll_view.contentSize = CGSizeMake(1000,100); 
for (int i=0;i<10;i++){ 
    UIImageView *imv = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"some_image.png"]]; 
    CGRect frame = CGRectInset(CGRectMake(i * 100,0.0,100.0,100.0), 5.0, 4.0); 
    imv.frame = frame; 
    [scroll_view addSubview:imv]; 
} 

Questo è un esempio greggio, ma mostra il punto. Inserendo CGRect (CGRectInset), si ottengono alcuni spazi tra le immagini nella vista di scorrimento.

Answer 3

ho dovuto fare questo in un app simile, e le mie soluzioni è documentato in questa risposta (si noti che la questione non era legato a scorrere vista, ma il concetto coinvolti è simile): PDF in UIWebView

Answer 4

ti assumere sapere come aggiungere immagini a UIScrollView con il paging abilitato. Suppongo anche che tu voglia vedere le foto a schermo intero, ma quando scorri, vuoi dividerle. Se sì, ecco uno dei possibili soluzioni ...

• definire spazio quale 20px
• UIScrollView è vista a schermo intero, 320x480 per iPhone
• set UIScrollView frame CGRectMake (0, 0, 340, 480); // 340 = 320 + 20 (gap, questi 20px sono offscreen)
• imposta il primo frame immagine su CGRectMake (0, 0, 320, 480);
• seconda cornice immagine a CGRectMake (340, 0, 320, 480);
• ... I-esima immagine CGRectMake (340 * I, 0, 320, 480) // I è indice - 0..N-1
• imposta la dimensione del contenuto di UIScrollView su CGSizeMake (340 * N, 480) // N = numero di immagini

... questa soluzione è piuttosto veloce se non si desidera lo zoom, solo schermo intero, paginato, scorrimento con spazi vuoti.

Answer 5

Probabilmente si sta cercando di questo codice:

#define FRAME_WIDTH 330 
- (void)viewDidLoad { 
    [super viewDidLoad]; 

    self.scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, FRAME_WIDTH, self.view.bounds.size.height)]; 
    self.scrollView.bounces = YES; 
    self.scrollView.pagingEnabled = YES; 

    UIImageView *leftView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"2.png"]]; 
    leftView.frame = CGRectMake(0, 0, 320, self.view.bounds.size.height); 

    UIImageView* centerView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"9.png"]]; 
    centerView.frame = CGRectMake(FRAME_WIDTH, 0, 320, self.view.bounds.size.height); 

    UIImageView *rightView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"10.png"]]; 
    rightView.frame = CGRectMake(FRAME_WIDTH * 2, 0,320,self.view.bounds.size.height); 

    [self.scrollView addSubview:leftView]; 
    [self.scrollView addSubview:centerView]; 
    [self.scrollView addSubview:rightView]; 

    [self.scrollView setContentSize:CGSizeMake(FRAME_WIDTH * 3, 0)]; 
    [self.scrollView setContentOffset:CGPointMake(FRAME_WIDTH, 0)]; 

    [self.view addSubview:self.scrollView]; 
} 

assomiglia Foto per iOS. Questo esempio crea 3 ImageViews.

allegato un progetto di test in modo da poter provare voi stessi: Project

Answer 6

Per evitare scherzi con cornice di UIScrollView, si potrebbe creare una sottoclasse UIScrollView e sovrascrivere layoutSubviews di applicare un offset a ciascuna pagina.

L'idea si basa sulle seguenti osservazioni:

1. Quando zoomScale = 1, l'offset è zero quando è sul bordo sinistro/destro
2. Quando zoomScale == 1, l'offset è zero quando si è al centro visibile rect

Quindi il codice seguente è derivato:

- (void) layoutSubviews 
{ 
    [super layoutSubviews]; 

    // Find a reference point to calculate the offset: 
    CGRect bounds = self.bounds; 
    CGFloat pageGap = 8.f; 
    CGSize pageSize = bounds.size; 
    CGFloat pageWidth = pageSize.width; 
    CGFloat halfPageWidth = pageWidth/2.f; 
    CGFloat scale = self.zoomScale; 
    CGRect visibleRect = CGRectMake(bounds.origin.x/scale, bounds.origin.y/scale, bounds.size.width/scale, bounds.size.height/scale); 
    CGFloat totalWidth = [self contentSize].width/scale; 
    CGFloat scrollWidth = totalWidth - visibleRect.size.width; 
    CGFloat scrollX = CGRectGetMidX(visibleRect) - visibleRect.size.width/2.f; 
    CGFloat scrollPercentage = scrollX/scrollWidth; 
    CGFloat referencePoint = (totalWidth - pageWidth) * scrollPercentage + halfPageWidth; 

    // (use your own way to get all visible pages, each page is assumed to be inside a common container) 
    NSArray * visiblePages = [self visiblePages]; 

    // Layout each visible page: 
    for (UIView * view in visiblePages) 
    { 
     NSInteger pageIndex = [self pageIndexForView:view]; // (use your own way to get the page index) 

     // make a gap between pages 
     CGFloat actualPageCenter = pageWidth * pageIndex + halfPageWidth; 
     CGFloat distanceFromRefPoint = actualPageCenter - referencePoint; 
     CGFloat numOfPageFromRefPoint = distanceFromRefPoint/pageWidth; 
     CGFloat offset = numOfPageFromRefPoint * pageGap; 
     CGFloat pageLeft = actualPageCenter - halfPageWidth + offset; 

     view.frame = CGRectMake(pageLeft, 0.f, pageSize.width, pageSize.height); 
    } 
}