javascript - How to make selection highlight transparent in fabricjs IText? -
i'm using jscolor-colorpicker fabricjs-itext in way gives me live preview of color on mouse-move. thing not cool semitransparent selection highlighting messing colorpreview in text-edit mode. ideas on how remove selection highlighting or make selection totally transparent?
i can't find properties in jsdoc relating selection color!? http://fabricjs.com/docs/fabric.itext.html
<input value="ffcc00" id="fill" class="jscolor {onfinechange:'itext_setcolor(this)',hash:true}"> window.itext_setcolor = function(val) { obj = canvas.getactiveobject(); if (obj) { if (obj.isediting) { setstyle(obj, 'fill', '#' +val); } else { obj.setfill('#' + val); } canvas.renderall(); } };
edit 1
thank's @sthayden giving me right answer. here's final working code reappearance of highlighting when text selection changes.
... canvas.on('text:selection:changed', ontextchangeditext); ... function ontextchangeditext() { var obj = canvas.getactiveobject(); if (obj.selectionstart>-1) { obj.set({'selectioncolor':'rgba(17,119,255,0.3)'}); } } window.itext_setcolor = function(val) { obj = canvas.getactiveobject(); if (obj) { if (obj.isediting) { obj.set({'selectioncolor':'transparent'}); setstyle(obj, 'fill', '#' +val); } else { obj.setfill('#' + val); } canvas.renderall(); } };
you have lot of options. property on itext selection color selectioncolor
, can set transparent keyword transparent
or rgba value: rgba(0,0,0,0)
.
if reference itext object can few things:
- change
startselection
,endselection
0. - call
.exitediting()
function on itext object. - just remove itext object active object
.discardactiveobject()
when done letting user pick color can set selection was.
Comments
Post a Comment