iOS 富文本之图文混排(插入图片上传到服务器)

2018-05-24  本文已影响575人  安静就好_

第一版,以实现功能为主,相比较简陋一点,多多包含,先上效果图


9918146F-3D83-40BA-80EB-359D06594273.png

1.先修改键盘上的工具栏

self.contentView.inputAccessoryView = [self createInputAccessoryView];
//键盘上的工具栏
- (UIView *)createInputAccessoryView {
    // 相机
    UIBarButtonItem *item1 = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"edit_pic"] style:UIBarButtonItemStylePlain target:self action:@selector(item1Action)];
    //收起键盘
    UIBarButtonItem *th1 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(cancleClick)];
    //两个item之间的间距
    UIBarButtonItem *th2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
    th1.tintColor = [UIColor blackColor];
    
    UIToolbar *tool = [UIToolbar new];
    [tool sizeToFit];
    [tool setItems:@[item1,th2,th1]];
    return tool;
}

2.相机的点击事件,也就是图片上传服务器的方法

//工具栏的点击事件
- (void)item1Action {

首先将图片上传到你们的服务器(这里需要图片和url)
 
NSTextAttachment* textAttachment = [[NSTextAttachment alloc] init];
//userInfo这个属性需要写延展,在下面
textAttachment.userInfo = 图片的URL;
//照片赋值
textAttachment.image = image;
//设置图片的大小
textAttachment.bounds = CGRectMake(0, 0, myWidth/2, myWidth/2);
//类型转换
NSAttributedString* imageAttachment = [NSAttributedString attributedStringWithAttachment:textAttachment];
NSMutableAttributedString *attriStr = [self.contentView.attributedText mutableCopy];
//获取光标的位置
NSRange range = self.contentView.selectedRange;
//插入
[attriStr insertAttributedString:imageAttachment atIndex:range.location];
//拼接
//[attriStr appendAttributedString:imageAttachment];
self.contentView.attributedText = attriStr; 

}

3.上传服务器的相关操作

正常来说,直接富文本文字转换成HTML格式的字符串上传服务器就可以了。如果没有特殊要求,
上传字符串到服务器就告一段落了。

我们这后台特殊要求,需要转换成字符串,然后图片链接拼接到相对应的位置(可以选择性忽略)
NSString *textStr = [[self textStringWithSymbol:@"[图片]" attributeString:self.contentView.attributedText] mutableCopy];
    int index = 0;
    //通过替换
    if (textStr.length > 3) {
        for (int i = 0; i <= textStr.length - 4; i ++) {
            NSString *tempStr = [textStr substringWithRange:NSMakeRange(i, 4)];
            if ([tempStr isEqualToString:@"[图片]"]) {
                NSString *imgStr = [NSString stringWithFormat:@"<p><img src=\"%@\"></p>",self.imgArray[index]];
                textStr = [textStr stringByReplacingCharactersInRange:NSMakeRange(i, 4) withString:imgStr];
                index ++;
            }
        }
    }

执行上传服务器的操作。
textStr 就是最终上传上传服务器的文本。

下面的方法是将富文本转换成纯文本的信息

/** 将富文本转换为带有图片标志的纯文本*/
- (NSString *)textStringWithSymbol:(NSString *)symbol attributeString:(NSAttributedString *)attributeString{
    NSString *string = attributeString.string;
    //调用的方法在下面
    string = [self stringDeleteString:@"\n" frontString:@"[图片]" inString:string];
    //最终纯文本
    NSMutableString *textString = [NSMutableString stringWithString:string];
    //替换下标的偏移量
    __block NSUInteger base = 0;
    
    //遍历
    [attributeString enumerateAttribute:NSAttachmentAttributeName inRange:NSMakeRange(0, attributeString.length)
                                options:0
                             usingBlock:^(id value, NSRange range, BOOL *stop) {
                                 //检查类型是否是自定义NSTextAttachment类
                                 if (value && [value isKindOfClass:[NSTextAttachment class]]) {
                                     //替换
                                     [textString replaceCharactersInRange:NSMakeRange(range.location + base, range.length) withString:symbol];
                                     //增加偏移量
                                     base += (symbol.length - 1);
                                     //将富文本中最终确认的照片取出来
                                     NSTextAttachment *attachmentImg = (NSTextAttachment *)value;
                                    //将图片存入数组,后面需要用到
                                     [self.imgArray addObject:attachmentImg.userInfo];
                                 }
                             }];
    
    return textString;
}
/** 删除字符串*/
- (NSString *)stringDeleteString:(NSString *)deleteString frontString:(NSString *)frontString inString:(NSString *)inString{
    NSArray *ranges = [self rangeOfSymbolString:frontString inString:inString];
    NSMutableString *mutableString = [inString mutableCopy];
    NSUInteger base = 0;
    for (NSString *rangeString in ranges) {
        NSRange range = NSRangeFromString(rangeString);
        [mutableString deleteCharactersInRange:NSMakeRange(range.location - deleteString.length + base, deleteString.length)];
        base -= deleteString.length;
    }
    return [mutableString copy];
}
/** 统计文本中所有图片资源标志的range*/
- (NSArray *)rangeOfSymbolString:(NSString *)symbol inString:(NSString *)string {
    NSMutableArray *rangeArray = [NSMutableArray array];
    NSString *string1 = [string stringByAppendingString:symbol];
    NSString *temp;
    for (int i = 0; i < string.length; i ++) {
        temp = [string1 substringWithRange:NSMakeRange(i, symbol.length)];
        if ([temp isEqualToString:symbol]) {
            NSRange range = {i, symbol.length};
            [rangeArray addObject:NSStringFromRange(range)];
        }
    }
    return rangeArray;
}

以上是转换成纯文本,然后拼接上url操作,可以选择性忽略。
4.NSTextAttachment 延展,为NSTextAttachment添加一个属性(关键操作)

.h文件
#import <UIKit/UIKit.h>
@interface NSTextAttachment (LMText)
//添加一个属性
@property (nonatomic, strong) id userInfo;

@end

//.m文件
#import "NSTextAttachment+LMText.h"
#import <objc/runtime.h>
@implementation NSTextAttachment (LMText)
static void * keyOfUserInfo = &keyOfUserInfo;
//实现它的set,get方法
- (id)userInfo {
    return objc_getAssociatedObject(self, keyOfUserInfo);
}

- (void)setUserInfo:(id)userInfo {
    objc_setAssociatedObject(self, keyOfUserInfo, userInfo, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

@end
上一篇下一篇

猜你喜欢

热点阅读