周末，對(duì)于年輕人來(lái)說(shuō)，應(yīng)該是很美好的日子。帶著親愛的她/他去逛自己想去的地方，吃想吃的美食，或者是玩想玩的lol。呃...三句終究還是離不開打擼，有毒。而對(duì)于我來(lái)說(shuō)除了一個(gè)人打擼，其它只是想想就好，嗯，想想就好。
ok，閑話不多扯了，回到正題。想著前些天老板兼安卓開發(fā)工程師兼產(chǎn)品經(jīng)理說(shuō)要寫個(gè)界面，我看了一眼跟支付寶手機(jī)充值的頁(yè)面差不多，WK！原來(lái)這公司這么叼(應(yīng)屆生，來(lái)公司才一個(gè)多月，還沒(méi)轉(zhuǎn)正)，不關(guān)后臺(tái)、藍(lán)牙支付牛逼，現(xiàn)在還要搞手機(jī)充值這種業(yè)務(wù)，牛逼的不行。接著老板說(shuō)只是先把界面搭著，充值通道暫時(shí)還沒(méi)有，oo聽到這話就安心了，可是搭這界面我也不會(huì)?。∵@話只能在心里默哀～
看到這個(gè)界面當(dāng)時(shí)第一個(gè)想到的就是按鈕，可是按鈕只有一個(gè)title啊，要是下面是張圖片就好做了，可是又是一個(gè)字體稍微小點(diǎn)的title。接著問(wèn)同學(xué)，同學(xué)說(shuō)用圖片啊，分別設(shè)置normal和highlighted的圖片就好了，多省事！哈哈，是耶，要美工做圖片我啥都不用管，只要寫幾句代碼就好。可是這樣如果以后要改一下文字、文字大小、文字顏色，美工又得重新做，太麻煩了。 下面是關(guān)于ABButton這個(gè)分類的相關(guān)代碼，還有很多需要完善，比如到底該不該提供內(nèi)部的laber給外面調(diào)用，是否還需提供給外面設(shè)置文字顏色大小的方法等等。萬(wàn)一真有大神看到了，有哪里不合適的地方，還請(qǐng)指出來(lái)，真心感激。
1.ABButton
首先，想到的是寫一個(gè)繼承自UIButton的ABButton，給外部提供一個(gè)方法，在需要調(diào)用的地方帶上要設(shè)置的title就好。
/** aStr上面的title bStr下面的title */
- (ABButton *)buttonWithAboveLabelTitle:(NSString *)aStr belowLabelTitle:(NSString *)bStr;
// 注意一下：這里把上下兩個(gè)label拿出來(lái)放在.h文件,是為了方便在調(diào)用的地方可以直接訪問(wèn)到這兩個(gè)屬性
/** aboveLabel */
@property (nonatomic, weak) UILabel *aboveL;
/** belowLabel */
@property (nonatomic, weak) UILabel *belowL;
下面上一下細(xì)節(jié)代碼
/** 設(shè)置按鈕本身相關(guān)屬性 */
- (instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
self.size = CGSizeMake((SCREEN_WIDTH-60)/3, 80);
self.layer.borderColor = ABColor(21, 135, 228, 1.0).CGColor;
self.layer.borderWidth = 1;
self.layer.cornerRadius = 5.0f;
self.backgroundColor = [UIColor whiteColor];
}
return self;
}
/** 初始化上下兩個(gè)Label */
- (ABButton *)buttonWithAboveLabelTitle:(NSString *)aStr belowLabelTitle:(NSString *)bStr {
UILabel *aboveL = [[UILabel alloc] init];
aboveL.text = aStr;
aboveL.font = [UIFont systemFontOfSize:18.0];
aboveL.textColor = ABColor(21, 135, 228, 1.0);
aboveL.textAlignment = NSTextAlignmentCenter;
[self addSubview:aboveL];
self.aboveL = aboveL;
UILabel *belowL = [[UILabel alloc] init];
belowL.text = bStr;
belowL.font = [UIFont systemFontOfSize:14.0];
belowL.textColor = ABColor(78, 157, 232, 1.0);
belowL.textAlignment = NSTextAlignmentCenter;
[self addSubview:belowL];
self.belowL = belowL;
return self;
}
/** 布局兩個(gè)子控件 */
- (void)layoutSubviews {
[super layoutSubviews];
self.aboveL.frame = CGRectMake(0, 15, self.width, 30);
self.belowL.frame = CGRectMake(0, CGRectGetMaxY(self.aboveL.frame), self.width, 20);
}
/** 重寫按鈕高亮狀態(tài)方法 */
- (void)setHighlighted:(BOOL)highlighted {
[super setHighlighted:highlighted];
self.backgroundColor = highlighted ? ABColor(56, 145, 230, 0.9) : [UIColor whiteColor];
self.aboveL.textColor = highlighted ? [UIColor whiteColor] : ABColor(21, 135, 228, 1.0);
self.belowL.textColor = highlighted ? [UIColor whiteColor] : ABColor(78, 157, 232, 1.0);
}
/** 重寫按鈕失效狀態(tài)方法 */
- (void)setEnabled:(BOOL)enabled {
[super setEnabled:enabled];
if (!enabled) {
self.aboveL.textColor = [UIColor lightGrayColor];
self.belowL.textColor = [UIColor lightGrayColor];
self.layer.borderColor = [UIColor lightGrayColor].CGColor;
self.layer.cornerRadius = 5.0f;
}
}
到這里ABButton這個(gè)分類寫完了，再看一下在需要調(diào)用的地方怎么用
for (int i = 0; i < 8; i++) {
ABButton *abBtn = [[ABButton alloc] init];
switch (i) {
case 0:
{
[abBtn buttonWithAboveLabelTitle:@"10元" belowLabelTitle:@"備貨中"];
abBtn.enabled = NO;
}
break;
case 1:
{
[abBtn buttonWithAboveLabelTitle:@"20元" belowLabelTitle:@"售價(jià):19.91"];
}
...
}
int col = i % 3;
abBtn.x = col * (abBtn.width + ABButtonMargin)+20;
int row = i / 3;
abBtn.y = row * (abBtn.height + ABButtonMargin)+180;
[self.view addSubview:abBtn];
[abBtn addTarget:self action:@selector(chargePhone:) forControlEvents:UIControlEventTouchUpInside];
}
是的，就這么簡(jiǎn)單，只需一句代碼就可以創(chuàng)建出來(lái)！
/** 點(diǎn)擊方法 */
-(void)chargePhone:(ABButton*)sender{
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[MBProgressHUD hideHUD];
});
[MBProgressHUD showMessage:[NSString stringWithFormat:@"充值%@", sender.aboveL.text]];
}
ok，ABButton介紹完畢。 這里面定義了一些宏定義，以及self.size、abBtn.x這種可以直接訪問(wèn)視圖的x、y、寬高的是給UIView寫了擴(kuò)展，下面這個(gè)地址有完整的demo。
