Как бы вы реализовали скроллируемую сетку в приложении для iPhone?

Question

У меня есть около 50 изображений размером 50 x 50 пикселей каждое. Я хочу, чтобы пользователь выбрал один из них. Итак, сначала я подумал о UITableView, но это не совсем правильно. Это тратит много места на экране. Вместо того, чтобы размещать все изображения одно под другим, было бы лучше показать сетку, скажем, из 6 столбцов и n строк.

Я бы использовал UIScrollView и заполнил его объектами UIView, которые я автоматически упорядочил так, чтобы они выглядели как сетка. Это путь? Или какие-либо другие предложения?

Answer 1

Я делаю что-то очень похожее в своем приложении - сетку NxN с изображением внизу и другое подпредставление сверху, чтобы нарисовать «линии», все из которых принадлежат UIScrollView. Я рекомендую иметь отдельный вид для рисования изображений, что-то вроде:

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

Другой автор упомянул, что вы не сможете получать сенсорные события, если ваш вид принадлежит UIScrollView - это просто неправда. У меня это работает. Возможно, вам придется установить следующее:

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

Answer 2

В библиотеке three20 есть класс, который делает это.

Answer 3

Представление таблицы не обязательно предполагает показ одного изображения в строке, как вы предлагаете. Ячейки таблицы могут быть настроены, и подкласс ячейки с шестью 50x50 UIImageViews будет довольно простым. Возможно, он менее гибкий, чем представление с прокруткой, но если ваша цель - шесть изображений в строке, то табличное представление - самый быстрый способ получить его.

Answer 4

three20 ужасен, я использовал его, я не рекомендую его ... отображать сетку легко ...

    - (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)];

}

и если вам нужно 6 изображений в альбомной ориентации - установите BOOL для isLandscape

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

если вам нужен более продвинутый gridView, проверьте AQGridView (Google it)