微软开源Sketch2Code可自动生成HTML 代码 | 《Linux就该这么学》
2018-09-22 12:04
1456 查看
导读 | Sketch2Code 是一个基于 Web 的解决方案,使用 AI 将手绘的用户界面草图转换为可用的 HTML 代码。Sketch2Code 由微软和 Kabel、Spike Techniques 合作开发。读者可以在 GitHub 上找到与 Sketch2Code 相关的代码、解决方案开发过程和其他详细信息。 |
让我们来看看使用 Sketch2Code 将手绘草图转换成 HTML 代码的过程:
用户将图片上传到网站上。
自定义视觉模型预测在图像中出现的 HTML 元素,并将它们的位置标出来。
手写文本识别服务读取预测元素中的文本。
布局算法根据预测元素的边框空间信息生成网格结构。
HTML 生成引擎使用上述信息来生成 HTML 代码。
工作流程如下所示:
Sketch2Code 使用了以下组件:
微软自定义视觉模型(Custom Vision):这个模型是基于不同的手绘稿的图象训练得出的,并标记了与常见 HTML 元素(如文本框、按钮、图像等)相关的信息。
微软计算机视觉服务:用于识别设计元素中的文本。
Azure Blob Storage:保存与 HTML 生成过程的每个步骤相关的信息,包括原始图像、预测结果、布局和分组信息等。
Azure Function:它作为后端入口点,通过与其他服务发生交互来协调生成过程。
Azure Website:用户界面前端,用户可以在这里上载设计图,并查看生成的 HTML。
以上组件通过如下架构组合在一起:
原文来自:https://www.oschina.net/p/sketch2code
本文地址:https://www.linuxprobe.com/html-sketch2code-microsoft.html
编辑:韩江雪,审核员:逄增宝
[/i]
分享到QQ空间
[/i]
保存至印象笔记
[/i]
分享到微博
[/i]
分享到微信
打开微信“扫一扫”,打开网页后点击屏幕右上角分享按钮
为您推荐一些与本文相关的文章:
人像模式的灯光效果?iPhone 8开挂袭来极具影响力的Apple Lisa操作系统将开源
HTTP/HTTPS自动加密上网方案
Linux Kernel 4.9正式版发布喽!
或许是 Nginx 上配置 HTTP2 最实在的教程了
AV Linux发布新版本:优化音频和视频处理功能
上市!互联网企业的救命稻草?
Linux I/O多路复用
《嵌入式Linux网络体系结构设计与TCP/IP协议栈》pdf电子书免费下载
Facebook联合创始人认为数字经济将继续摧毁美国就业机会
2fc1
!
相关文章推荐
- PHP定时自动生成静态HTML的实现代码
- PHP定时自动生成静态HTML的实现代码
- SSH开源自动生成代码工具,可自动生成action、service、form、dao、model、vo、sqlmap.xml、.hbm.xml、test等
- Android Studio插件-自动根据布局生成Activity等代码(开源)
- Go 语言,开源服务端代码自动生成 框架
- 前端慌不慌?用深度学习自动生成HTML代码
- PHP定时自动生成静态HTML的实现代码
- sharepoint 2013 中自建母版页,自动生成html中的顶部导航代码步骤
- 开源!开源!我写的Anto.exe C#代码自动生成工具.欢迎下载。。
- 自动识别HTML代码里的图片链接,并下载到服务器的指定目录(开源)
- Android Studio插件-自动根据布局生成Activity等代码(插件代码开源)
- 使用node自动生成html并调用cmd命令提交代码到仓库
- Android Studio插件-自动根据布局生成Activity等代码(插件代码开源)
- 自动生成变色字体html代码
- Go 语言,开源服务端代码自动生成 框架 - EasyGoServer
- sharepoint 2013 中自建母版页,自动生成html中的顶部导航代码步骤
- [Android实例] Android Studio插件-自动根据布局生成Activity等代码1.4 (开源)(申明:来源于网络)
- 惊不惊喜, 用深度学习 把设计图 自动生成HTML代码 !
- 附加题 及 示例代码(写HTML文件):根据给定的博客名单,自动生成HTML网页
- vs2010代码注释自动生成api文档(Sandcastle帮助文档生成器使用介绍)