Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.

rectangle.tsx 1.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. import { v4 as uuid } from "uuid"
  2. import * as vec from "utils/vec"
  3. import { RectangleShape, ShapeType } from "types"
  4. import { boundsCache } from "./index"
  5. import { boundsContained, boundsCollide } from "utils/bounds"
  6. import { createShape } from "./base-shape"
  7. const rectangle = createShape<RectangleShape>({
  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 (boundsCache.has(shape)) {
  27. return 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. 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. return shape
  66. },
  67. })
  68. export default rectangle