简单代码实现九宫格

96
c25b
2018.08.07 15:30 字数 732

电子竞技的发展 www.llsxj.com 利用 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

日记本
Gupao