美文网首页ios实用开发技巧iOS Development
iOS富文本以及与后台的交互问题

iOS富文本以及与后台的交互问题

作者: CharlesYOO | 来源:发表于2017-03-24 13:29 被阅读0次

虽然对iOS工作有几年了但是没怎么写过文章,一直觉得自己技术还不够,写文章出来有点丢人现眼,但是发现有关iOS富文本编辑这块网上的资料比较少所以想写篇文章分享下自己的心得。

下面是公司要求实现的符文编辑的效果界面

公司要求实现的界面

当时网上调研了很多发现有转html的也有直接原生的,一开始我比较欣赏的的例子是专程html与后台进行交互的贴上地址,还是比较详细的http://www.jianshu.com/p/b2a0528659bd

但是因为还有个安卓端的开发所以我也会 征求下安卓端的意见,他们对于html的不是很满意,安卓对于webview的实现性能比较差,而且还要考虑以后的维护工作,所以最后讨论下来的结果是,移动端转成json文本传输给后台具体结构如下

{

"dataList": [

{

"type": 1,

"content": "我是第一条文本",

"imageWidth": 0,

"imageHeight": 0

},

{

"type": 1,

"content": "我是第二条文本",

"imgWidth": 0,

"imgHeight": 0

},

{

"type": 2,

"content": "http://img.baidu.com/xxx1.jpg",

"imgWidth": 200,

"imgHeight": 200

},

{

"type": 1,

"content": "我是第三条文本",

"imgWidth": 0,

"imgHeight": 0

},

{

"type": 2,

"content": "http://img.baidu.com/xxx2.jpg",

"imgWidth": 200,

"imgHeight": 200

}

]

}

根据type来确定是文本还是图片

而实现这个效果使用原生的开发效果,最后选择了YYText的富文本编辑,最后实现效果是这样子的

实现效果 实现效果

上图为要传输的数据,具体就是进行序列化,转成json文本传给后台大概就这样子了,希望能够帮到大家再附上 yytext附文图片插入的代码

NSMutableAttributedString*string = [[NSMutableAttributedStringalloc]initWithAttributedString:self.textView.attributedText];

UIImage*image = photos[0];

CGFloatscale = image.size.width/(SCREEN_WIDTH-32);

CGFloatphotoHeight = image.size.height/ scale;

YYAnimatedImageView*imageView = [[YYAnimatedImageViewalloc]initWithFrame:CGRectMake(0,16,SCREEN_WIDTH-32, photoHeight)];

//imageView.image = image;

[imageViewyy_setImageWithURL:[NSURLURLWithString:@"https://imgsa.baidu.com/baike/c0%3Dbaike80%2C5%2C5%2C80%2C26/sign=f330fb6cf2d3572c72ef948eeb7a0842/fcfaaf51f3deb48f75b50d5bf01f3a292cf57853.jpg"]options:YYWebImageOptionSetImageWithFadeAnimation];

NSMutableAttributedString*attachText = [NSMutableAttributedStringyy_attachmentStringWithContent:imageViewcontentMode:UIViewContentModeScaleAspectFillattachmentSize:imageView.sizealignToFont:[UIFontsystemFontOfSize:14.fweight:UIFontWeightRegular]alignment:YYTextVerticalAlignmentCenter];

attachText.yy_lineSpacing=5;

[stringappendAttributedString:attachText];

[stringappendAttributedString:[[NSMutableAttributedStringalloc]initWithString:@"\n"]];

//修改行间距

string.yy_font= [UIFontsystemFontOfSize:14.fweight:UIFontWeightRegular];

string.yy_lineSpacing=5;

_textView.font= [UIFontsystemFontOfSize:14.fweight:UIFontWeightRegular];

相关文章

网友评论

    本文标题:iOS富文本以及与后台的交互问题

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