利用 UITableView 实现九宫格布局。具体特点如下：
1、通过KVC的方法方便实现了九宫格，简便了实现的代码；
2、九宫格显示图片的代码，缩小截取固定大小的小图片节省内存；
3、充分利用了分类来实现九宫格；
4. 每个格子都支持点击动作。
#import "ViewController.h"
#import "UITableGridViewCell.h"
#import "UIImageButton.h"
#define kImageWidth 100 //UITableViewCell里面图片的宽度
#define kImageHeight 100 //UITableViewCell里面图片的高度
@interface ViewController ()
@property(nonatomic,strong)UITableView *tableView;
@property(nonatomic,strong)UIImage *image;
@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
self.title=@"九宫格";
self.view.backgroundColor = [UIColor whiteColor];
self.image= [selfcutCenterImage:[UIImageimageNamed:@"macbook_pro.jpg"] size:CGSizeMake(100,100)];
CGSizemSize = [[UIScreenmainScreen]bounds].size;
CGFloatscreenWidth = mSize.width;
CGFloatscreenHeight = mSize.height;
self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, screenWidth, screenHeight) style:UITableViewStylePlain];
[self.view addSubview:_tableView];
self.tableView.dataSource = self;
self.tableView.separatorColor = [UIColor clearColor];
self.tableView.delegate=self;
self.tableView.backgroundColor = [UIColor clearColor];
}
#pragma mark UITable datasource and delegate
-(NSInteger)numberOfSectionsInTableView:(UITableView*)tableView{
return 1;
}
-(NSInteger)tableView:(UITableView*)tableView numberOfRowsInSection:(NSInteger)section{
return 12;
}
-(UITableViewCell*)tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath*)indexPath{
staticNSString*identifier =@"Cell";
//自定义UITableGridViewCell，里面加了个NSArray用于放置里面的3个图片按钮
UITableGridViewCell*cell = [tableViewdequeueReusableCellWithIdentifier:identifier];
if(cell ==nil) {
cell = [[UITableGridViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
cell.selectedBackgroundView = [[UIView alloc] init];
NSMutableArray *array = [NSMutableArray array];
for(inti=0; i<3; i++) {
//自定义继续UIButton的UIImageButton 里面只是加了2个row和column属性
UIImageButton *button = [UIImageButton buttonWithType:UIButtonTypeCustom];
button.bounds=CGRectMake(0,0,kImageWidth,kImageHeight);
button.center=CGPointMake((1+ i) *5+kImageWidth*(0.5+ i) ,5+kImageHeight*0.5);
//button.column = i;
[buttonsetValue:[NSNumbernumberWithInt:i]forKey:@"column"];
[buttonaddTarget:self action:@selector(imageItemClick:) forControlEvents:UIControlEventTouchUpInside];
[buttonsetBackgroundImage:self.image forState:UIControlStateNormal];
[celladdSubview:button];
[arrayaddObject:button];
}
[cellsetValue:arrayforKey:@"buttons"];
}
//获取到里面的cell里面的3个图片按钮引用
NSArray*imageButtons =cell.buttons;
//设置UIImageButton里面的row属性
[imageButtonssetValue:[NSNumbernumberWithInt:indexPath.row]forKey:@"row"];
returncell;
}
-(CGFloat)tableView:(UITableView*)tableView heightForRowAtIndexPath:(NSIndexPath*)indexPath{
return kImageHeight + 5;
}
-(void)tableView:(UITableView*)tableView didSelectRowAtIndexPath:(NSIndexPath*)indexPath{
//不让tableviewcell有选中效果
[tableViewdeselectRowAtIndexPath:indexPath animated:YES];
}
-(void)imageItemClick:(UIImageButton*)button{
NSString*msg = [NSStringstringWithFormat:@"第%i行 第%i列",button.row +1, button.column +1];
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"提示"
message:msg
delegate:nil
cancelButtonTitle:@"好的，知道了"
otherButtonTitles:nil,nil];
[alertshow];
}
#pragma mark 根据size截取图片中间矩形区域的图片 这里的size是正方形
-(UIImage*)cutCenterImage:(UIImage*)image size:(CGSize)size{
CGSizeimageSize = image.size;
CGRectrect;
//根据图片的大小计算出图片中间矩形区域的位置与大小
if(imageSize.width> imageSize.height) {
floatleftMargin = (imageSize.width- imageSize.height) *0.5;
rect =CGRectMake(leftMargin,0, imageSize.height, imageSize.height);
}else{
floattopMargin = (imageSize.height- imageSize.width) *0.5;
rect =CGRectMake(0, topMargin, imageSize.width, imageSize.width);
}
CGImageRefimageRef = image.CGImage;
//截取中间区域矩形图片
CGImageRefimageRefRect =CGImageCreateWithImageInRect(imageRef, rect);
UIImage*tmp = [[UIImagealloc]initWithCGImage:imageRefRect];
CGImageRelease(imageRefRect);
UIGraphicsBeginImageContext(size);
CGRectrectDraw =CGRectMake(0,0, size.width, size.height);
[tmpdrawInRect:rectDraw];
// 从当前context中创建一个改变大小后的图片
tmp =UIGraphicsGetImageFromCurrentImageContext();
// 使当前的context出堆栈
UIGraphicsEndImageContext();
returntmp;
}
@end