您的位置:首页 > 产品设计 > UI/UE

iOS 中一个带尖角并且尖角指向固定点的UILabel

2016-01-04 11:57 337 查看
今天公司搬家了,坐着班车的感觉也是挺有意思的,八成是以前总是走几分钟就到公司没体会过坐班车吧,第一次坐感觉还不错(估计坐时间长了会厌烦),这篇也是我在 2016年发的第一篇博客,感觉挺有纪念意义,哈哈,废话不多说了,进入今天的正题,一个带有指向性尖角的UILabel。。

上效果:



上面的就是一个带有指向性尖角的Label,它目前指向的时我定义的一个绿色的Button,指向Button 的左上角,当然我们也可以根据需要让这个带尖角的UILabel 指向不同的点,首先我们要自定义一个UIView ,我的UIView的名字是 test,.h文件:

//
//  test.h
//  testjiantou
//
//  Created by WJHan on 15/12/30.
//  Copyright © 2015年 avepoint. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface test : UIView{
CGPoint origin;//尖角指向的点
CGPoint point;//构建 label的坐标点
CGSize size;//<span style="font-family: Arial, Helvetica, sans-serif;">构建 label的大小</span>
UIFont *font;//label 的字体
UILabel *label;//用于显示文字的label
NSString *title;//label 上显示的文字
UIBezierPath *path;//用于绘制图的path
}
@property (nonatomic, retain) NSString *title;
-(void)set_path;
-(id) init:(CGPoint) p str:(NSString*) str;
-(void)set_point:(CGPoint)p;
-(void) set_title:(NSString*) str;
-(void)reloadData;

@end


.h 文件已经注释的很清楚的 ,下面我们来看看,m 文件的实现吧~

//
//  test.m
//  testjiantou
//
//  Created by WJHan on 15/12/30.
//  Copyright © 2015年 avepoint. All rights reserved.
//

#import "test.h"
#define ORC_RADIUS 8

@implementation test
@synthesize title;
//控件初始化
-(id) init:(CGPoint) p str:(NSString*) str
{
if([super init] == nil)
return nil;
path = [[UIBezierPath alloc] init];
label = [[UILabel alloc] init];
label.numberOfLines = 0;
label.textAlignment = UITextAlignmentCenter;
[label setBackgroundColor: [UIColor clearColor]];
font = [UIFont systemFontOfSize:18.0];
label.font = font;
[self setBackgroundColor: [UIColor clearColor]];
[self setAlpha:0.8];
[self addSubview: label];
[self set_point: p];
[self set_title: str];
return (self);
}
-(void)reloadData
{
[self setNeedsDisplay];
}

-(void)set_point:(CGPoint)p
{
point = p;
}

- (void)drawRect:(CGRect)rect {
[[UIColor redColor] setFill];
[path fill];
}
-(void) set_title:(NSString*) str
{
label.text = str;
CGSize csize;
csize.width = 250;
csize.height = 60;
size = CGSizeMake(90, 30);
label.frame = CGRectMake(30, 10, size.width, size.height);
size.height += 30;
size.width += 60;
double x = point.x - size.width;
double y = point.y - size.height/2;
origin.x = x;
origin.y = y;
self.frame = CGRectMake(origin.x, origin.y, size.width, size.height);
[self set_path];
}

-(void)set_path
{
NSLog(@"bounds %@", NSStringFromCGRect(self.bounds));
NSLog(@"size %@", NSStringFromCGSize(size));
double h = size.height - ORC_RADIUS*3;
CGPoint p = CGPointMake(0, 0);
NSLog(@"1 start point %@", NSStringFromCGPoint(p));

[path moveToPoint:p];
p.x += size.width - ORC_RADIUS*1;
NSLog(@"2 middle point %@", NSStringFromCGPoint(p));

[path addLineToPoint: p];
p.y += ORC_RADIUS;
NSLog(@"3 middle point %@", NSStringFromCGPoint(p));
p.y += h/2;
[path addLineToPoint: p];
p.x += ORC_RADIUS;
p.y +=4;//指向的长度4
[path addLineToPoint: p];
p.x -= ORC_RADIUS;
p.y +=4;
[path addLineToPoint: p];
p.y += h/2;
[path addLineToPoint: p];
p.x -= size.width;
[path addLineToPoint: p];
p.y -=h;
[path addLineToPoint: p];

[path closePath];
}

@end
最后我们就看看这个View 是怎么用的吧~

//
//  ViewController.m
//  testjiantou
//
//  Created by WJHan on 15/12/30.
//  Copyright © 2015年 avepoint. All rights reserved.
//

#import "ViewController.h"
#import "test.h"
@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
[super viewDidLoad];
test *tt = [[test alloc]init:CGPointMake(300, 300) str:@"80 %"];
UIButton *button = [[UIButton alloc]initWithFrame:CGRectMake(300, 300, 20, 20)];
button.backgroundColor = [UIColor greenColor];
[self.view addSubview:tt];
[self.view addSubview:button];
}
@end


哈哈,处理完毕,挺简单吧,欢迎留言哈~
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: