目录
Demo效果截图
使用到NSAttributedString
UILabel加载HTML
UITextView加载HTML
最后
源代码
关注我
首页 web前端 html教程 UITextView和UILabel加载HTML_html/css_WEB-ITnose

UITextView和UILabel加载HTML_html/css_WEB-ITnose

May 25, 2018 pm 01:38 PM

前言

最近有不少朋友们、群友们经常问到UITextView如何加载HTML?UILabel能加载HTML吗?或者问后台接口返回来的是HTML格式的数据,我该怎么显示呢?怎么处理呢?

在这里,笔者针对这些朋友、群友们的反馈,尝试写了个小demo,希望能够帮助到大家吧!

Demo效果截图

这demo中是放在cell里面加载的,并且教大家如何自动计算行高。不过UITextView计算行高是有误差的,因为笔者没有使用更高级的处理,直接使用了sizeThatFits这个API来计算高度。而UITextView天生就不一样,它有上、下、左、右的间隔的,因此计算出来是有一点小偏差的。

本篇文章只讲如何加载,不讲如何精确计算!

使用到NSAttributedString

通过它就可以设置加载HTML。但是,要让UILabel可以加载HTML,要求在iOS7之后才可以使用:

 - (nullableinstancetype)initWithData:(NSData *)dataoptions:(NSDictionary*)optionsdocumentAttributes:(NSDictionary* __nullable* __nullable)dicterror:(NSError **)errorNS_AVAILABLE(10_0, 7_0);
登录后复制

其中,options中的指定key为:

 UIKIT_EXTERN NSString * const NSDocumentTypeDocumentAttribute NS_AVAILABLE(10_0, 7_0);
登录后复制

时,它可以选择的值有:

 UIKIT_EXTERN NSString * const NSPlainTextDocumentType NS_AVAILABLE(10_0, 7_0);UIKIT_EXTERN NSString * const NSRTFTextDocumentType NS_AVAILABLE(10_0, 7_0);UIKIT_EXTERN NSString * const NSRTFDTextDocumentType NS_AVAILABLE(10_0, 7_0);UIKIT_EXTERN NSString * const NSHTMLTextDocumentType NS_AVAILABLE(10_0, 7_0);
登录后复制

其中,NSHTMLTextDocumentType就是设置要加载HTML了。

UILabel加载HTML

UILabel在iOS6.0后提供了一个属性用于设置各种呈现的样式:

 @property(null_resettable,copy) NSAttributedString *attributedText NS_AVAILABLE_IOS(6_0);
登录后复制
登录后复制

虽然attributedText属性是iOS6就可以使用,但是对于加载HTML,要求是在iOS7以上才能使用:

 // ios 7.0以后才能使用NSData *data = [model.htmldataUsingEncoding:NSUnicodeStringEncoding];NSDictionary *options = @{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType};NSAttributedString *html = [[NSAttributedString alloc]initWithData:data                                                            
 options:options                                                 
 documentAttributes:nil                                                              error:nil];self.htmlLabel.attributedText = html;
登录后复制

UITextView加载HTML

UITextView也提供了相关设置文本样式的属性:

 @property(null_resettable,copy) NSAttributedString *attributedText NS_AVAILABLE_IOS(6_0);
登录后复制
登录后复制

与UILabel类似,虽然attributedText属性是iOS6就可以使用,但是对于加载HTML,要求是在iOS7以上才能使用:

 // ios 7.0以后才能使用NSData *data = [model.htmldataUsingEncoding:NSUnicodeStringEncoding];NSDictionary *options = @{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType};NSAttributedString *html = [[NSAttributedString alloc]initWithData:data                                                            
 options:options                                                 
 documentAttributes:nil                                                              
 error:nil];self.textView.attributedText = html; // 加载HTML后,还要设置行高约束,否则高度就是0CGFloat screenWidth = [UIScreen mainScreen].bounds.size.width;[self.textViewmas_updateConstraints:^(MASConstraintMaker *make) {  make.height.mas_equalTo([self.textViewsizeThatFits:CGSizeMake(screenWidth - 20, CGFLOAT_MAX)].height);}];
登录后复制

在加载好HTML后,也要设置其高度,但是要注意,sizeThatFits:这个API计算UITextView的高度是不精准的,有一定的误差。

最后

顺便说一下,属性中指定的类型null_resettable是什么鬼?这是新特性啦,从英文角度看就大概可以看出来意思是 可空、可重新设置值

源代码

大家只可以下载本篇文章中所关联的小demo,仅供参考!

下载地址: CoderJackyHuang 欢迎关注笔者的GITHUB地址,关注标哥的技术博客!

关注我

关注 账号 备注
Swift/ObjC技术群一 324400294 群一若已满,请申请群二
Swift/ObjC技术群二 494669518 群二若已满,请申请群三
Swift/ObjC技术群三 461252383 群三若已满,会有提示信息
关注微信公众号 iOSDevShares 关注微信公众号,会定期地推送好文章
关注新浪微博账号 标哥Jacky 关注微博,每次发布文章都会分享到新浪微博
关注标哥的GitHub CoderJackyHuang 这里有很多的Demo和开源组件
关于我 进一步了解标哥 如果觉得文章对您很有帮助,可捐助我!

版权声明:本文为【标哥的技术博客】原创出品,欢迎转载,转载时请注明出处!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1664
14
CakePHP 教程
1421
52
Laravel 教程
1315
25
PHP教程
1266
29
C# 教程
1239
24
了解HTML,CSS和JavaScript:初学者指南 了解HTML,CSS和JavaScript:初学者指南 Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML,CSS和JavaScript:Web开发人员的基本工具 HTML,CSS和JavaScript:Web开发人员的基本工具 Apr 09, 2025 am 12:12 AM

HTML、CSS和JavaScript是Web开发的三大支柱。1.HTML定义网页结构,使用标签如、等。2.CSS控制网页样式,使用选择器和属性如color、font-size等。3.JavaScript实现动态效果和交互,通过事件监听和DOM操作。

HTML:结构,CSS:样式,JavaScript:行为 HTML:结构,CSS:样式,JavaScript:行为 Apr 18, 2025 am 12:09 AM

HTML、CSS和JavaScript在Web开发中的作用分别是:1.HTML定义网页结构,2.CSS控制网页样式,3.JavaScript添加动态行为。它们共同构建了现代网站的框架、美观和交互性。

HTML,CSS和JavaScript的未来:网络开发趋势 HTML,CSS和JavaScript的未来:网络开发趋势 Apr 19, 2025 am 12:02 AM

HTML的未来趋势是语义化和Web组件,CSS的未来趋势是CSS-in-JS和CSSHoudini,JavaScript的未来趋势是WebAssembly和Serverless。1.HTML的语义化提高可访问性和SEO效果,Web组件提升开发效率但需注意浏览器兼容性。2.CSS-in-JS增强样式管理灵活性但可能增大文件体积,CSSHoudini允许直接操作CSS渲染。3.WebAssembly优化浏览器应用性能但学习曲线陡,Serverless简化开发但需优化冷启动问题。

HTML的未来:网络设计的发展和趋势 HTML的未来:网络设计的发展和趋势 Apr 17, 2025 am 12:12 AM

HTML的未来充满了无限可能。1)新功能和标准将包括更多的语义化标签和WebComponents的普及。2)网页设计趋势将继续向响应式和无障碍设计发展。3)性能优化将通过响应式图片加载和延迟加载技术提升用户体验。

HTML与CSS vs. JavaScript:比较概述 HTML与CSS vs. JavaScript:比较概述 Apr 16, 2025 am 12:04 AM

HTML、CSS和JavaScript在网页开发中的角色分别是:HTML负责内容结构,CSS负责样式,JavaScript负责动态行为。1.HTML通过标签定义网页结构和内容,确保语义化。2.CSS通过选择器和属性控制网页样式,使其美观易读。3.JavaScript通过脚本控制网页行为,实现动态和交互功能。

HTML:建立网页的结构 HTML:建立网页的结构 Apr 14, 2025 am 12:14 AM

HTML是构建网页结构的基石。1.HTML定义内容结构和语义,使用、、等标签。2.提供语义化标记,如、、等,提升SEO效果。3.通过标签实现用户交互,需注意表单验证。4.使用、等高级元素结合JavaScript实现动态效果。5.常见错误包括标签未闭合和属性值未加引号,需使用验证工具。6.优化策略包括减少HTTP请求、压缩HTML、使用语义化标签等。

HTML的角色:构建Web内容 HTML的角色:构建Web内容 Apr 11, 2025 am 12:12 AM

HTML的作用是通过标签和属性定义网页的结构和内容。1.HTML通过到、等标签组织内容,使其易于阅读和理解。2.使用语义化标签如、等增强可访问性和SEO。3.优化HTML代码可以提高网页加载速度和用户体验。

See all articles