一点view视图的封装

        应该很长时间了,朋友给了一个项目源码,让我从中学习一下。之前看他的项目的时候感觉逻辑很复杂,也不知道用的什么设计模式。感觉他就是把很复杂的View自己封装了一下,然后留出本视图和父视图交互的方法。

        可能是机遇的问题,一直没有遇到很复杂的界面,技术成长的也很慢。在现在的公司,刚完成了一个小小项目。老板让UI给了设计图,让我按着设计图改。在这过程中虽然要改的很多,有的功能可能需要重写。很高兴,也暴露出了自己的水平,改了一个界面,认认真的改了半天,把之前的删了,按设计的重新写。

        我封装的小视图是下面带有蓝色按钮的那个视图,那四个按钮放在了一个View里面,然后和黑色透明的部分一起放到封装的view里面。

很low的小小项目图片

子视图与父视图交互使用Block,在要疯转的子视图中添加了一个block属性。

 @property (nonatomic, copy)void(^OrderBtnAction)(UIButton *btn);

我选择了根据按钮的题目创建按钮

- (instancetype) initWithFrame:(CGRect)frame AndBtnTitles:(NSArray *)titles;

在.m文件中,我声明了一个数组btnArray来存放各个按钮,以后用用这些按钮,把他们设置为非选中状态,还声明了一个数组的个数btnNum,(现在看来是不需要这个属性了)

@property (nonatomic, assign) NSInteger btnNum;

@property (nonatomic, strong) NSMutableArray *btnArray;

然后就是方法的实现了

- (instancetype)initWithFrame:(CGRect)frame AndBtnTitles:(NSArray *)titles {

self.btnNum = titles.count;

按钮的款

CGFloat btnWidth = kSize(55);

按钮的高

CGFloat btnHeight = kSize(20);

左侧按钮距离边界的距离

CGFloat margin = kSize(8);

按钮之间的距离  

CGFloat space = (frame.size.width - titles.count * btnWidth - margin * 2) / (titles.count - 1);

CGFloat positionX = frame.origin.x;

CGFloat positionY = frame.origin.y;

先设置阴影背景

if (self = [super initWithFrame:CGRectMake(frame.origin.x, frame.origin.y,  kScreenW - positionX,  kScreenH-positionY)]) {

self.backgroundColor = kUIColorFromRGBA(0x000000, 0.4);

再创建承载按钮的view

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)];

view.backgroundColor = kUIColorFromRGB(0xf3f3f3);

[self addSubview:view];

然后循环创建按钮了

for (int i = 0; i < titles.count; i ++) {

UIButton *btn = [[UIButton alloc] init];

[view addSubview:btn];

还使用了Masonry布局

[btn mas_makeConstraints:^(MASConstraintMaker *make) {

make.left.mas_equalTo(margin + (btnWidth + space)*i);

make.centerY.mas_equalTo(0);

make.size.mas_equalTo(CGSizeMake(btnWidth, btnHeight));

}];

[btn setTitle:titles[i] forState:UIControlStateNormal];

[btn setTitle:titles[i] forState:UIControlStateSelected];

btn.titleLabel.font = [UIFont systemFontOfSize:kSize(13)];

[btn setTitleColor:kUIColorFromRGB(0x666666) forState:UIControlStateNormal];

[btn setTitleColor:[UIColor whiteColor] forState:UIControlStateSelected];

设置按钮的背景色,后面有些

[btn setBackgroundColor:kUIColorFromRGB(0x29a0f3) forState:UIControlStateSelected];

非选中后clear颜色就没哟圆角框框了

[btn setBackgroundColor:[UIColor clearColor] forState:UIControlStateNormal];

主页面会根据这个i刷新相应类型的数据的

btn.tag = i;

btn.layer.borderWidth = 0;

btn.layer.cornerRadius = 3;

btn.clipsToBounds = YES;

[btn addTarget:self action:@selector(btnAction:) forControlEvents:UIControlEventTouchUpInside];

默认第一个是选中状态的

if (i == 0) {

btn.selected = YES;

}

[self.btnArray addObject:btn];

}

}

return self;

}

当出发一个按钮事件时,向将其他的按钮变为非选中状态,然后将本按钮设为选中状态。

- (void)btnAction:(UIButton *)sender {

for (int i = 0; i < self.btnNum; i ++) {

((UIButton *)self.btnArray[i]).selected = NO;

}

将本按钮发给主视图

self.OrderBtnAction(sender);

}

- (NSMutableArray *)btnArray {

if(_btnArray == nil) {

_btnArray = [[NSMutableArray alloc] init];

}

return _btnArray;

}


在使用时 创建视图

_orderView = [[JKXOrderView alloc] initWithFrame:CGRectMake(0, kSize(40), kScreenWidth, kSize(36)) AndBtnTitles:@[@"时间降序", @"时间升序", @"重要降序", @"重要升序"]];

先隐藏

_orderView.hidden = YES;

[self.view addSubview:_orderView];

__block typeof(self) bself = self;

点击按钮后

self.orderView.OrderBtnAction = ^(UIButton *btn){

[bself.orderBtn setTitle:@[@"时间降序", @"时间升序", @"重要降序", @"重要升序"][btn.tag] forState:UIControlStateNormal];

设置标签内容

bself.classIndex = btn.tag;

然后刷新了数据

[bself.tableView.mj_header beginRefreshing];

将本按钮设为选中,选中状态底色为蓝色

btn.selected = YES;

然后隐藏自己的视图

bself.orderView.hidden = YES;

和那个三角

bself.triangleView.hidden = YES;


根据状态设置按钮背景色写了一个小分类

- (void)setBackgroundColor:(UIColor *)backgroundColor forState:(UIControlState)state {

[self setBackgroundImage:[UIButton imageWithColor:backgroundColor] forState:state];

}

画一个带颜色的小图片

+(UIImage *)imageWithColor:(UIColor *)color {

CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);

UIGraphicsBeginImageContext(rect.size);

CGContextRef context = UIGraphicsGetCurrentContext();

CGContextSetFillColorWithColor(context, color.CGColor);

CGContextFillRect(context, rect);

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return image;

}

我的十六进制颜色宏

#define kUIColorFromRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]

// 带透明度是十六进制颜色

#define kUIColorFromRGBA(rgbValue,a) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:(a)]


写完了,不知道别人能不能看懂,感觉我表达有问题地的欢迎提意见,我自己是找不到的。

还是希望有同行的大牛帮忙指点指点,感激不尽。公司只有我自己,不知道和谁交流呢。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 195,719评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,337评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 142,887评论 0 324
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,488评论 1 266
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,313评论 4 357
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,284评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,672评论 3 386
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,346评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,644评论 1 293
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,700评论 2 312
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,457评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,316评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,706评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,990评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,261评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,648评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,859评论 2 335

推荐阅读更多精彩内容