1.初始化控件（按钮控件）
方式1:
UIButton *etbtn1 = [UIButton alloc]initWithFrame:CGRectMake(x起点, y起点, 宽度, 高度);
方式2:(常用方式)
UIButton *etbtn1 = [UIButton buttonWithType:UIButtonTypeCustom];
| UIButtonTye | 按钮风格 |
|---|---|
| UIButtonTypeCustom | 自定义，无风格 |
| UIButtonTypeRoundedRect | 白色圆角矩形，类似偏好设置表格单元或者地址簿卡片 |
| UIButtonTypeDetailDisclosure | 蓝色小箭头按钮，主要做详细说明用 |
| UIButtonTypeInfoDark | 白色背景下使用的深色圆圈信息按钮 |
| UIButtonTypeContactAdd | 蓝色加号(+)按钮，可以放在任何文字旁 |
2.基本属性及用法
- 设置UILable的frame ( 即显示起点坐标（x,y）和宽高(width,height) )
etbtn.frame = CGRectMake(<#x起点#>,<#y起点#>,<#宽度#>,<#高度#>);
- 设置背景颜色
etbtn.backgroundColor = [UIColor redColor];
- 设置标签（即tag值）: 标记当前UIButton 对象,用于其它位置获取改对象使用
etbtn1.tag = 100;
- 设置UIButton的标题及不同状态(正常／选中)下的显示样式
UIControlState状态枚举
/***************UIButton点击状态****************/
UIControlStateApplication;
UIControlStateDisabled; //禁用状态
UIControlStateFocused;
UIControlStateReserved;
UIControlStateHighlighted; // 高亮状态
UIControlStateSelected; // 选择中状态
UIControlStateNormal; // 正常显示状态
/*********************************************/
/****************************方法介绍************************************/
//设置对应状态的标题内容(默认为空)
- (void)setTitle:(NSString *)title forState:(UIControlState)state;
//设置对应状态的标题颜色
- (void)setTitleColor:(UIColor *)color forState:(UIControlState)state;
//设置对应状态的按钮的图片
- (void)setImage:(UIImage *)image forState:(UIControlState)state;
//设置对应状态的按钮背景图片
- (void)setBackgroundImage:(UIImage *)image forState:(UIControlState)state;
//设置对应状态的标题阴影颜色 (在ios3.0使用，配合titleShadowOffset一起使用)
- (void)setTitleShadowColor:(UIColor *)color forState:(UIControlState)state;
/*************************属性使用********************************/
//文字（正常/高亮 两种状态）
[etbtn1 setTitle:@"正常状态文字" forState:UIControlStateNormal];
[etbtn1 setTitle:@"点击状态文字" forState:UIControlStateHighlighted];
//文字颜色（正常/高亮 两种状态）
[etbtn1 setTitleColor:[UIColor yellowColor] forState:UIControlStateNormal];
[etbtn1 setTitleColor:[UIColor purpleColor] forState:UIControlStateHighlighted];
//显示图片（正常/高亮 两种状态）
[etbtn1 setImage:[UIImage imageNamed:@"btn_normal.png"] forState:UIControlStateNormal];
[etbtn1 setImage:[UIImage imageNamed:@"btn_selected.png"] forState:UIControlStateHighlighted];
//显示背景图片（正常/高亮 两种状态）
[etbtn1 setBackgroundImage:[UIImage imageNamed:@"btn_nomarl_Background"] forState:UIControlStateNormal];
[etbtn1 setBackgroundImage:[UIImage imageNamed:@"btn_selected_Background"] forState:UIControlStateHighlighted];
5 获取及时属性
属性列表如下
/**************************************UIButton当前状态下的各种属性（对象）*****************************************************************/
// currentTitle; //当前状态下标题 normal/highlighted/selected/disabled. can return nil /
// currentTitleColor; //当前状态下标题颜色 normal/highlighted/selected/disabled. always returns non-nil. default is white(1,1) /
// currentImage; //当前状态下图片 normal/highlighted/selected/disabled. can return nil /
// currentBackgroundImage; //当前状态下背景图片 normal/highlighted/selected/disabled. can return nil /
/***************************************************************************************************************************************/
使用方法：
UIButton *etbtn = [UIButton buttonWithType:UIButtonTypeCustom];
etbtn.currentTitle; //当前标题，可以是正常或者点击状态
etbtn.currentTitleColor; //当前标题颜色
etbtn.currentImage; //当前图片
etbtn.currentBackgroundImage; //当前背景图片
6.添加点击事件（或者说按钮触发事件）
使用方法如下：
[etbtn1 addTarget:self
action:@selector(_efOnClick:withEvent:) //触发的函数
forControlEvents:UIControlEventTouchUpInside];//设置出发触发状态
- (void)_efOnClick:(UIButton*)btn withEvent:(UIEvent*)event{
//触发函数，在里面进行其它操作
//注意了!!!!!!!!!
//说明：防止用户恶意暴力点击按钮
UITouch *touch = [[event allTouches] anyObject];
if (touch.tapCount == 1) {//当用户瞬间点击次数为1的时候触发
}
}
Button的UIControlEvent触发状态
/********************************UIControlEvent状态列表*************************************/
UIControlEventTouchDown ; // 用户按下时触发
UIControlEventTouchDownRepeat ; // 点击次数大于1时触发
UIControlEventTouchDragInside ; // 当触摸在控件内拖动时触发
UIControlEventTouchDragOutside ; // 当触摸在控件之外拖动时触发
UIControlEventTouchDragEnter ; // 当触摸从控件外拖动到内部时
UIControlEventTouchDragExit ; // 当触摸从控件内拖动到外部时
UIControlEventTouchUpInside ; // 在控件内触摸抬起时
UIControlEventTouchUpOutside ; // 在控件外触摸抬起时
UIControlEventTouchCancel ; // 触摸取消事件，设备被锁上或者电话呼叫打断
UIControlEventValueChanged ; // 当控件的值发生改变时
UIControlEventEditingDidBegin ; // 文本控件开始编辑时
UIControlEventEditingChanged ; // 文本控件的文本改变
UIControlEventEditingDidEnd ; // 文本控件结束编辑时
UIControlEventEditingDidEndOnExit ; // 文本控件内通过按下回车键结束编辑时
UIControlEventAllTouchEvents ; // 所有触摸事件
UIControlEventAllEditingEvents ; // 文本编辑的所有事件，for UITextField
UIControlEventAllEvents ; // 所有事件
/****************************************************************************************/
- 特殊属性
// 每边（左，右，顶部和底部）可以有不同的值。使用UIEdgeInsetsMake功能设置图片和文字的位置(默认为UIEdgeInsetsZero)
UIEdgeInsets contentEdgeInsets;
// 设置标题、图片的边缘值（默认UIEdgeInsetsZero）
UIEdgeInsets titleEdgeInsets;
BOOL reversesTitleShadowWhenHighlighted; // 决定是否点击按钮会导致其发光
BOOL adjustsImageWhenHighlighted; // 决定是否按钮时，突出显示图像的变化。
BOOL adjustsImageWhenDisabled; // 决定是否形象的变化时，该按钮被禁用
BOOL showsTouchWhenHighlighted; // 决定是否点击按钮会导致其发光
- 最后需要将控件添加到父视图上
3.扩展类
- 延伸UIButton的热感应范围（或者说扩展点击范围，不改变原来frame的大小）
- block方式调用与常规方式调用对比
//使用前提条件:导入UIButton+Extern扩展类
//扩展点击范围
[self.evbtn setEnlargeEdgeWithTop:<＃上线距离＃>
right:<＃向右距离＃>
bottom:<＃向下距离＃>
left:<＃向左距离＃>];
//block与常规方式调用对比
/**************************常规方式*****************************/
UIButton *etbtn = [UIButton buttonWithType:UIButtonTypeCustom];
[etbtn1 addTarget:self
action:@selector(_efOnClick:withEvent:) //触发的函数
forControlEvents:UIControlEventTouchUpInside];//设置出发触发状态
- (void)_efOnClick:(UIButton*)btn withEvent:(UIEvent*)event{
//触发函数，在里面进行其它操作
}
/**************************block方式*****************************/
UIButton *etbtn = [UIButton buttonWithType:UIButtonTypeCustom];
__block typeof(self) weakSelf = self;//注意：！！！！避免循环引用造成内测不及时释放
[etbtn addBlockTarget:UIControlEventTouchUpInside block:^(UIEvent *touch) {
//触发函数，在里面进行其它操作
//weakSelft方式调用
}];
UIButton+Extern .h文件
#import <UIKit/UIKit.h>
typedef void (^btnOnClick)(UIEvent*event);
@interface UIButton (Extern)
/**
* 扩展Buttom的点击范围
*
* @param top top 方向延伸
* @param right right 方向延伸
* @param bottom bottom 方向延伸
* @param left left 方向延伸
*/
- (void) setEnlargeEdgeWithTop:(CGFloat)top
right:(CGFloat)right
bottom:(CGFloat)bottom
left:(CGFloat)left;
/**
* 使用Block语法块,addTarget方法
*
* @param event events
* @param action block action
*/
- (void) addBlockTarget:(UIControlEvents)event
block:(btnOnClick)action;
@end
UIButton+Extern .m文件
#import "UIButton+Extern.h"
#import <objc/runtime.h>
@implementation UIButton (Extern)
#pragma mark 添加点击范围扩展
static char topNameKey;
static char rightNameKey;
static char bottomNameKey;
static char leftNameKey;
- (void) setEnlargeEdgeWithTop:(CGFloat) top right:(CGFloat) right bottom:(CGFloat) bottom left:(CGFloat) left{
objc_setAssociatedObject(self, &topNameKey, [NSNumber numberWithFloat:top], OBJC_ASSOCIATION_COPY_NONATOMIC);
objc_setAssociatedObject(self, &rightNameKey, [NSNumber numberWithFloat:right], OBJC_ASSOCIATION_COPY_NONATOMIC);
objc_setAssociatedObject(self, &bottomNameKey, [NSNumber numberWithFloat:bottom], OBJC_ASSOCIATION_COPY_NONATOMIC);
objc_setAssociatedObject(self, &leftNameKey, [NSNumber numberWithFloat:left], OBJC_ASSOCIATION_COPY_NONATOMIC);
}
- (CGRect) enlargedRect{
NSNumber* topEdge = objc_getAssociatedObject(self, &topNameKey);
NSNumber* rightEdge = objc_getAssociatedObject(self, &rightNameKey);
NSNumber* bottomEdge = objc_getAssociatedObject(self, &bottomNameKey);
NSNumber* leftEdge = objc_getAssociatedObject(self, &leftNameKey);
if (topEdge && rightEdge && bottomEdge && leftEdge){
return CGRectMake(self.bounds.origin.x - leftEdge.floatValue,
self.bounds.origin.y - topEdge.floatValue,
self.bounds.size.width + leftEdge.floatValue + rightEdge.floatValue,
self.bounds.size.height + topEdge.floatValue + bottomEdge.floatValue);
} else {
return self.bounds;
}
}
- (UIView*) hitTest:(CGPoint) point withEvent:(UIEvent*) event{
CGRect rect = [self enlargedRect];
if (CGRectEqualToRect(rect, self.bounds)){
return [super hitTest:point withEvent:event];
}
return CGRectContainsPoint(rect, point) ? self : nil;
}
#pragma mark 添加addTarget Block方法
static char overviewKey;
- (void)addBlockTarget:(UIControlEvents)event block:(btnOnClick)action{
//用于给对象添加关联对象，传入 nil 则可以移除已有的关联对象
objc_setAssociatedObject(self, &overviewKey, action, OBJC_ASSOCIATION_COPY_NONATOMIC);
[self addTarget:self action:@selector(_efOnClick: event:) forControlEvents:event];
}
- (void)_efOnClick:(id)sender event:(UIEvent*)event{
btnOnClick block = (btnOnClick)objc_getAssociatedObject(self, &overviewKey);
if (block) {
block(event);
}
}
@end
4.引用其它人扩展类
UIButton包含图片和文字的同时，自定义两元素的布局位置
//使用前提条件：导入下面的Button+CenterImageAndTitle扩展类
UIButton *etbtn = [UIButton buttonWithType:UIButtonTypeCustom];
/**
.
.
.
*/
[etbtn setTitle:@"显示文字" forState:UIControlStateNormal];
[etbtn setImage:[UIImage imageNamed:@"btnImageNoamrl.png"] forState:UIControlStateNormal];
/*************************************使用方式如下5种****************************/
//1.系统默认图片在左，文字在右，间隔为0
[etbtn verticalCenterImageAndTitle:10.0f]; //2.上下居中，图片在上，文字在下
[etbtn horizontalCenterTitleAndImage:50.0f]; //3.左右居中，文字在左，图片在右
[etbtn horizontalCenterImageAndTitle:50.0f]; //4.左右居中，图片在左，文字在右
[etbtn horizontalCenterTitleAndImageLeft:50.0f]; //5.文字居中，图片在左边
[etbtn horizontalCenterTitleAndImageRight:50.0f]; //6.文字居中，图片在右边
.h文件
#import <UIKit/UIKit.h>
@interface UIButton (CenterImageAndTitle)
//上下居中，图片在上，文字在下
- (void)verticalCenterImageAndTitle:(CGFloat)spacing;
- (void)verticalCenterImageAndTitle; //默认6.0
//左右居中，文字在左，图片在右
- (void)horizontalCenterTitleAndImage:(CGFloat)spacing;
- (void)horizontalCenterTitleAndImage; //默认6.0
//左右居中，图片在左，文字在右
- (void)horizontalCenterImageAndTitle:(CGFloat)spacing;
- (void)horizontalCenterImageAndTitle; //默认6.0
//文字居中，图片在左边
- (void)horizontalCenterTitleAndImageLeft:(CGFloat)spacing;
- (void)horizontalCenterTitleAndImageLeft; //默认6.0
//文字居中，图片在右边
- (void)horizontalCenterTitleAndImageRight:(CGFloat)spacing;
- (void)horizontalCenterTitleAndImageRight; //默认6.0
@end
.m文件
#import "UIButton+CenterImageAndTitle.h"
@implementation UIButton (CenterImageAndTitle)
- (void)verticalCenterImageAndTitle:(CGFloat)spacing
{
// get the size of the elements here for readability
CGSize imageSize = self.imageView.frame.size;
CGSize titleSize = self.titleLabel.frame.size;
// lower the text and push it left to center it
self.titleEdgeInsets = UIEdgeInsetsMake(0.0, - imageSize.width, - (imageSize.height + spacing/2), 0.0);
// the text width might have changed (in case it was shortened before due to
// lack of space and isn't anymore now), so we get the frame size again
titleSize = self.titleLabel.frame.size;
// raise the image and push it right to center it
self.imageEdgeInsets = UIEdgeInsetsMake(- (titleSize.height + spacing/2), 0.0, 0.0, - titleSize.width);
}
- (void)verticalCenterImageAndTitle
{
const int DEFAULT_SPACING = 6.0f;
[self verticalCenterImageAndTitle:DEFAULT_SPACING];
}
- (void)horizontalCenterTitleAndImage:(CGFloat)spacing
{
// get the size of the elements here for readability
CGSize imageSize = self.imageView.frame.size;
CGSize titleSize = self.titleLabel.frame.size;
// lower the text and push it left to center it
self.titleEdgeInsets = UIEdgeInsetsMake(0.0, - imageSize.width, 0.0, imageSize.width + spacing/2);
// the text width might have changed (in case it was shortened before due to
// lack of space and isn't anymore now), so we get the frame size again
titleSize = self.titleLabel.frame.size;
// raise the image and push it right to center it
self.imageEdgeInsets = UIEdgeInsetsMake(0.0, titleSize.width + spacing/2, 0.0, - titleSize.width);
}
- (void)horizontalCenterTitleAndImage
{
const int DEFAULT_SPACING = 6.0f;
[self horizontalCenterTitleAndImage:DEFAULT_SPACING];
}
- (void)horizontalCenterImageAndTitle:(CGFloat)spacing;
{
// get the size of the elements here for readability
// CGSize imageSize = self.imageView.frame.size;
// CGSize titleSize = self.titleLabel.frame.size;
self.titleEdgeInsets = UIEdgeInsetsMake(0.0, 0.0, 0.0, - spacing/2);
self.imageEdgeInsets = UIEdgeInsetsMake(0.0, - spacing/2, 0.0, 0.0);
}
- (void)horizontalCenterImageAndTitle;
{
const int DEFAULT_SPACING = 6.0f;
[self horizontalCenterImageAndTitle:DEFAULT_SPACING];
}
- (void)horizontalCenterTitleAndImageLeft:(CGFloat)spacing
{
// get the size of the elements here for readability
// CGSize imageSize = self.imageView.frame.size;
// CGSize titleSize = self.titleLabel.frame.size;
self.imageEdgeInsets = UIEdgeInsetsMake(0.0, - spacing, 0.0, 0.0);
}
- (void)horizontalCenterTitleAndImageLeft
{
const int DEFAULT_SPACING = 6.0f;
[self horizontalCenterTitleAndImageLeft:DEFAULT_SPACING];
}
- (void)horizontalCenterTitleAndImageRight:(CGFloat)spacing
{
// get the size of the elements here for readability
CGSize imageSize = self.imageView.frame.size;
CGSize titleSize = self.titleLabel.frame.size;
// lower the text and push it left to center it
self.titleEdgeInsets = UIEdgeInsetsMake(0.0, - imageSize.width, 0.0, 0.0);
// the text width might have changed (in case it was shortened before due to
// lack of space and isn't anymore now), so we get the frame size again
titleSize = self.titleLabel.frame.size;
// raise the image and push it right to center it
self.imageEdgeInsets = UIEdgeInsetsMake(0.0, titleSize.width + imageSize.width + spacing, 0.0, - titleSize.width);
}
- (void)horizontalCenterTitleAndImageRight
{
const int DEFAULT_SPACING = 6.0f;
[self horizontalCenterTitleAndImageRight:DEFAULT_SPACING];
}
@end
