美文网首页程序员
iOS端的富文本编辑器

iOS端的富文本编辑器

作者: 运气不够技术凑 | 来源:发表于2018-08-15 14:44 被阅读53次
富文本.gif

可以进行 文字大小,样式,颜色的修改以及图片的插入。

js端

这个部分我主要参照着网上iOS端富文本开源项目 ZSSRichTextEditor 来进行的编写,下面截取一部分代码。

mail_editor.setBold = function() {

mail_editor.restorerange();
document.execCommand('bold', false, null);
mail_editor.enabledEditingItems();

}

这段代码主要是用来设置选中文本为粗体的js代码。

iOS端

iOS端这边除了基本的界面以外,使用的WebView与js的交互,例如:

- (void) sendMessageToJS:(NSString *)msg
{
[self.editorView stringByEvaluatingJavaScriptFromString:@"mail_editor.prepareInsert();"];
[self.editorView stringByEvaluatingJavaScriptFromString:msg];
[self recordTapEvents:msg];
}

self.editorView 是一个 WebView,这个方法是我封装的一个往js端发送消息的一个方法,传入的字符 msg,是js端的函数名。

一些问题

在项目编写的过程中,主要是处理焦点失去的问题,当点击选择样式的按钮后,会出现WebView里聚集的焦点丢失,这里面需要处理蛮多的问题。

目前做的Demo还存在着一些问题,比如说无法获取当前选中文本的样式(虽然这个问题我觉得可以用遍历节点来解决,但是很麻烦)。

这算是我在实习期做的一个比较全面和核心的东西吧。

Demo地址:https://github.com/bbbbprefect/mailEditor.git

如果有侵犯到其他人的权益,请联系我删除

相关文章

网友评论

    本文标题:iOS端的富文本编辑器

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