object-sizing.d.ts 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. export declare type ObjectFit = "contain" | "cover";
  2. export declare type ObjectPosition = ["left" | "center" | "right", "top" | "center" | "bottom"];
  3. export interface Size {
  4. width: number;
  5. height: number;
  6. }
  7. /**
  8. * 用于计算图片的宽高比例
  9. * @see https://drafts.csswg.org/css-images-3/#sizing-terms
  10. *
  11. * ## 名词解释
  12. * ### intrinsic dimensions
  13. * 图片本身的尺寸
  14. *
  15. * ### specified size
  16. * 用户指定的元素尺寸
  17. *
  18. * ### concrete object size
  19. * 应用了 `objectFit` 之后图片的显示尺寸
  20. *
  21. * ### default object size
  22. */
  23. export declare function calculateConcreteRect(style: {
  24. /** @see https://developer.mozilla.org/zh-CN/docs/Web/CSS/object-fit */
  25. objectFit?: ObjectFit;
  26. /** @see https://developer.mozilla.org/zh-CN/docs/Web/CSS/object-position */
  27. intrinsicPosition?: ObjectPosition;
  28. specifiedPosition?: [number, number];
  29. }, intrinsicSize: Size, specifiedSize: Size): {
  30. sx: number;
  31. sy: number;
  32. sw: number;
  33. sh: number;
  34. dx: number;
  35. dy: number;
  36. dw: number;
  37. dh: number;
  38. };