概述

做一个图片墙demo，分两个页面一个图片聚合页一个图片展示页。
涉及的知识点

  • 屏幕尺寸获取
  • 导航栏高度获取
  • 控件尺寸，位置计算
  • 视图控制器之间传值（注意三种传值方式，代码注释的很清楚了）

示例

先看图

ios UICollectionView 照片墙布局 iphone照片墙怎么弄_视图控制器传值

示例代码

关于如何配置UIWindow进行适配，参看iOS的UI-04-UIWindow

先看一下工程目录结构

ios UICollectionView 照片墙布局 iphone照片墙怎么弄_视图控制器传值_02

AppDelegate.h
#import <UIKit/UIKit.h>

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (retain,nonatomic) UIWindow* window;

@end
AppDelegate.m
#import "AppDelegate.h"
#import "VCRoot.h"

@interface AppDelegate ()
@end

@implementation AppDelegate


- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Override point for customization after application launch.
    
    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    
    VCRoot* vcR = [VCRoot new];
    
    UINavigationController* nvc = [[UINavigationController alloc] initWithRootViewController:vcR];
    
    self.window.rootViewController = nvc;
    
    [self.window makeKeyAndVisible];
    
    return YES;
}
@end
VCRoot.m
#import "VCRoot.h"
#import "VCImageShow.h"

@interface VCRoot ()

@end

@implementation VCRoot

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //导航栏不透明
    self.navigationController.navigationBar.translucent = NO;
    //视图控制器title
    self.title = @"图片墙";
    //初始化UIScrollView
    UIScrollView* sv = [UIScrollView new];
    //设置UIScrollView背景色为白色
    sv.backgroundColor = [UIColor whiteColor];
    //竖向滚动条隐藏掉
    sv.showsVerticalScrollIndicator = NO;
    //横向不滚动
    sv.alwaysBounceHorizontal = NO;
    //获取屏幕宽，高参数
    UIScreen* screen = [UIScreen mainScreen];
    CGSize screenSize = screen.bounds.size;
    CGFloat sWidth = screenSize.width;
    CGFloat sHeight = screenSize.height;
    
    NSLog(@"width=%f;height=%f",sWidth,sHeight);
    //设置UIScrollView的视图大小为屏幕大小
    sv.frame = CGRectMake(0, 0, sWidth, sHeight);

    //计算每一张图片的宽度（每一行有三张图）
    CGFloat imageVWidth = (sWidth-40)/3;
    //计算每一张图片的高度（视图宽高比为1:2）
    CGFloat imageVHeight = imageVWidth * 2;
    //设置UIScrollView的内容尺寸；（当导航栏不透明时，其下部的视图会被挤压下来）
    sv.contentSize = CGSizeMake(sWidth, (imageVHeight+10)*5+ [self getNavHeight]);
    //设置UIScrollView可以交互
    sv.userInteractionEnabled = YES;

    //创建图片控件，并添加到UIScrollView中
    for (int i=0; i<15; i++) {
        //获取图片的名称
        NSString* imgName = [NSString stringWithFormat:@"timg_%d.jpg",i+1];
        //初始化UIImage
        UIImage* image = [UIImage imageNamed:imgName];
        //初始化UIImageView
        UIImageView* iv = [[UIImageView alloc] initWithImage:image];
        //设置图片的位置和大小（比较重要，涉及计算）
        iv.frame = CGRectMake(10+(i%3)*(imageVWidth+10), (i/3)*(imageVHeight+10), imageVWidth, imageVHeight);
        //将图片控件添加到滚动控件中
        [sv addSubview:iv];
        
        //给每个图片控件加个点击事件
        //设置图片控件可响应触碰事件
        iv.userInteractionEnabled = YES;
        //初始化点击事件接收器
        UITapGestureRecognizer* tapGS = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(selectImg:)];
        //设置点击次数为1次
        tapGS.numberOfTapsRequired = 1;
        //设置触碰点为1个
        tapGS.numberOfTouchesRequired = 1;
        //给图片控件添加点击事件监听
        [iv addGestureRecognizer:tapGS];
        
        //给图片控件设置tag（注意拼接方式）
        iv.tag = 101 + i;
    }

    [self.view addSubview:sv];
}

//第一种方式
//-(void) selectImg :(UITapGestureRecognizer*) tapGs{
//    NSLog(@"选中了一张图片");
//
//    //点击的图片视图对象
//    UIImageView* imgView = tapGs.view;
//    //创建显示图片的视图控制器
//    VCImageShow* vcImgShow = [VCImageShow new];
//
//    //传递视图对象（不可取）
//    vcImgShow.imgView = imgView;
//    //跳转
//    [self.navigationController pushViewController:vcImgShow animated:YES];
//}


//第二种方式
//-(void) selectImg :(UITapGestureRecognizer*) tapGs{
//    NSLog(@"选中了一张图片");
//
//    //点击的图片视图对象
//    UIImageView* imgView = tapGs.view;
//    //创建显示图片的视图控制器
//    VCImageShow* vcImgShow = [VCImageShow new];
//    //传递视图内容对象（可取）
//    vcImgShow.image = imgView.image;
//    //跳转
//    [self.navigationController pushViewController:vcImgShow animated:YES];
//}

//第三种方式
-(void) selectImg :(UITapGestureRecognizer*) tapGs{
    NSLog(@"选中了一张图片");
    
    //点击的图片视图对象
    UIImageView* imgView = tapGs.view;
    //创建显示图片的视图控制器
    VCImageShow* vcImgShow = [VCImageShow new];
    //传递tag
    vcImgShow.imgTag = imgView.tag;
    //跳转
    [self.navigationController pushViewController:vcImgShow animated:YES];
}

//获取导航栏高度
-(CGFloat) getNavHeight{
    CGFloat h = self.navigationController.navigationBar.frame.size.height ;
    
    NSLog(@"navheight==%f",h);
    return h;
}

@end
VCImageShow.h
#import <UIKit/UIKit.h>

NS_ASSUME_NONNULL_BEGIN

@interface VCImageShow : UIViewController
//图像视图tag
@property (nonatomic,assign) NSUInteger imgTag;
//图像视图对象
@property (nonatomic,retain) UIImage* image;
//图像视图控件对象
@property (nonatomic,retain) UIImageView* imgView;

@end

NS_ASSUME_NONNULL_END
VCImageShow.m
#import "VCImageShow.h"

@interface VCImageShow ()

@end

@implementation VCImageShow

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    self.title = @"图片展示";
    //获取屏幕宽高尺寸
    CGFloat width = [UIScreen mainScreen].bounds.size.width;
    CGFloat height = [UIScreen mainScreen].bounds.size.height;
    
    //第一种方式（不可取）
//    //设置图片视图的大小为屏幕大小（全屏）
//    _imgView.frame = CGRectMake(0, 0, width, height);
    
    //第二种方式（可取）
//    _imgView = [UIImageView new];
//    //设置图片视图的大小为屏幕大小（全屏）
//    _imgView.frame = CGRectMake(0, 0, width, height);
//
//    //图片控件实例添加图片视图对象
//    _imgView.image = _image;
    
    //第三种方式
    _imgView = [UIImageView new];
    //设置图片视图的大小为屏幕大小（全屏）
    _imgView.frame = CGRectMake(0, 0, width, height);
    _imgView.image = [UIImage imageNamed:[NSString stringWithFormat:@"timg_%d.jpg",_imgTag-100]];
        
    //一个视图对象只能有一个根视图
    //当把视图添加到新父视图上之后旧的父视图中就会删除掉
    [self.view addSubview:_imgView];
}
@end