@leafer-ui/image 1.7.0 → 1.8.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer-ui/image",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "description": "@leafer-ui/image",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -22,11 +22,11 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/core": "1.7.0",
-    "@leafer-ui/draw": "1.7.0"
+    "@leafer/core": "1.8.0",
+    "@leafer-ui/draw": "1.8.0"
   },
   "devDependencies": {
-    "@leafer/interface": "1.7.0",
-    "@leafer-ui/interface": "1.7.0"
+    "@leafer/interface": "1.8.0",
+    "@leafer-ui/interface": "1.8.0"
   }
 }

package/src/check.ts

@@ -7,10 +7,8 @@ import { Export } from '@leafer-ui/draw'
 import { createPattern } from './pattern'
 
 
-const { abs } = Math
-
 export function checkImage(ui: IUI, canvas: ILeaferCanvas, paint: ILeafPaint, allowDraw?: boolean): boolean {
-    const { scaleX, scaleY } = ImageManager.patternLocked ? ui.__world : ui.__nowWorld
+    const { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed)
     const { pixelRatio } = canvas, { data } = paint
 
     if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !Export.running)) {
@@ -23,8 +21,8 @@ export function checkImage(ui: IUI, canvas: ILeaferCanvas, paint: ILeafPaint, al
             } else {
                 if (!(paint.changeful || ResizeEvent.isResizing(ui) || Export.running)) {
                     let { width, height } = data
-                    width *= abs(scaleX) * pixelRatio
-                    height *= abs(scaleY) * pixelRatio
+                    width *= scaleX * pixelRatio
+                    height *= scaleY * pixelRatio
                     if (data.scaleX) {
                         width *= data.scaleX
                         height *= data.scaleY
@@ -35,6 +33,10 @@ export function checkImage(ui: IUI, canvas: ILeaferCanvas, paint: ILeafPaint, al
         }
 
         if (allowDraw) {
+            if (ui.__.__isFastShadow) { // fix: 快速阴影时，直接 drawImage 会无阴影，需fill一下
+                canvas.fillStyle = paint.style || '#000'
+                canvas.fill()
+            }
             drawImage(ui, canvas, paint, data) // 直接绘制图像，不生成图案
             return true
         } else {

package/src/data.ts

@@ -12,10 +12,11 @@ const tempScaleData = {} as IScaleData
 const tempImage = {} as IBoundsData
 
 export function createData(leafPaint: ILeafPaint, image: ILeaferImage, paint: IImagePaint, box: IBoundsData): void {
-    const { changeful, sync, editing } = paint
+    const { changeful, sync, editing, scaleFixed } = paint
     if (changeful) leafPaint.changeful = changeful
     if (sync) leafPaint.sync = sync
     if (editing) leafPaint.editing = editing
+    if (scaleFixed) leafPaint.scaleFixed = scaleFixed
     leafPaint.data = getPatternData(paint, box, image)
 }
 
@@ -24,7 +25,7 @@ export function getPatternData(paint: IImagePaint, box: IBoundsData, image: ILea
     if (paint.mode === 'strench' as string) paint.mode = 'stretch' // 兼容代码，后续可移除
 
     let { width, height } = image
-    const { opacity, mode, align, offset, scale, size, rotation, skew, repeat, filters } = paint
+    const { opacity, mode, align, offset, scale, size, rotation, skew, clipSize, repeat, filters } = paint
     const sameBox = box.width === width && box.height === height
 
     const data: ILeafPaintPatternData = { mode }
@@ -60,7 +61,7 @@ export function getPatternData(paint: IImagePaint, box: IBoundsData, image: ILea
             break
         case 'normal':
         case 'clip':
-            if (tempImage.x || tempImage.y || scaleX || rotation || skew) clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew)
+            if (tempImage.x || tempImage.y || scaleX || clipSize || rotation || skew) clipMode(data, box, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, paint.clipSize)
             break
         case 'repeat':
             if (!sameBox || scaleX || rotation) repeatMode(data, box, width, height, tempImage.x, tempImage.y, scaleX, scaleY, rotation, align)

package/src/mode.ts

@@ -1,11 +1,11 @@
-import { IBoundsData, IPointData, IMatrixData, IAlign } from '@leafer/interface'
-import { MatrixHelper } from '@leafer/core'
+import { IBoundsData, IPointData, IMatrixData, IAlign, ISizeData } from '@leafer/interface'
+import { getMatrixData, MatrixHelper } from '@leafer/core'
 
 import { ILeafPaintPatternData } from '@leafer-ui/interface'
 
 
-let origin = {} as IPointData
-const { get, rotateOfOuter, translate, scaleOfOuter, scale: scaleHelper, rotate, skew: skewHelper } = MatrixHelper
+let origin = {} as IPointData, tempMatrix = getMatrixData()
+const { get, rotateOfOuter, translate, scaleOfOuter, multiplyParent, scale: scaleHelper, rotate, skew: skewHelper } = MatrixHelper
 
 export function fillOrFitMode(data: ILeafPaintPatternData, box: IBoundsData, x: number, y: number, scaleX: number, scaleY: number, rotation: number): void {
     const transform: IMatrixData = get()
@@ -16,13 +16,17 @@ export function fillOrFitMode(data: ILeafPaintPatternData, box: IBoundsData, x:
 }
 
 
-export function clipMode(data: ILeafPaintPatternData, box: IBoundsData, x: number, y: number, scaleX: number, scaleY: number, rotation: number, skew: IPointData): void {
+export function clipMode(data: ILeafPaintPatternData, box: IBoundsData, x: number, y: number, scaleX: number, scaleY: number, rotation: number, skew: IPointData, clipSize?: ISizeData): void {
     // rotate -> skew -> scale -> translate
     const transform: IMatrixData = get()
     if (rotation) rotate(transform, rotation)
     if (skew) skewHelper(transform, skew.x, skew.y)
     if (scaleX) scaleHelper(transform, scaleX, scaleY)
     translate(transform, box.x + x, box.y + y)
+    if (clipSize) {
+        tempMatrix.a = box.width / clipSize.width, tempMatrix.d = box.height / clipSize.height
+        multiplyParent(transform, tempMatrix)
+    }
     data.transform = transform
 }
 

package/src/pattern.ts

@@ -1,4 +1,4 @@
-import { Platform, MatrixHelper, ImageManager } from '@leafer/core'
+import { Platform, MatrixHelper } from '@leafer/core'
 
 import { IUI, ILeafPaint, IMatrixData } from '@leafer-ui/interface'
 
@@ -7,16 +7,11 @@ const { get, scale, copy } = MatrixHelper
 const { ceil, abs } = Math
 
 export function createPattern(ui: IUI, paint: ILeafPaint, pixelRatio: number): boolean {
-
-    let { scaleX, scaleY } = ImageManager.patternLocked ? ui.__world : ui.__nowWorld
-
+    let { scaleX, scaleY } = ui.getRenderScaleData(true, paint.scaleFixed)
     const id = scaleX + '-' + scaleY + '-' + pixelRatio
 
     if (paint.patternId !== id && !ui.destroyed) {
 
-        scaleX = abs(scaleX) // maybe -1
-        scaleY = abs(scaleY)
-
         const { image, data } = paint
         let imageScale: number, imageMatrix: IMatrixData, { width, height, scaleX: sx, scaleY: sy, transform, repeat } = data