向控件添加自定义删除(后退、前移)按钮

Adding Custom Delete (Back,toFront) Button to Controls(向控件添加自定义删除(后退、前移)按钮)

本文介绍了向控件添加自定义删除(后退、前移)按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道是否有一种简单的方法可以添加删除、放在前面、放在后面将函数添加到现有的 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 :)

这篇关于向控件添加自定义删除(后退、前移)按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:向控件添加自定义删除(后退、前移)按钮

基础教程推荐