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

今天公司搬家了,坐着班车的感觉也是挺有意思的,八成是以前总是走几分钟就到公司没体会过坐班车吧,第一次坐感觉还不错(估计坐时间长了会厌烦),这篇也是我在 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

哈哈,处理完毕,挺简单吧,欢迎留言哈~




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值