美文网首页
自己绘制一个带箭头的UIView

自己绘制一个带箭头的UIView

作者: UNforgetta_ab44 | 来源:发表于2017-06-23 14:55 被阅读0次

最近在做项目时老大需要在点按钮上弹出一个带有指向按钮箭头的一个视图,视图上放的是tableview。因此,鄙人在一盏茶的功夫就做好了这个功能,所以我把我开始写的demo上传,希望大家可以相互学习,不足之处请指出来,小弟虚心接受。

1. 第一步,创建一个继承于UIView的一个自定义视图(我起名为CusTomView)。

2.通过drawRect方法绘制自己需要的形状,直接上代码

// drawRect方法

- (void)drawRect:(CGRect)rect {

CGRect frame = rect;

frame.size.height = frame.size.height - 20;

rect = frame;

//调用绘制带箭头的

[self drawArrowRectangle:rect];

}

//绘制带箭头的矩形

-(void)drawArrowRectangle:(CGRect) frame

{

// 获取当前图形,视图推入堆栈的图形,相当于你所要绘制图形的图纸

CGContextRef ctx =UIGraphicsGetCurrentContext();

// 创建一个新的空图形路径。

CGContextBeginPath(ctx);

//启始位置坐标x,y

CGFloat origin_x = frame.origin.x;

CGFloat origin_y = frame.origin.y;

//第一条线的位置坐标

CGFloat line_1_x = frame.size.width;

CGFloat line_1_y = origin_y;

//第二条线的位置坐标

CGFloat line_2_x = line_1_x;

CGFloat line_2_y = frame.size.height;

//第三条线的位置坐标

CGFloat line_3_x = origin_x + frame.size.width / 2;

CGFloat line_3_y = line_2_y;

//尖角的顶点位置坐标

CGFloat line_4_x = line_3_x - 25;

CGFloat line_4_y = line_2_y + 20;

//第五条线位置坐标

CGFloat line_5_x = line_4_x - 25;

CGFloat line_5_y = line_3_y;

//第六条线位置坐标

CGFloat line_6_x = origin_x;

CGFloat line_6_y = line_2_y;

CGContextMoveToPoint(ctx, origin_x, origin_y);

CGContextAddLineToPoint(ctx, line_1_x, line_1_y);

CGContextAddLineToPoint(ctx, line_2_x, line_2_y);

CGContextAddLineToPoint(ctx, line_3_x, line_3_y);

CGContextAddLineToPoint(ctx, line_4_x, line_4_y);

CGContextAddLineToPoint(ctx, line_5_x, line_5_y);

CGContextAddLineToPoint(ctx, line_6_x, line_6_y);

CGContextClosePath(ctx);

CGContextSetFillColorWithColor(ctx, [UIColor redColor].CGColor);

CGContextFillPath(ctx);

}

4.在Controller里直接创建CustomView

CustomView *cus= [[CustomView alloc] initWithFrame:CGRectMake(50, 50, 200, 100)];

[self.view addSubview:cus];

效果如图:

相关文章

  • 自己绘制一个带箭头的UIView

    最近在做项目时老大需要在点按钮上弹出一个带有指向按钮箭头的一个视图,视图上放的是tableview。因此,鄙人在一...

  • 带箭头的UIView

    在网上查资料的时候,看到带箭头的UIView的箭头都是直的,显得很没有平滑感,恰好当时正在写高德地图,高德地图中...

  • 12个iOS技术面试题及答案总结

    一、如何绘制UIView? 绘制一个UIView最灵活的方法就是由它自己完成绘制。实际上你不是绘制一个UIView...

  • 2021年美团 iOS面试题

    一、如何绘制UIView? 绘制一个UIView最灵活的方法就是由它自己完成绘制。实际上你不是绘制一个UIView...

  • iOS经典面试题

    一、如何绘制UIView? 绘制一个UIView最灵活的方法就是由它自己完成绘制。实际上你不是绘制一个UIView...

  • IOS技术面试题总结

    1.如何绘制UIView? 绘制一个UIView最灵活的方法就是由它自己完成绘制。实际上你不是绘制一个UIView...

  • 如何绘制UIView

    绘制一个UIView最灵活的方法就是由它自己完成绘制。实际上你不是绘制一个UIView,而是子类化一个UIView...

  • R如何绘制带箭头的坐标轴

    R绘制带箭头的坐标轴,两个参数需要提前设置 第一,xpd=NA,否则绘制箭头只会显示一半 xpd参数说明:A lo...

  • OC 绘制带箭头的线

    绘图需求需要画带箭头的线,一开始想着绘制箭头好像很简单,类似Window开发有对应的lineCap属性去设置线。O...

  • 面试题:UI绘制原理是怎样的?

    一、UIView的绘制流程 UIView绘制流程 下面我们来对这个流程进行说明: 当我们调用[UIView set...

网友评论

      本文标题:自己绘制一个带箭头的UIView

      本文链接:https://www.haomeiwen.com/subject/eqeccxtx.html