Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

rectangle.tsx 1.7KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. import { v4 as uuid } from "uuid"
  2. import * as vec from "utils/vec"
  3. import { RectangleShape, ShapeType } from "types"
  4. import { createShape } from "./index"
  5. import { boundsContained, boundsCollide } from "utils/bounds"
  6. const rectangle = createShape<RectangleShape>({
  7. boundsCache: new WeakMap([]),
  8. create(props) {
  9. return {
  10. id: uuid(),
  11. type: ShapeType.Rectangle,
  12. name: "Rectangle",
  13. parentId: "page0",
  14. childIndex: 0,
  15. point: [0, 0],
  16. size: [1, 1],
  17. rotation: 0,
  18. style: {},
  19. ...props,
  20. }
  21. },
  22. render({ id, size }) {
  23. return <rect id={id} width={size[0]} height={size[1]} />
  24. },
  25. getBounds(shape) {
  26. if (this.boundsCache.has(shape)) {
  27. return this.boundsCache.get(shape)
  28. }
  29. const {
  30. point: [x, y],
  31. size: [width, height],
  32. } = shape
  33. const bounds = {
  34. minX: x,
  35. maxX: x + width,
  36. minY: y,
  37. maxY: y + height,
  38. width,
  39. height,
  40. }
  41. this.boundsCache.set(shape, bounds)
  42. return bounds
  43. },
  44. hitTest(shape) {
  45. return true
  46. },
  47. hitTestBounds(shape, brushBounds) {
  48. const shapeBounds = this.getBounds(shape)
  49. return (
  50. boundsContained(shapeBounds, brushBounds) ||
  51. boundsCollide(shapeBounds, brushBounds)
  52. )
  53. },
  54. rotate(shape) {
  55. return shape
  56. },
  57. translate(shape, delta) {
  58. shape.point = vec.add(shape.point, delta)
  59. return shape
  60. },
  61. scale(shape, scale) {
  62. return shape
  63. },
  64. stretch(shape, scaleX, scaleY) {
  65. shape.size = vec.mulV(shape.size, [scaleX, scaleY])
  66. return shape
  67. },
  68. transform(shape, bounds) {
  69. shape.point = [bounds.minX, bounds.minY]
  70. shape.size = [bounds.width, bounds.height]
  71. return shape
  72. },
  73. })
  74. export default rectangle