Come implementeresti una griglia scorrevole nella tua app per iPhone?

Question

Ho circa 50 immagini di 50 x 50 pixel ciascuna. Voglio che l'utente ne scelga uno. Quindi prima ho pensato a un UITableView, ma non è proprio la cosa giusta. Spreca molto spazio sullo schermo. Invece di mettere tutte le immagini una sotto l'altra, sarebbe meglio mostrare una griglia di diciamo 6 colonne e n righe.

Userei un UIScrollView e lo riempirei di oggetti UIView che organizzo automaticamente in modo che appaiano come una griglia. È questa la strada da percorrere? O altri suggerimenti?

Answer 1

Sto facendo qualcosa di molto simile nella mia app: una griglia NxN con un'immagine sotto e un'altra sottoview in alto per disegnare le "linee", tutte di proprietà di UIScrollView. Consiglio di avere una vista separata per disegnare le immagini, qualcosa del tipo:

-(void) drawRect(CGRect rect) {
    CGRect smallerRect = CGRectMake(x, y, width, height);
    [yourImage drawRect: smallerRect];
    // repeat as needed to draw the grid
 }

Un altro poster ha indicato che non sarai in grado di ricevere eventi tattili se la tua vista è di proprietà di UIScrollView, semplicemente non è vero. Ho funzionato. Potrebbe essere necessario impostare quanto segue:

[yourScrollView setUserInteractionEnabled: YES]
[yourGridView setUserInteractionEnabled: YES]

Answer 2

La three20 library ha una classe che lo fa.

Answer 3

Una vista tabella non implica necessariamente la visualizzazione di un'immagine per riga, come suggerisci. Le celle della tabella possono essere personalizzate e una sottoclasse di celle con sei UIImageViews 50x50 sarebbe piuttosto semplice. È forse meno flessibile di una vista a scorrimento ma se sei immagini per riga è il tuo obiettivo, una vista da tavolo è il modo più rapido per ottenerlo.

Answer 4

three20 è orribile, l'ho usato, non lo consiglio ... visualizzare una griglia è facile ...

    - (void) reloadGridView
    {

        scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(5, 54, scrollViewWidth, scrollViewHeight8)];
        scrollView.delegate = self;
        scrollView.showsVerticalScrollIndicator = NO;
        scrollView.showsVerticalScrollIndicator = NO;
        scrollView.userInteractionEnabled = YES;
        scrollView.scrollEnabled = YES;

        [self.view addSubview:scrollView];


        int x = 10;
        int y = 10;

        divisor = 1;

        for (int i = 0; i < [self.photosArray count]; i++) {

            int buttonTag = divisor;

            UIImage *thumb = [UIImage imageWithContentsOfFile:[self thumbPathAtIndex:i]];
            //********* CREATE A BUTTON HERE **********
            //********* use the thumb as its backgroundImage *******


            if(divisor%4==0){
                y+=70; 
                x = 10;

            }else{
               x += 70;
            }

            divisor++;
        }
        [scrollView setContentSize:CGSizeMake(scrollViewWidth, ([self.photosArray count]%4 == 0) ? y : y+100)];

}

e se vuoi 6 immagini in modalità orizzontale, imposta un BOOL per isL landscape

if (isLandscape) {
    //change the divisor to change @ 6 instead of 4
}

se hai bisogno di un gridView più avanzato, controlla AQGridView (Google it)