美文网首页
利用CAShapeLayer在文字上画虚线(UILable举例)

利用CAShapeLayer在文字上画虚线(UILable举例)

作者: 此笙吥涣 | 来源:发表于2018-03-15 14:45 被阅读0次

    今天看到朋友有个需求,是要在lab的文字下画虚线,感觉很有意思就用CAShapeLayer研究了下,来一起看看吧。

    老样子直奔主题上代码:

    [objc] view plaincopy

    <embed id="ZeroClipboardMovie_1" src="https://csdnimg.cn/public/highlighter/ZeroClipboard.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="16" height="16" name="ZeroClipboardMovie_1" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=1&width=16&height=16" wmode="transparent" style="box-sizing: border-box;">

    1. //

    2. // ViewController.m

    3. // DottedLineDemo

    4. //

    5. // Created by a111 on 16/3/16.

    6. // Copyright © 2016年 司小文. All rights reserved.

    7. //

    8. import "ViewController.h"

    9. @interface ViewController ()

    10. @end

    11. @implementation ViewController

      • (void)viewDidLoad {
    12. [super viewDidLoad];

    13. self.view.backgroundColor = [UIColor blackColor];

    14. [self makeDottedLine];

    15. // Do any additional setup after loading the view, typically from a nib.

    16. }

    17. pragma mark 制作虚线

      • (void)makeDottedLine{
    18. //lab

    19. NSString *str = @"此笙吥涣
      的博客:https://www.jianshu.com/u/f61a34028316";

    20. float strFont = 14.;

    21. CGRect labRect = [str boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:strFont]} context:nil];

    22. UILabel *lab = [[UILabel alloc] initWithFrame:CGRectMake((self.view.frame.size.width-labRect.size.width)/2, 100, labRect.size.width,labRect.size.height)];

    23. lab.textColor = [UIColor whiteColor];

    24. lab.text = str;

    25. lab.font = [UIFont systemFontOfSize:strFont];

    26. [self.view addSubview:lab];

    27. //layer

    28. CAShapeLayer *shapeLayer = [CAShapeLayer layer];

    29. [shapeLayer setBounds:lab.bounds];

    30. [shapeLayer setPosition:lab.center];

    31. [shapeLayer setFillColor:[[UIColor redColor] CGColor]];

    32. //设置虚线的颜色 - 颜色请必须设置

    33. [shapeLayer setStrokeColor:[[UIColor whiteColor] CGColor]];

    34. //设置虚线的高度

    35. [shapeLayer setLineWidth:1.0f];

    36. //设置类型

    37. [shapeLayer setLineJoin:kCALineJoinRound];

    38. /*

    39. 10.f=每条虚线的长度

    40. 3.f=每两条线的之间的间距

    41. */

    42. [shapeLayer setLineDashPattern:

    43. [NSArray arrayWithObjects:[NSNumber numberWithInt:10.f],

    44. [NSNumber numberWithInt:3.f],nil]];

    45. // Setup the path

    46. CGMutablePathRef path1 = CGPathCreateMutable();

    47. /*

    48. 代表初始坐标的x,y

    49. x:写-2,是为了视觉上,虚线比文字稍长一点。

    50. y:要和下面的y一样。

    51. */

    52. CGPathMoveToPoint(path1, NULL,-2, lab.frame.size.height);

    53. /*

    54. 代表坐标的x,y

    55. lab.frame.size.width+2:我觉得他代表的意思可以理解为线的长度。

    56. lab.frame.size.height:要与上面的y大小一样,才能使平行的线,不然会画出斜线呦~

    57. */

    58. CGPathAddLineToPoint(path1, NULL, lab.frame.size.width+2,lab.frame.size.height);

    59. //赋值给shapeLayer

    60. [shapeLayer setPath:path1];

    61. //清除

    62. CGPathRelease(path1);

    63. //可以把self改成任何你想要的UIView.

    64. [[self.view layer] addSublayer:shapeLayer];

    65. }

      • (void)didReceiveMemoryWarning {
    66. [super didReceiveMemoryWarning];

    67. // Dispose of any resources that can be recreated.

    68. }

    69. @end

    效果图:

    image

    感谢观看,学以致用更感谢。

    相关文章

      网友评论

          本文标题:利用CAShapeLayer在文字上画虚线(UILable举例)

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