iOS YYText的使用笔记一(YYTextView图文编辑器)

╰半橙微兮° 2023-10-17 17:07 21阅读 0赞

YYText是强大的YYKit的一部分可以单独下载

Github地址 : [https://github.com/ibireme/YYText][https_github.com_ibireme_YYText]

Powerful text framework for iOS to display and edit rich text.  
(It's a component of [YYKit][])

集成的时候建议使用cocopod管理

1.里面主要两个控件：

YYTextView 和 YYLabel

现在主要是YYTextview的简单使用

YYText主要是NSMutableAttributedString来处理富文本 他的内部实现可以自己去深究。

简单的图文并排，使用NSMutableAttributedString 创建一个对象 然后 appendAttributesString来拼接文字和图片(占位)

直接上代码：

**\[html\]** [ view plain][view plain] [ copy][view plain]

1.  //
2.  // TextAndImageTextViewVC.h
3.  // YYTextDemo
4.  //
5.  // Created by linpeng on 16/3/13.
6.  // Copyright © 2016年 ibireme. All rights reserved.
7.  //
8.  
9.  \#import <UIKit/UIKit.h>
10. 
11. @interface TextAndImageTextViewVC : UIViewController
12. 
13. @end

**\[html\]** [ view plain][view plain] [ copy][view plain]

1.  //
2.  // TextAndImageTextViewVC.m
3.  // YYTextDemo
4.  //
5.  // Created by linpeng on 16/3/13.
6.  // Copyright © 2016年 ibireme. All rights reserved.
7.  //
8.  
9.  \#import "TextAndImageTextViewVC.h"
10. \#import "YYText.h"
11. \#import "UIView+YYAdd.h"
12. \#import "YYTextView.h"
13. \#import "YYImage.h"
14. \#import "NSBundle+YYAdd.h"
15. \#import "NSString+YYAdd.h"
16. @interface TextAndImageTextViewVC ()
17. 
18. @end
19. 
20. YYTextView \*textView;
21. @implementation TextAndImageTextViewVC
22. 
23. \- (void)viewDidLoad \{
24. \[super viewDidLoad\];
25. \[self.view setBackgroundColor:\[UIColor whiteColor\]\];
26. 
27. 
28. textView = \[\[YYTextView alloc\] initWithFrame:CGRectMake(0, 0, 0, 0)\];
29. textView.userInteractionEnabled = YES;
30. textView.textVerticalAlignment = YYTextVerticalAlignmentTop;
31. textView.size = CGSizeMake(self.view.frame.size.width, self.view.frame.size.height);
32. 
33. //创建最主要的attribute文本
34. NSMutableAttributedString \*contentText = \[NSMutableAttributedString new\];
35. UIFont \*font = \[UIFont systemFontOfSize:16\];
36. 
37. //图片资源
38. YYImage \*image = \[YYImage imageNamed:@"demo.jpg"\];
39. image.preloadAllAnimatedImageFrames = YES;
40. 
41. //添加文本+图片
42. \[contentText appendAttributedString:\[\[NSAttributedString alloc\] initWithString:@"这是第一站图片" attributes:nil\]\];
43. \{
44. YYAnimatedImageView \*imageView = \[\[YYAnimatedImageView alloc\] initWithImage:image\];
45. imageView.frame = CGRectMake(0, 0, textView.width - 10, textView.width/image.size.width\*image.size.height);
46. NSMutableAttributedString \*attachText = \[NSMutableAttributedString yy\_attachmentStringWithContent:imageView contentMode:UIViewContentModeScaleAspectFit attachmentSize:imageView.size alignToFont:font alignment:YYTextVerticalAlignmentCenter\];
47. \[contentText appendAttributedString:attachText\];
48. \}
49. 
50. //添加文本+图片
51. \[contentText appendAttributedString:\[\[NSAttributedString alloc\] initWithString:@"\\n 接下来是第二张" attributes:nil\]\];
52. 
53. \{
54. YYAnimatedImageView \*imageView2 = \[\[YYAnimatedImageView alloc\] initWithImage:image\];
55. 
56. imageView2.frame = CGRectMake(0, 0, textView.width - 10, textView.width/image.size.width\*image.size.height);
57. NSMutableAttributedString \*attachText2 = \[NSMutableAttributedString yy\_attachmentStringWithContent:imageView2 contentMode:UIViewContentModeScaleAspectFit attachmentSize:imageView2.size alignToFont:font alignment:YYTextVerticalAlignmentCenter\];
58. \[contentText appendAttributedString:attachText2\];
59. \}
60. 
61. textView.attributedText = contentText;
62. \[self.view addSubview:textView\];
63. 
64. //获取图片资源
65. NSArray \*attachments = textView.textLayout.attachments;
66. for(YYTextAttachment \*attachment in attachments)
67. \{
68. YYAnimatedImageView \*imageView = attachment.content;
69. YYImage \*image = (YYImage \*)imageView.image;
70. NSLog(@"获取到图片:%@",image);
71. \}
72. NSArray \*attachmentRanges = textView.textLayout.attachmentRanges;
73. for (NSValue \*range in attachmentRanges)
74. \{
75. NSRange r = \[range rangeValue\];
76. NSLog(@"资源所在位置：%ld 长度: %ld",r.location,r.length);
77. \}
78. \}
79. 
80. \- (void)didReceiveMemoryWarning \{
81. \[super didReceiveMemoryWarning\];
82. // Dispose of any resources that can be recreated.
83. \}
84. 
85. /\*
86. \#pragma mark - Navigation
87. 
88. // In a storyboard-based application, you will often want to do a little preparation before navigation
89. \- (void)prepareForSegue:(UIStoryboardSegue \*)segue sender:(id)sender \{
90. // Get the new view controller using \[segue destinationViewController\].
91. // Pass the selected object to the new view controller.
92. \}
93. \*/
94. 
95. @end

以上代码加上注释应该很容易理解就不多讲了 注意 \\n 这个换行符的使用

看效果图：

（可编辑的文本+图片 有的app需要编辑文章功能 用这个就个可以大体实现了，图片和文本都已经获取到了 到时后对应传到服务器，之前没用YYTextview也实现过这种功能，效果比较差，用这个实现，相当完美，必须给YYText作者点个赞）

![Center][]

[https_github.com_ibireme_YYText]: https://github.com/ibireme/YYText
[YYKit]: https://github.com/ibireme/YYKit
[view plain]: http://blog.csdn.net/linpeng_1/article/details/50879215#
[Center]: https://img-blog.csdn.net/20160313183714325?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center