Как я могу отобразить мои изображения в моем viewController так же, как на снимке экрана ниже?

Question

В моей программе для iPad у меня есть массив, содержащий изображения.Как я могу отобразить все мои изображения (из массива изображений) в моем viewController так же, как на снимке экрана ниже?Есть ли хороший способ сделать это, какие-либо примеры путей приложения для ссылки или пример кода?

Мне нужны следующие функции.

1. При нажатии на изображение отобразится его на весь экран
2. Кнопка закрытия, чтобы закрыть это представление так же, как снимок экрана.
3. Две кнопки для отображения оставшихся и предыдущих изображений.

Пример снимка экрана прилагается ниже.Мы видим, что нижеприведенное приложение показывает все изображения в правой части экрана.

Answer 1

Хорошо, это должно быть легко, хотя нужно немного кодирования.Начните с простого шаблона приложения .

Я не знаю, откуда берутся изображения, поэтому я просто помещаю все изображения, которые будут показаны в папке ресурсов.

Контроллер представления PictureViewController примет массив UIImages и должен быть представлен модально.Я выложу код ниже.

Код для показа PictureViewController помещен в контроллер представления, созданный шаблоном.Я просто добавил в представление простую кнопку UIB для запуска действия, которое выглядит примерно так:

- (IBAction)onShowPictures
{
    // Load all images from the bundle, I added 14 images, named 01.jpg ... 14.jpg
    NSMutableArray *images = [NSMutableArray array];
    for (int i = 1; i <= 14; i++) {
        [images addObject:[UIImage imageNamed:[NSString stringWithFormat:@"%02d.jpg", i]]];
    }

    PictureViewController *picViewController = [[PictureViewController alloc] initWithImages:images];

    [self presentModalViewController:picViewController animated:YES];

    [picViewController release];
}

Представление контроллера представления было создано с помощью построителя интерфейса, похожего на это:

PictureViewController.xib

Просмотр иерархии

Полноэкранное изображение связано с торговой точкой fullScreenImageвидно в следующем заголовочном файле.Действия также связаны.

Я установил режим содержимого полноэкранного изображения в Aspect Fit.

Миниатюры будут добавляться динамически с кодом.Вот код контроллера представления

PictureViewController.h

@interface PictureViewController : UIViewController 
{
    NSMutableArray *imageViews;

    NSArray *images;

    UIImageView *fullScreenImage;

    int currentPage;
}

@property (nonatomic, retain) NSMutableArray *imageViews;
@property (nonatomic, retain) NSArray *images;
@property (nonatomic, retain) IBOutlet UIImageView *fullScreenImage;

- (id)initWithImages:(NSArray *)images;

- (IBAction)onClose;
- (IBAction)onNextThumbnails;
- (IBAction)onPreviousThumbnails;

@end

PictureViewController.m

Определение MAX_THUMBNAILS сверху определяет максимум просмотренных миниатюр.A UITapGestureRecognizer позаботится о событиях касания миниатюр.Настройте CGRectMake в setupThumbnailImageViews, чтобы расположить миниатюры по своему усмотрению.Этот контроллер - просто базовый подход без поддержки ориентации.

#import "PictureViewController.h"

#define MAX_THUMBNAILS 6

@interface PictureViewController ()

- (void)showSelectedImageFullscreen:(UITapGestureRecognizer *)gestureRecognizer;
- (void)setupThumbnailImageViews;
- (void)setThumbnailsForPage:(int)aPage;
- (UIImage *)imageForIndex:(int)anIndex;

@end


@implementation PictureViewController

@synthesize imageViews, images, fullScreenImage;


- (id)initWithImages:(NSArray *)someImages
{
    self = [super init];
    if (self) {
        self.images = someImages;
        self.imageViews = [NSMutableArray array];
        currentPage = 0;
    }
    return self;
}

- (void)viewDidLoad
{
    self.fullScreenImage.image = [images objectAtIndex:0];
    [self setupThumbnailImageViews];
    [self setThumbnailsForPage:0];
}

- (void)showSelectedImageFullscreen:(UITapGestureRecognizer *)gestureRecognizer
{
    UIImageView *tappedImageView = (UIImageView *)[gestureRecognizer view];

    fullScreenImage.image = tappedImageView.image;
}

- (void)setupThumbnailImageViews
{
    for (int i = 0; i < MAX_THUMBNAILS; i++) {
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(20.0, 
                                                                               166.0 + (130.0 * i), 
                                                                               130.0, 
                                                                               90.0)];

        UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self 
                                                                                               action:@selector(showSelectedImageFullscreen:)];
        tapGestureRecognizer.numberOfTapsRequired = 1;
        tapGestureRecognizer.numberOfTouchesRequired = 1;
        [imageView addGestureRecognizer:tapGestureRecognizer];
        [tapGestureRecognizer release];

        imageView.userInteractionEnabled = YES;

        [imageViews addObject:imageView];
        [self.view addSubview:imageView];
    }
}

- (void)setThumbnailsForPage:(int)aPage
{
    for (int i = 0; i < MAX_THUMBNAILS; i++) {
        UIImageView *imageView = (UIImageView *)[imageViews objectAtIndex:i];
        UIImage *image = [self imageForIndex:aPage * MAX_THUMBNAILS + i];

        if (image) {
            imageView.image = image;
            imageView.hidden = NO;          
        } else {
            imageView.hidden = YES;
        }
    }
}

- (UIImage *)imageForIndex:(int)anIndex
{
    if (anIndex < [images count]) {
        return [images objectAtIndex:anIndex];
    } else {
        return nil;
    }
}


#pragma mark -
#pragma mark user interface interaction

- (IBAction)onClose
{
    [self dismissModalViewControllerAnimated:YES];
}

- (IBAction)onNextThumbnails
{
    if (currentPage + 1 <= [images count] / MAX_THUMBNAILS) {
        currentPage++;
        [self setThumbnailsForPage:currentPage];
    }
}

- (IBAction)onPreviousThumbnails
{
    if (currentPage - 1 >= 0) {
        currentPage--;  
        [self setThumbnailsForPage:currentPage];    
    }
}


#pragma mark -
#pragma mark memory management

- (void)didReceiveMemoryWarning 
{
    [super didReceiveMemoryWarning];

    [images release];   
}

- (void)viewDidUnload 
{
    [super viewDidUnload];

    [imageViews release];   
    [fullScreenImage release];
}

- (void)dealloc 
{
    [images release];
    [imageViews release];   
    [fullScreenImage release];

    [super dealloc];
}

@end

Результат: