Muhammad Salman Javed
Muhammad Salman Javed

Reputation: 23

Change fontsize while scaling textbox in fabricjs

I am trying to change fontsize of textbox instead of scale because while scaling. I have a textbox with multiple fontsize applied to characters/words. I want to change each individual characters/words fontsize with respect to scale

if (object.styles) {
                                var styles = object.styles;
                                for (var row in styles) {
                                    for (var char in styles[row]) {
                                        if ('fontSize' in styles[row][char]) {
                                            activeObject.selectionStart = styles[row][char];
                                            activeObject.selectionEnd = activeObject.selectionStart + 1;
                                            var seletedText = activeObject.getSelectedText();
                                            if(styles[row][char]['fontSize']){
                                                var selectedFontSize = styles[row][char]['fontSize'] * activeObject.scaleX;
                                                selectedFontSize = selectedFontSize.toFixed(0);
                                            }else{
                                                var selectedFontSize = activeObject.fontSize * activeObject.scaleX;
                                                selectedFontSize = selectedFontSize.toFixed(0);
                                            }
                                            styles[row][char]['fontSize'] = selectedFontSize;
                                            // $scope.setStyle(activeObject, 'fontSize',selectedFontSize);
                                            $scope.selectedFontSize = activeObject.fontSize * activeObject.scaleX;
                                            activeObject.selectedFontSize = $scope.selectedFontSize;
                                            // activeObject.text.slice(activeObject.selectionStart, activeObject.selectionEnd);
                                            // delete styles[row][char]['fontSize'];


                                        }
                                    }
                                }
                            }

Upvotes: 0

Views: 2654

Answers (1)

Rajat Jain
Rajat Jain

Reputation: 134

>  canvas.on('text:changed', function (opt) {
>             var t1 = opt.target;
>             PreventMovingoutsidecanvas(opt);
>             PreventWidth(opt);
>             if (t1.width > t1.fixedWidth) {
>                 t1.fontSize *= (t1.fixedWidth+20) / (t1.width);
>                 t1.width = t1.fixedWidth;         
>             }
>            
>         });

you can use this to change the font size while typing the text in fabric itext.

Upvotes: 0

Related Questions