当前位置:  开发笔记 > 编程语言 > 正文

用于UI小部件的HTML5 Canvas库

如何解决《用于UI小部件的HTML5Canvas库》经验,为你挑选了2个好方法。

我一直在寻找一个可以帮助嵌入在画布区域中的UI小部件的渲染和功能的库,例如组合框,复选框,单选按钮,文本区域,带滚动条的列表框等,而不会叠加普通的HTML将它们浮动在画布区域的顶部.Flex为Flash提供了所有这些功能,并且有许多Actionscript库可以在Flash"画布"中创建UI小部件组件(可以这么说).这些UI小部件库在某些情况下很好地服务于Flash社区,在HTML5画布中的类似情况下也需要这样做.

有谁知道这些库可以在哪里找到?



1> Simon Sarris..:

我见过没有任何功能不足的ui小部件库,但我保证有一天它们会被制作,只是因为人们会要求它们(出于好的理由或坏的).

HTML5 Canvas规范本身强烈建议不要尝试这样做.正如规范所说:

作者应避免使用canvas元素实现文本编辑控件.这样做有很多缺点:

必须重新实现插入符号的鼠标放置.

必须重新实现插入符号的键盘移动(可能跨行,用于多行文本输入).

必须实现文本字段的滚动(水平对于长行,对于多行输入垂直).

必须重新实现复制和粘贴等本机功能.

必须重新实现诸如拼写检查之类的本机功能.

必须重新实现诸如拖放之类的本机功能.

必须重新实现页面范围文本搜索等本机功能.

必须重新实现特定于用户的本机功能,例如自定义文本服务.这几乎是不可能的,因为每个用户可能安装了不同的服务,并且存在一组无限可能的此类服务.

必须重新实现双向文本编辑.

对于多行文本编辑,必须为所有相关语言实现换行.

必须重新实现文本选择.

必须重新实现拖动双向文本选择.

必须重新实现平台本机键盘快捷方式.

必须重新实现平台本机输入法编辑器(IME).

必须重新实现撤消和重做功能.

必须重新实现诸如插入符号或选择之后的放大率之类的辅助功能.

在Canvas中实现这些类型的事情是一场噩梦,尤其是在今天,相同的字体不仅在每个浏览器中看起来不同,而且在Canvas呈现字体和浏览器呈现字体之间看起来不同.


鉴于已经存在的Canvas UI工具包,它在HTML/CSS中的使用次数不会太多,因为HTML/CSS是尝试设计任何类型的corss-platform,跨浏览器UI的噩梦.这是Canvas UI工具包首先存在的原因之一.
许多开发人员看到在Canvas中重新实现这些东西是丑陋的黑客.你当然是对的,并非所有事情都可以通过叠加HTML元素来完成(通常看起来很丑陋).但我们都希望避免在Flash时代发生的那种令人作呕的页面控制(网页几乎完全放弃了 - 谢天谢地!)我希望我有这样一个图书馆指向你,但是唯一的团队接近的是Mozilla Bespin/Skywriter团队.他们实际上最终完全放弃Canvas并与使用div的Ace合并.
其中许多事情不需要重新实现.并且,对于那些需要重新实现的东西......好吧,这正是询问第三方库背后的重点:那里已经重新实现了什么?:)这应该在Canvas中完成的一个原因是出于图形设计的目的.另一个原因,也许开发人员希望粒子系统以某种方式与文本框进行交互.我可能会想到几十个原因,但在画布区域顶部叠加HTML元素对我来说似乎是一个丑陋的黑客,就像把两个不同的范例拼接在一起一样.

2> 小智..:

斑马虽然Textarea不是很丰富但相当完整.

它获得LGPL许可证.

它的github就在这里.


它现在被许可为LGPL
推荐阅读
可爱的天使keven_464
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有