概述

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

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

示例

先看图

示例代码

关于如何配置UIWindow进行适配，参看iOS的UI-04-UIWindow
先看一下工程目录结构

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;//视图控制器titleself.title = @"图片墙";//初始化UIScrollViewUIScrollView* 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];//初始化UIImageUIImage* image = [UIImage imageNamed:imgName];//初始化UIImageViewUIImageView* 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];//传递tagvcImgShow.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;@endNS_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

iOS入门-27图片墙相关推荐

老司机 iOS 周报 #27 | 2018-07-16
老司机 iOS 周报,只为你呈现有价值的信息. 你也可以为这个项目出一份力,如果发现有价值的信息.文章.工具等可以到 Issues 里提给我们,我们会尽快处理.记得写上推荐的理由哦.有建议和意见也欢迎 ...
一键拼出你的微信好友图片墙！
点击"小詹学Python",选择"置顶"公众号重磅干货,第一时间送达本文转载自高级农民工,禁二次转载上午发了张微信近 2000 位好友的头像拼图,让大伙儿 ...
按钮图片拉伸_图片墙有多香？高手都在用的PPT封面制作技巧！
大家好,我是李导~ 这次,冬天是真的来了,不知道大家有没有感觉,每次冷空气真正袭来之前我们都会以为今年是个暖冬,结果突然有一天气温从20度直降到个位数,我们都会认为今年比以往的冬天都冷. 但是,再冷的 ...
itchat 保存好友信息以及生成好友头像图片墙
2019 第 41 篇,总第 65 篇文章本文大约 4000 字,阅读大约需要 12 分钟最近简单运用 itchat 这个库来实现一些简单的应用,主要包括以下几个应用: 统计保存好友的数量和信息 ...
iOS 入门——Hello World app
iOS 入门--Hello World app 作为Mac重度使用者以及iOS小白一枚(匿),我将为iOS 10 构建我们的第一个iOS应用程序 (著名的"Hello World" ...
制作关于计算机的ppt图片,10步教你制作图片墙PPT封面
PPT封面设计相信对于很多朋友们来说,一直都是比较头疼的问题.很多朋友在PPT封面时,尤其是PPT图片墙封面时往往得不到其中的设计要领. (电脑入门到精通网 www.58116.cn) 图片墙,是由不 ...
iOS入门指引系列(零)
俗话说的是,万事开头难. 意思是开了头,再把一件事办下去就没有那么难了. 我相信每一个人当想入门一项新技能的时候都有这样的体会吧.特别是现在网络上各式各样的学习资料,文章,这些零星的资料反而让初学者迷 ...
一键拼出你的微信好友图片墙
上午发了张微信近 2000 位好友的头像拼图,让大伙儿看能不能快速找到自己的头像,没想到反响很强烈,引得阵阵惊呼与膜拜,没有料到. 有没有犯密集恐惧症?这并不震撼,如果你有 5000 位好友的话,做出 ...
python代码图片头像_60行Python代码一键拼出你的微信好友图片墙！
原标题:60行Python代码一键拼出你的微信好友图片墙! 源 /高级农民工文 /苏克1900 近 2000 位好友的头像拼图,有没有犯密集恐惧症?这并不震撼,如果你有 5000 位好友的话,做出来的 ...

iOS入门-27图片墙

概述

示例

先看图

示例代码

AppDelegate.h

AppDelegate.m

VCRoot.m

VCImageShow.h

VCImageShow.m

iOS入门-27图片墙相关推荐

最新文章

热门文章