fabric.js 文本的基本屬性以及文字的外描邊,控制器去掉上下左右的拉伸點
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
1. width: 文字的寬度 2. height: 文字的高度 3. top: 文字的頂邊距離 4. left: 文字的左邊距離 5. fill: 文字填充顏色,也可以填充圖片,使用pattern(可以去看文檔,看不懂私聊我) 6. fontFamily: 字體 7. fontSize: 字體大小 8. scaleX: X縮放比例,默認為1 9. scaleY: Y縮放比例,默認為1 10.paintFirst: 先繪制描邊還是填充,默認fill,先繪制填充添加的描邊是內描邊,修改stroke,將變成外描邊 11.strokeWidth: 邊框寬度 12.stroke: 邊框顏色 13.textAlign: 對齊方式 14.textBackgroundColor:'',文字背景顏色 15.lineHeight: 行高 16.overline: 上劃線 17.underline:下劃線 18.padding: 內邊距 19.fontStyle: 樣式,值有:"normal", "italic" or "oblique",默認normal; 20.fontWeight: 文字粗細, 21.path: 文字整體的走向(新增的,我寫文檔的時候處于測試階段);比如實現文字的環繞 22.angle: 旋轉 23.shadow: 文字的陰影,值是new fabric.Shadow() 24.//已上是最近項目所用到的,還在研究文本的多重描邊,更多內容下次更新 正常使用的暫時不做說明類似于:text,IText,rect..等等官網或者其他百度有很多,在這里講一下一些屬性以及方法: 1. canvas.selections=false //設置全部元素不可選擇 2. selectable:false, //禁止選中當前元素 3. hasBorders: false, //不顯示選中時的邊 4. hasControls:false, //不顯示控制的那9個按鈕 1. //選中框有9個點那么對應的就有9個值他們分別是: 2. //ml:左,mb:下,mr:右,mt:上,mtr:旋轉,tl:左上角,bl:左下角,tr:右上角,br:右下角 3. //第一個參數就是值,第二個參數就是狀態,false是隱藏,true顯示,默認true 4. //例如 5. var text = new fabric.IText('hello world', { 6. left: canvas.width / 2, 7. top: canvas.height / 2, 8. fontSize: 40, 9. fontWeight: 'bold' 10.}); 11.canvas.add(text).setActiveObject(text); 12. 13.text['setControlVisible']('ml',false) 14.text['setControlVisible']('mb',false) 15.text['setControlVisible']('mr',false) 16.text['setControlVisible']('mt',false) 還有其他功能,以后補充。 該文章在 2023/5/23 15:23:47 編輯過 |
關鍵字查詢
相關文章
正在查詢... |