之前课程代码：
本次教案：
提前布置：
要求学生在课下研究iPhone通讯录的拨号页面，仔细观察都有哪些细节实现
∂
实现效果图：
实施步骤
1、基础UIButton实现自定义按钮
2、实现按钮形状，圆形。
3、为按钮添加属性（数字和字母标签）
4、为自定义按钮实现动画
5、实现拨号键盘中的圆形按钮布局
拨号键盘按钮设计及布局分析：
自定义按钮的实现其实比较简单，只需要实现一个UIButton的派生类就可以了，当然也可以考虑UIControl的子类。
1、圆形按钮的外功控制
//设置圆角半径
self.layer.cornerRadius=self.bounds.size.width/2;
//设置子图层蒙版
self.layer.masksToBounds=YES;
//设置按钮的边框宽度和颜色
self.layer.borderWidth=1.0f;
self.layer.borderColor= [[UIColordarkGrayColor]CGColor];
/*
这里CGColor其实是一个结构体，UIColor的一个成员属性
可以参考：http://www.cnblogs.com/smileEvday/archive/2012/06/05/UIColor_CIColor_CGColor.html
*/
2、动画效果
/*
在UIKit中，系统提供了animate标题打头的属于UIView的类方法让我们可以轻松的制作动画效果，每一个这样的类方法提供了名为animations的block代码块，这些代码会在方法调用后立刻或者延迟一段时间以动画的方式执行。此外，所有这些API的第一个参数都是用来设置动画时长的。
*/
//触摸开始，播放前半部动画
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent*)event{
[supertouchesBegan:toucheswithEvent:event];
//在0.5秒钟的时间内透明度由1.0->.0.2
[UIViewanimateWithDuration:0.5fanimations:^{
self.alpha=0.2f;
}];
}
//触摸结束，播放后半段动画
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent*)event{
[supertouchesEnded:toucheswithEvent:event];
[UIViewanimateWithDuration:0.5fanimations:^{
self.alpha=1.0f;
}];
}
3、属性标签的实现：
数字键1，只显示一个标签，但是位置靠上
*、#、拨号键只显示一个标签，且居中
数字键1，只显示一个标签，但是位置靠上
总结，可以分为两类：
有子标签：所有数字键（包括“1”，可以将其看作子标签不显示的特殊情况）： self.subTitle!=nil
没有子标签的：符号键（*、#）和拨号键（这里不用图标，使用字符“call”）: self.subTitle==nil
使用分支语句，兼容两种按钮（
if(subTitle !=nil){
//添加属性标签：
UILabel*mainLabel = [[UILabelalloc]initWithFrame:CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height/3.0*2)];
mainLabel.text=self.mainTitle;
[mainLabelsetTextAlignment:NSTextAlignmentCenter];
[mainLabelsetTextColor:[UIColordarkGrayColor]];
[mainLabelsetFont:[UIFontfontWithName:@"Heiti SC"size:40.0f]];
[selfaddSubview:mainLabel];
//将mainLabel的中心点移至水平中线1/3点
mainLabel.center=CGPointMake(self.bounds.size.width/2,self.bounds.size.height/3.0+5);
UILabel*subLabel = [[UILabelalloc]initWithFrame:CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height/3.0)];
subLabel.text=self.subTitle;
[subLabelsetTextAlignment:NSTextAlignmentCenter];
[subLabelsetTextColor:[UIColordarkGrayColor]];
//Helvetica字体是西方最常用的一种字体
[subLabelsetFont:[UIFontfontWithName:@"Helvetica"size:10.0f]];
//将subLabel的中心点移至水平中线2/3点
subLabel.center=CGPointMake(self.bounds.size.width/2.0,self.bounds.size.height/3*2);
[selfaddSubview:subLabel];
}else{
// self.titleLabel.text = self.mainTitle;
[selfsetTitle:self.mainTitleforState:UIControlStateNormal];
[selfsetTitleColor:[UIColordarkGrayColor]forState:UIControlStateNormal];
[self.titleLabelsetFont:[UIFontfontWithName:@"Heiti SC"size:40.0f]];
// [self.titleLabel setTextColor:[UIColor darkGrayColor]];
}
4、事件处理，代码同上。
老版本中需发现touchesBegin:和touchesEnded:方法与AddTargart：产生冲突，比较理想的解决办法是自己实现一个类似addTarget的方法，这李没有直接覆盖是因为文档中并没有addTarget方法的详细说明，所以折中自己实现，代码如下：
新版本中发现已经不存在这个问题，所以可以直接使用父类中继承的addTarget方法，因此，处理机制和普通方法没有任何区别。
本模块项目完整代码如下：
MPCircleButton.h
//
// MPCircleButton.h
//仿iPhone电话App_2017
//
// Created by GuoChunlei on 2017/6/26.
// Copyright © 2017年class3g. All rights reserved.
//
#import
@interfaceMPCircleButton :UIButton
//主标签：数字、*、#、Call
@property(nonatomic,strong)NSString*mainTitle;
//子标签：字母
@property(nonatomic,strong)NSString*subTitle;
//设置属性，初始化外观
-(void)setMainTitle:(NSString*)mainTitle andSubTitle:(NSString*) subTitle;
@end
MPCircleButton.m
//
// MPCircleButton.m
//仿iPhone电话App_2017
//
// Created by GuoChunlei on 2017/6/26.
// Copyright © 2017年class3g. All rights reserved.
//
#import"MPCircleButton.h"
@implementationMPCircleButton
-(void)setMainTitle:(NSString*)mainTitle andSubTitle:(NSString*) subTitle{
if(self!=nil) {
self.mainTitle= mainTitle;
self.subTitle= subTitle;
//设置圆角半径
self.layer.cornerRadius=self.bounds.size.width/2;
//设置子图层蒙版
self.layer.masksToBounds=YES;
//设置按钮的边框宽度和颜色
self.layer.borderWidth=1.0f;
self.layer.borderColor= [[UIColordarkGrayColor]CGColor];
/*
这里CGColor其实是一个结构体，UIColor的一个成员属性
可以参考：http://www.cnblogs.com/smileEvday/archive/2012/06/05/UIColor_CIColor_CGColor.html
*/
if(subTitle !=nil){
//添加属性标签：
UILabel*mainLabel = [[UILabelalloc]initWithFrame:CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height/3.0*2)];
mainLabel.text=self.mainTitle;
[mainLabelsetTextAlignment:NSTextAlignmentCenter];
[mainLabelsetTextColor:[UIColordarkGrayColor]];
[mainLabelsetFont:[UIFontfontWithName:@"Heiti SC"size:40.0f]];
[selfaddSubview:mainLabel];
//将mainLabel的中心点移至水平中线1/3点
mainLabel.center=CGPointMake(self.bounds.size.width/2,self.bounds.size.height/3.0+5);
UILabel*subLabel = [[UILabelalloc]initWithFrame:CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height/3.0)];
subLabel.text=self.subTitle;
[subLabelsetTextAlignment:NSTextAlignmentCenter];
[subLabelsetTextColor:[UIColordarkGrayColor]];
//Helvetica字体是西方最常用的一种字体
[subLabelsetFont:[UIFontfontWithName:@"Helvetica"size:10.0f]];
//将subLabel的中心点移至水平中线2/3点
subLabel.center=CGPointMake(self.bounds.size.width/2.0,self.bounds.size.height/3*2);
[selfaddSubview:subLabel];
}else{
// self.titleLabel.text = self.mainTitle;
[selfsetTitle:self.mainTitleforState:UIControlStateNormal];
[selfsetTitleColor:[UIColordarkGrayColor]forState:UIControlStateNormal];
[self.titleLabelsetFont:[UIFontfontWithName:@"Heiti SC"size:40.0f]];
// [self.titleLabel setTextColor:[UIColor darkGrayColor]];
}
}
}
/*
在UIKit中，系统提供了animate标题打头的属于UIView的类方法让我们可以轻松的制作动画效果，每一个这样的类方法提供了名为animations的block代码块，这些代码会在方法调用后立刻或者延迟一段时间以动画的方式执行。此外，所有这些API的第一个参数都是用来设置动画时长的。
*/
//触摸开始，播放前半部动画
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent*)event{
[supertouchesBegan:toucheswithEvent:event];
//在0.5秒钟的时间内透明度由1.0->.0.2
[UIViewanimateWithDuration:0.5fanimations:^{
self.alpha=0.2f;
}];
}
//触摸结束，播放后半段动画
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent*)event{
[supertouchesEnded:toucheswithEvent:event];
[UIViewanimateWithDuration:0.5fanimations:^{
self.alpha=1.0f;
}];
}
//-(void)addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents{
// [super addTarget:target action:action forControlEvents:controlEvents];
//
//
//}
@end
DialPadViewController.m：测试代码
//
// DialPadViewController.m
//仿iPhone通讯录
//
// Created by GuoChunlei on 2017/6/26.
// Copyright © 2017年class3g. All rights reserved.
//
#import"DialPadViewController.h"
#import"MPCircleButton.h"
@interfaceDialPadViewController()
@end
@implementationDialPadViewController
- (void)viewDidLoad {
[superviewDidLoad];
// Do any additional setup after loading the view.
MPCircleButton*testBtn = [[MPCircleButtonalloc]initWithFrame:CGRectMake(100,200,100,100)];
[self.viewaddSubview:testBtn];
[testBtnsetMainTitle:@"2"andSubTitle:@"ABC"];
testBtn.backgroundColor= [UIColororangeColor];
[testBtnaddTarget:selfaction:@selector(onclick:)forControlEvents:UIControlEventTouchUpInside];
MPCircleButton*otherTestBtn = [[MPCircleButtonalloc]initWithFrame:CGRectMake(100,400,100,100)];
[self.viewaddSubview:otherTestBtn];
[otherTestBtnsetMainTitle:@"#"andSubTitle:nil];
otherTestBtn.backgroundColor= [UIColorgreenColor];
// otherTestBtn setTitle:<#(nullable NSString *)#> forState:<#(UIControlState)#>
[otherTestBtnaddTarget:selfaction:@selector(onOtherClick:)forControlEvents:UIControlEventTouchUpInside];
}
-(void)onclick:(MPCircleButton*)btn{
NSLog(@"%@", btn.mainTitle);
}
-(void)onOtherClick:(MPCircleButton*)btn{
NSLog(@"%@", btn.mainTitle);
}
- (void)didReceiveMemoryWarning {
[superdidReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
/*
#pragma mark - Navigation
// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
// Get the new view controller using [segue destinationViewController].
// Pass the selected object to the new view controller.
}
*/
@end
本课习题：
1、完成课程中讲述的拨号键盘全部功能
2、研究尝试实现号码显示标签，如下图所示
