iOS原生编辑器实现

在手机上进行文本编辑的场景越来越多的出现在日常生活中,而原生的实现要比H5编辑器体验上要强上不少,本文提供了iOS上原生编辑器实现的一个思路。

编辑器参数有三个:分别为占编辑器最大区域的编辑区、编辑器工具栏、已经选中并使用的样式。

@property (nonatomic, strong) UITextView *contentTextView;      //  编辑区
@property (nonatomic, strong) EditTab *toolTab;                 //  编辑器工具栏
@property (nonatomic, strong) NSMutableDictionary *attributes;  //  已使用的样式

EditTab是自定义的视图,用于展示可提供的样式按钮,按钮们添加在一个UICollectionView之中,点击按钮,会通过代理返回按钮所代表的样式。
EditTab.h

@protocol EditTabDelegate 

- (void)setAttribute:(NSDictionary *)dic;

@end

@interface EditTab : UIView

@property (nonatomic, weak) id delegate;

@end

编辑器中点击样式按钮时,分为已选中部分内容与未选中内容两种情况,前者需要实根据所选样式改变选中部分的内容,后者则表示之后输入的内容要符合所选样式。

下面是相关部分的核心逻辑代码

- (EditTab *)toolTab
{
    if(!_toolTab)
    {
        EditTab *toolTab = [EditTab new];
        toolTab.delegate = self;
        toolTab.backgroundColor = self.backgroundColor;
        [self addSubview:toolTab];
        _toolTab = toolTab;
    }
    return _toolTab;
}

#pragma mark EditTabDelegate
- (void)setAttribute:(NSDictionary *)dic
{
    for (NSString *key in dic.allKeys)
    {
        [self.attributes setValue:dic[key] forKey:key];
    }
    NSUInteger selectedRangeLength = self.contentTextView.selectedRange.length;
    if (selectedRangeLength)
    {
        [self resetContentInRange:self.contentTextView.selectedRange];
    }
    else
    {
        self.contentTextView.typingAttributes = self.attributes;
    }
}

#pragma mark PrivateMethod
- (void)resetContentInRange:(NSRange)range
{
    NSMutableAttributedString *contentText = [[NSMutableAttributedString alloc] initWithAttributedString:self.contentTextView.attributedText];
    [contentText setAttributes:self.attributes range:range];
    self.contentTextView.attributedText  = contentText;
    self.contentTextView.selectedRange = range;
}

至此一个文字功能较为完整的iOS编辑器就可以完成了,再结合图文混排的功能,在手机上也可以使用原生编辑器编写内容形式丰富的文章了。

你可能感兴趣的:(iOS原生编辑器实现)