最近在寫智能升降桌的項目，項目中最難的應(yīng)該是操作界面的繪制和硬件數(shù)據(jù)交互，今天我給小友們說一下思路和部分代碼。
上面的操作界面是由兩張圖片組成的，但是點擊的效果是用UIBezierPath和CAShapeLayer繪制的，正好覆蓋每一個按鈕，對了，看到上面那個大大的數(shù)字0了嗎？那是新加的字體庫，在這里順便簡書一下添加一個新的字體：
下面廢話不多說上代碼：
Controller.m中：
//? 操作view
ControDeviceBut *controVc = [[ControDeviceBut alloc] initWithFrame:CGRectMake((screenWidth-ViewHeight(200))/2, (CGRectGetHeight(self.view.frame)-ViewHeight(350))/2+ViewHeight(180) ,ViewHeight(200), ViewHeight(200)) ButtonType:ButtonType_Round];
[controVc addTarget:self action:@selector(buttonClick:) forResponseState:ButtonClickType_TouchUpInside];
//? ? [controVc addTarget:self action:@selector(longPressButtonClick:) forResponseState:ButtonClickType_LongPress];
controVc.delegate = self;
[self.view addSubview:controVc];
#pragma mark -? 按鈕單擊事件
-(void)buttonClick:(ControDeviceBut *)button{
}
在ControDeviceBut.h中：
typedef enum ButtonType{
/**
*? 圓形五個按鈕 上下左右 中心
*/
ButtonType_Round=0,
}ButtonType;
typedef enum ButtonClickType
{
//手勢抬起響應(yīng)
ButtonClickType_TouchUpInside=0,
//長按0.5s響應(yīng)
ButtonClickType_LongPress,
}ButtonClickType;
typedef enum SelectButtonPosition{
SelectButtonPosition_Top3 =1,
SelectButtonPosition_Top2 =1<<1 ,
SelectButtonPosition_Top1 =1<<2 ,
SelectButtonPosition_Relase =1<<3,
SelectButtonPosition_Add =1<<4,
}SelectButtonPosition;
@interface ControDeviceBut : UIImageView
{
NSMutableArray *layerArray;
SEL? touchAction;
SEL? longPressAction;
id? handel;
UIGestureRecognizerState responseState;
ButtonType buttonType;
UILabel *titleLabel;
NSTimer *longPressTimer;
UILongPressGestureRecognizer *longPressGestureRecognizer;
//長按手勢未執(zhí)行
BOOL longPressNotComplete ;
}
/** *? 獲取選中位置 */@property (nonatomic) enum SelectButtonPosition selectButtonPosition;
@property (weak,nonatomic)iddelegate;
-(instancetype)initWithFrame:(CGRect)frame ButtonType:(ButtonType)type;
-(void)addTarget:(id)target action:(SEL)action forResponseState:(ButtonClickType)state;
/**
*? 設(shè)置響應(yīng)位置，
*? @param position 可以傳多個參數(shù)
*/
-(void)setResponsePosition:(SelectButtonPosition)position;
在ControDeviceBut.m中：
#define PathKey @"path"
#define PositionKey @"position"
#define PathDic(path,position) [NSDictionary dictionaryWithObjectsAndKeys:path,@"path",position,@"position", nil]
#define OffSet 2.5
@interface ControDeviceBut(){
NSInteger selectTag;
UIButton *saveBut;
}
@property (nonatomic) NSMutableArray *pathArray;
@property (nonatomic,strong)UIImageView *controButImg;
@end
@implementation ControDeviceBut
-(instancetype)initWithFrame:(CGRect)frame ButtonType:(ButtonType)type{
self=[super initWithFrame:frame];
if (!self) {
return nil; ? }
self.userInteractionEnabled=YES;
longPressGestureRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPressGesture:)];
longPressGestureRecognizer.minimumPressDuration=0.05;
longPressGestureRecognizer.allowableMovement = 10;
longPressGestureRecognizer.delegate = self;
[self addGestureRecognizer:longPressGestureRecognizer];
[self creatUI];
return self; ?}
-(void)create{
//自定義界面
?}
// ?如果界面有button
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldReceiveTouch:(UITouch *)touch {
if ([touch.view isKindOfClass:[UIButton class]]){
return NO; ? }
return YES; ? }
#pragma mark - 添加響應(yīng)事件
-(void)addTarget:(id)target action:(SEL)action forResponseState:(ButtonClickType)state{
handel=target;
switch (state) {
case ButtonClickType_LongPress:
longPressAction=action;
break;
case ButtonClickType_TouchUpInside:
touchAction=action;
break;
default:
break;
}
}
#pragma mark - 設(shè)置響應(yīng)位置
-(void)setResponsePosition:(SelectButtonPosition)position{
if (!_pathArray) {
_pathArray=[[NSMutableArray alloc]init];
}else{
[_pathArray removeAllObjects];
}
if (buttonType==ButtonType_Round) {
if (position & SelectButtonPosition_Top3) {
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top3]];
}
if (position & SelectButtonPosition_Top2) {
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top2]];
}
if (position & SelectButtonPosition_Top1) {
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top1]];
}
if (position & SelectButtonPosition_Relase) {
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Relase]];
}
if (position & SelectButtonPosition_Add) {
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Add]];
} ? } ? ?}
#pragma mark - 圓弧貝塞爾曲線
-(NSDictionary *)roundShapWithPosition:(SelectButtonPosition)position{
float radius=CGRectGetWidth(self.frame)/2.0-ViewHeight(7);? //? 顯示點擊顏色的圓半徑
float width=radius-CGRectGetWidth(self.controButImg.frame)/2;? //內(nèi)圓白色
int positionTag=log2(position);
CGPoint center=CGPointMake(CGRectGetWidth(self.frame)/2, CGRectGetHeight(self.frame)/2);
UIBezierPath* bezierPath = [UIBezierPath bezierPath];
float startAngle;
float endAngle;
if (position == SelectButtonPosition_Top1 || position == SelectButtonPosition_Top2 || position == SelectButtonPosition_Top3) {
startAngle = M_PI + positionTag*M_PI/3;
endAngle = startAngle + M_PI/3;
}else if(position == SelectButtonPosition_Relase){
startAngle = 0;
endAngle = startAngle+M_PI/2;
}else{
startAngle = M_PI/2;
endAngle = startAngle+M_PI/2; ? ? }
[bezierPath addArcWithCenter:center radius:radius startAngle:startAngle endAngle:endAngle clockwise:YES];
[bezierPath addArcWithCenter:center radius:radius-width startAngle:endAngle endAngle:startAngle clockwise:NO];
[bezierPath closePath];
return PathDic(bezierPath, [NSNumber numberWithInteger:position]);
}
#pragma mark - 獲取路徑數(shù)組
-(NSMutableArray *)pathArray{
if (!_pathArray) {
_pathArray=[[NSMutableArray alloc]init];
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top3]];
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top2]];
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Top1]];
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Relase]];
[_pathArray addObject:[self roundShapWithPosition:SelectButtonPosition_Add]]; ? }
return _pathArray; ? }
好像就只能寫這么多字了，，請看下面——UI界面2
