github: https://github.com/hellovoidworld/HVWWeibo
A.自定义微博cell基本结构
1.需求
- 创建自定义cell的雏形
- cell包含:内容、工具条
- 内容包含:原创内容、转发内容
2.思路
- 使用分层控件,逐层实现
- 分离model和view
- model:数据模型、frame模型
- view:就是控件本身
- frame模型:包含数据模型和子控件frame
- 根据数据模型来决定子控件是否显示(例如转发内容)
cell的view设计雏形:
控件的成员属性层次:
3.实现
(1)创建cell和基本的子控件view
(2)初始化cell,添加内容控件和工具条控件
1 //
2 // HVWStatusCell.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusCell.h"
10 #import "HVWStatusContentView.h"
11 #import "HVWStatusToolbar.h"
12
13 @interface HVWStatusCell()
14
15 /** 微博内容控件 */
16 @PRoperty(nonatomic, weak) HVWStatusContentView *statusContentView;
17
18 /** 微博工具条控件 */
19 @property(nonatomic, weak) HVWStatusToolbar *toolbar;
20
21 @end
22
23 @implementation HVWStatusCell
24
25 - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
26 self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
27
28 if (self) { // 初始化子控件开始
29 // 初始化微博内容控件
30 [self setupStatusContentView];
31
32 // 初始化工具条控件 */
33 [self setupToolbar];
34 }
35
36 return self;
37 }
38
39 /** 初始化微博内容控件 */
40 - (void) setupStatusContentView {
41 HVWStatusContentView *statusContentView = [[HVWStatusContentView alloc] init];
42 self.statusContentView = statusContentView;
43 [self.contentView addSubview:statusContentView];
44 }
45
46 /** 初始化工具条控件 */
47 - (void) setupToolbar {
48 HVWStatusToolbar *toolbar = [[HVWStatusToolbar alloc] init];
49 self.toolbar = toolbar;
50 [self.contentView addSubview:toolbar];
51 }
52
53 @end
(3)初始化内容view
1 //
2 // HVWStatusContentView.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusContentView.h"
10 #import "HVWStatusOriginalView.h"
11 #import "HVWStatusRetweetedView.h"
12
13 @interface HVWStatusContentView()
14
15 /** 原创内容 */
16 @property(nonatomic, weak) HVWStatusOriginalView *originalView;
17
18 /** 转发内容 */
19 @property(nonatomic, weak) HVWStatusRetweetedView *retweetedView;
20
21 @end
22
23 @implementation HVWStatusContentView
24
25 - (instancetype)initWithFrame:(CGRect)frame {
26 self = [super initWithFrame:frame];
27
28 if (self) { // 初始化子控件开始
29 // 初始化原创内容控件
30 [self setupOriginalView];
31
32 // 初始化转发内容控件
33 [self setupRetweetedView];
34 }
35
36 return self;
37 }
38
39 /** 初始化原创内容控件 */
40 - (void) setupOriginalView {
41
42 }
43
44 /** 初始化转发内容控件 */
45 - (void) setupRetweetedView {
46
47 }
48
49 @end
B.cell内部子控件
1.需求
根据微博iOS版,分析一个cell里面有哪些子控件,并实现
2.思路
在每个view里面添加子控件
3.实现
(1)第1层 cell
1 //
2 // HVWStatusCell.h
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import <UIKit/UIKit.h>
10
11 @interface HVWStatusCell : UITableViewCell
12
13 + (instancetype) cellWithTableView:(UITableView *)tableView;
14
15 @end
1 //
2 // HVWStatusCell.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusCell.h"
10 #import "HVWStatusContentView.h"
11 #import "HVWStatusToolbar.h"
12
13 @interface HVWStatusCell()
14
15 /** 微博内容控件 */
16 @property(nonatomic, weak) HVWStatusContentView *statusContentView;
17
18 /** 微博工具条控件 */
19 @property(nonatomic, weak) HVWStatusToolbar *toolbar;
20
21 @end
22
23 @implementation HVWStatusCell
24
25 /** 创建 */
26 + (instancetype) cellWithTableView:(UITableView *)tableView {
27 static NSString *ID = @"HVWStatusCell";
28 HVWStatusCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
29
30 if (nil == cell) {
31 cell = [[self alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:ID];
32 }
33
34 return cell;
35 }
36
37 /** 初始化 */
38 - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
39 self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
40
41 if (self) { // 初始化子控件开始
42 // 初始化微博内容控件
43 [self setupStatusContentView];
44
45 // 初始化工具条控件 */
46 [self setupToolbar];
47 }
48
49 return self;
50 }
51
52 /** 初始化微博内容控件 */
53 - (void) setupStatusContentView {
54 HVWStatusContentView *statusContentView = [[HVWStatusContentView alloc] init];
55 self.statusContentView = statusContentView;
56 [self.contentView addSubview:statusContentView];
57 }
58
59 /** 初始化工具条控件 */
60 - (void) setupToolbar {
61 HVWStatusToolbar *toolbar = [[HVWStatusToolbar alloc] init];
62 self.toolbar = toolbar;
63 [self.contentView addSubview:toolbar];
64 }
65
66 @end
(2)第二层
a.微博内容
1 //
2 // HVWStatusContentView.h
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import <UIKit/UIKit.h>
10
11 @interface HVWStatusContentView : UIView
12
13 @end
1 //
2 // HVWStatusContentView.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusContentView.h"
10 #import "HVWStatusOriginalView.h"
11 #import "HVWStatusRetweetedView.h"
12
13 @interface HVWStatusContentView()
14
15 /** 原创内容 */
16 @property(nonatomic, weak) HVWStatusOriginalView *originalView;
17
18 /** 转发内容 */
19 @property(nonatomic, weak) HVWStatusRetweetedView *retweetedView;
20
21 @end
22
23 @implementation HVWStatusContentView
24
25 - (instancetype)initWithFrame:(CGRect)frame {
26 self = [super initWithFrame:frame];
27
28 if (self) { // 初始化子控件开始
29 // 初始化原创内容控件
30 [self setupOriginalView];
31
32 // 初始化转发内容控件
33 [self setupRetweetedView];
34 }
35
36 return self;
37 }
38
39 /** 初始化原创内容控件 */
40 - (void) setupOriginalView {
41
42 }
43
44 /** 初始化转发内容控件 */
45 - (void) setupRetweetedView {
46
47 }
48
49 @end
b.工具条
1 //
2 // HVWStatusToolbar.h
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import <UIKit/UIKit.h>
10
11 @interface HVWStatusToolbar : UIView
12
13 @end
1 //
2 // HVWStatusToolbar.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusToolbar.h"
10
11 @implementation HVWStatusToolbar
12
13 /** 代码自定义初始化方法 */
14 - (instancetype)initWithFrame:(CGRect)frame {
15 self = [super initWithFrame:frame];
16
17 if (self) {
18 self.backgroundColor = [UIColor greenColor];
19 }
20
21 return self;
22 }
23
24 @end
(3)第3层
a.原创微博
1 //
2 // HVWStatusOriginalView.h
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import <UIKit/UIKit.h>
10
11 @interface HVWStatusOriginalView : UIView
12
13 @end
1 //
2 // HVWStatusOriginalView.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusOriginalView.h"
10
11 @interface HVWStatusOriginalView()
12
13 /** 昵称 */
14 @property(nonatomic, weak) UILabel *nameLabel;
15
16 /** 头像 */
17 @property(nonatomic, weak) UIImageView *iconView;
18
19 /** 微博发表时间 */
20 @property(nonatomic, weak) UILabel *timeLabel;
21
22 /** 微博来源 */
23 @property(nonatomic, weak) UILabel *sourceLabel;
24
25 /** 微博文本内容 */
26 @property(nonatomic, weak) UILabel *textLabel;
27
28 @end
29
30 @implementation HVWStatusOriginalView
31
32
33 /** 代码初始化方法 */
34 - (instancetype)initWithFrame:(CGRect)frame {
35 self = [super initWithFrame:frame];
36
37 if (self) { // 初始化子控件开始
38 // 昵称
39 UILabel *nameLabel = [[UILabel alloc] init];
40 nameLabel.font = HVWStatusOriginalNameFont;
41 self.nameLabel = nameLabel;
42 [self addSubview:nameLabel];
43
44 // 头像
45 UIImageView *iconView = [[UIImageView alloc] init];
46 self.iconView = iconView;
47 [self addSubview:iconView];
48
49 // 发表时间
50 UILabel *timeLabel = [[UILabel alloc] init];
51 self.timeLabel = timeLabel;
52 [self addSubview:timeLabel];
53
54 // 来源
55 UILabel *sourceLabel = [[UILabel alloc] init];
56 self.sourceLabel = sourceLabel;
57 [self addSubview:sourceLabel];
58
59 // 正文
60 UILabel *textLabel = [[UILabel alloc] init];
61 self.textLabel = textLabel;
62 [self addSubview:textLabel];
63 }
64
65 return self;
66 }
67
68 @end
b.转发微博
1 //
2 // HVWStatusRetweetedView.h
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import <UIKit/UIKit.h>
10
11 @interface HVWStatusRetweetedView : UIView
12
13 @end
1 //
2 // HVWStatusRetweetedView.m
3 // HVWWeibo
4 //
5 // Created by hellovoidworld on 15/2/12.
6 // Copyright (c) 2015年 hellovoidworld. All rights reserved.
7 //
8
9 #import "HVWStatusRetweetedView.h"
10
11 @interface HVWStatusRetweetedView()
12
13 /** 昵称 */
14 @property(nonatomic, weak) UILabel *nameLabel;
15
16 /** 微博文本内容 */
17 @property(nonatomic, weak) UILabel *textLabel;
18
19 @end
20
21 @implementation HVWStatusRetweetedView
22
23 /** 代码初始化方法 */
24 - (instancetype)initWithFrame:(CGRect)frame {
25 self = [super initWithFrame:frame];
26
27 if (self) { // 初始化子控件开始
28 // 昵称
29 UILabel *nameLabel = [[UILabel alloc] init];
30 nameLabel.font = HVWStatusOriginalNameFont;
31 self.nameLabel = nameLabel;
32 [self addSubview:nameLabel];
33
34 // 正文
35 UILabel *textLabel = [[UILabel alloc] init];
36 self.textLabel = textLabel;
37 [self addSubview:textLabel];
38 }
39
40 return self;
41 }
42
43 @end