问题描述
我想知道是否有一种简单的方法可以添加删除、放在前面、放在后面将函数添加到现有的 fabric.js 对象控件中.
I would like to know if there is an easy way to add a delete, bring to front, bring to back function into the existing fabric.js object controls.
目前我只能点击删除对象、放在前面等按钮.
At the moment I can only click on buttons which would delete object, bring to front etc.
我正在努力寻找能够在对象上按 X(右上角)并删除该对象的解决方案.
我猜这与覆盖、包装或继承现有的控件对象有关.
I guess it will have to do with overwriting, wrapping or subclassing the existing control object.
也许我已经监督了一些事情并且有一个简单的解决方案?请不要使用 Div Wrapper.
Maybe I have overseen something and there is an easy solution? Please no Div Wrapper.
推荐答案
Fabric.js 不提供向对象添加控件的任何简单方法.如果您想创建自己的控件,则必须覆盖 Object 类,特别是:
Fabric.js does not offer any simple mean of adding controls to objects. If you want to create your own controls, you will have to overwrite the Object class, notably:
- 覆盖
drawControls
,绘制自定义按钮 - 您需要存储按钮的坐标,以便检测用户何时单击它们.参考文献
_setCornerCoords
和_findTargetCorner
- 在
__onMouseDown
中的某处合并您的操作
- override
drawControls
, to draw your custom button - you will need to store the button's coordinates, so that you can detect when the user clicks them. C.f.
_setCornerCoords
and_findTargetCorner
- incorporate your action somewhere in
__onMouseDown
您无需处理取消绘制"控件,因为取消选择对象时会重新渲染整个画布.
You don't need to take care of 'undrawing' the controls, as the whole canvas is re-rendered when an object is de-selected.
我希望这会有所帮助,祝你好运:)
I hope this helps, and good luck :)
这篇关于向控件添加自定义删除(后退、前移)按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!