IOS7（新UI之自定义UITableViewCell）

ios7 新升级之后界面有了很大的变化，xcode模拟器去掉了手机边框和home键，如果想回到主页面，可以按住shift+comment+r键。废话少说先展示一下新UI下UItableView设置为Group后的效果：

整体界面显得更加简洁，而且UITableViewCell的宽度默认为满屛，也取消了圆角。

下面说下自定义UITableView的过程：

首先在storyboard中给cell拖过来一个UIimageView和两个label 

然后新建一个MyCell类继承自UITableViewCell。

MyCell代码：

[objc]  view plain copy print ?

1. //  MyCell.h  
2. //  XcodeTest  
3. //  
4. //  Created by wildcat on 13-11-7.  
5. //  Copyright (c) 2013年 wildcat. All rights reserved.  
6. //  
7.   
8. #import <UIKit/UIKit.h>  
9.   
10. @interface MyCell : UITableViewCell  
11. @property (weak, nonatomic) IBOutlet UIImageView *myImageView;  
12. @property (weak, nonatomic) IBOutlet UILabel *nameLabel;  
13. @property (weak, nonatomic) IBOutlet UILabel *timeLabel;  
14.   
15. @end  

[objc]  view plain copy print ?

1. //  MyCell.m  
2. //  XcodeTest  
3. //  
4. //  Created by wildcat on 13-11-7.  
5. //  Copyright (c) 2013年 wildcat. All rights reserved.  
6. //  
7.   
8. #import "MyCell.h"  
9.   
10. @implementation MyCell  
11.   
12. - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier  
13. {  
14.     self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];  
15.     if (self) {  
16.         // Initialization code  
17.     }  
18.     return self;  
19. }  
20.   
21. - (void)setSelected:(BOOL)selected animated:(BOOL)animated  
22. {  
23.     [super setSelected:selected animated:animated];  
24.   
25.     // Configure the view for the selected state  
26. }  
27. #pragma mark 设置Cell的边框宽度  
28. - (void)setFrame:(CGRect)frame {  
29.     frame.origin.x += 10;  
30.     frame.size.width -= 22 * 10;  
31.     [super setFrame:frame];  
32. }  
33.   
34. @end  

使用：

在UITableViewController中使用,代码如下：

[objc]  view plain copy print ?

1. //  
2. //  RootViewController.m  
3. //  XcodeTest  
4. //  
5. //  Created by wildcat on 13-11-7.  
6. //  Copyright (c) 2013年 wildcat. All rights reserved.  
7. //  
8.   
9. #import "RootViewController.h"  
10. #import "MyCell.h"  
11. @interface RootViewController ()  
12.   
13. @end  
14.   
15. @implementation RootViewController  
16.   
17. - (id)initWithStyle:(UITableViewStyle)style  
18. {  
19.     self = [super initWithStyle:style];  
20.     if (self) {  
21.         // Custom initialization  
22.     }  
23.     return self;  
24. }  
25.   
26. - (void)viewDidLoad  
27. {  
28.     [super viewDidLoad];  
29.       
30.   
31. }  
32.   
33. - (void)didReceiveMemoryWarning  
34. {  
35.     [super didReceiveMemoryWarning];  
36.     // Dispose of any resources that can be recreated.  
37. }  
38.   
39. #pragma mark - Table view data source  
40.   
41. - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView  
42. {  
43.     return 2;  
44. }  
45.   
46. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section  
47. {  
48.     return 3;  
49. }  
50.   
51. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath  
52. {  
53.     static NSString *CellIdentifier = @"Cell";  
54.     MyCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];  
55.       
56.     if (cell==nil) {  
57.         cell=[[MyCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];  
58.     }  
59.       
60.     cell.nameLabel.text=@"WildCat";  
61.     cell.timeLabel.text=@"2013-11-7";  
62.     return cell;  
63. }  
64.   
65. -(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{  
66.   
67.     return  75.f;  
68. }  
69.   
70.   
71. @end  

修改后的效果：

当然如果你喜欢cell满屏的效果，你完全可以不设cell的宽度。。。

转载请注明：版权所有http://1.wildcat.sinaapp.com/