babylon.rectangle2d.ts 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. module BABYLON {
  2. export class Rectangle2DRenderCache extends ModelRenderCache<Rectangle2DInstanceData> {
  3. fillVB: WebGLBuffer;
  4. fillIB: WebGLBuffer;
  5. borderVB: WebGLBuffer;
  6. borderIB: WebGLBuffer;
  7. instancingAttributes: InstancingAttributeInfo[];
  8. effect: Effect;
  9. render(instanceInfo: GroupInstanceInfo, context: Render2DContext): boolean {
  10. // Do nothing if the shader is still loading/preparing
  11. if (!this.effect.isReady()) {
  12. return false;
  13. }
  14. // Compute the offset locations of the attributes in the vertexshader that will be mapped to the instance buffer data
  15. if (!this.instancingAttributes) {
  16. this.instancingAttributes = instanceInfo._classTreeInfo.classContent.getInstancingAttributeInfos(this.effect);
  17. }
  18. var engine = instanceInfo._owner.owner.engine;
  19. engine.enableEffect(this.effect);
  20. engine.bindBuffers(this.fillVB, this.fillIB, [1], 4, this.effect);
  21. engine.updateAndBindInstancesBuffer(instanceInfo._instancesBuffer, null, this.instancingAttributes);
  22. engine.draw(true, 0, Rectangle2D.roundSubdivisions * 4 * 3, instanceInfo._instancesData.usedElementCount);
  23. engine.unBindInstancesBuffer(instanceInfo._instancesBuffer, this.instancingAttributes);
  24. return true;
  25. }
  26. }
  27. export class Rectangle2DInstanceData extends InstanceDataBase {
  28. @instanceData()
  29. get properties(): Vector3 {
  30. return null;
  31. }
  32. }
  33. @className("Rectangle2D")
  34. export class Rectangle2D extends Shape2D<Rectangle2DInstanceData> {
  35. public static sizeProperty: Prim2DPropInfo;
  36. public static notRoundedProperty: Prim2DPropInfo;
  37. public static roundRadiusProperty: Prim2DPropInfo;
  38. @instanceLevelProperty(Shape2D.SHAPE2D_PROPCOUNT + 1, pi => Rectangle2D.sizeProperty = pi, false, true)
  39. public get size(): Size {
  40. return this._size;
  41. }
  42. public set size(value: Size) {
  43. this._size = value;
  44. }
  45. @modelLevelProperty(Shape2D.SHAPE2D_PROPCOUNT + 2, pi => Rectangle2D.notRoundedProperty = pi)
  46. public get notRounded(): boolean {
  47. return this._notRounded;
  48. }
  49. public set notRounded(value: boolean) {
  50. this._notRounded = value;
  51. }
  52. @instanceLevelProperty(Shape2D.SHAPE2D_PROPCOUNT + 3, pi => Rectangle2D.roundRadiusProperty = pi)
  53. public get roundRadius(): number {
  54. return this._roundRadius;
  55. }
  56. public set roundRadius(value: number) {
  57. this._roundRadius = value;
  58. this.notRounded = value === 0;
  59. }
  60. protected updateLevelBoundingInfo() {
  61. this._levelBoundingInfo.radius = Math.sqrt(this.size.width * this.size.width + this.size.height * this.size.height);
  62. this._levelBoundingInfo.extent = this.size.clone();
  63. }
  64. protected setupRectangle2D(owner: Canvas2D, parent: Prim2DBase, id: string, position: Vector2, size: Size, roundRadius = 0, fill?: IFill2D, border?: IBorder2D) {
  65. this.setupRenderablePrim2D(owner, parent, id, position, true, fill, border);
  66. this.size = size;
  67. this.notRounded = !roundRadius;
  68. this.roundRadius = roundRadius;
  69. }
  70. public static Create(parent: Prim2DBase, id: string, x: number, y: number, width: number, height: number, fill?: IFill2D, border?: IBorder2D): Rectangle2D {
  71. Prim2DBase.CheckParent(parent);
  72. let rect = new Rectangle2D();
  73. rect.setupRectangle2D(parent.owner, parent, id, new Vector2(x, y), new Size(width, height), null);
  74. rect.fill = fill || Canvas2D.GetSolidColorFillFromHex("#FFFFFFFF");
  75. rect.border = border;
  76. return rect;
  77. }
  78. public static CreateRounded(parent: Prim2DBase, id: string, x: number, y: number, width: number, height: number, roundRadius = 0, fill?: IFill2D, border?: IBorder2D): Rectangle2D {
  79. Prim2DBase.CheckParent(parent);
  80. let rect = new Rectangle2D();
  81. rect.setupRectangle2D(parent.owner, parent, id, new Vector2(x, y), new Size(width, height), roundRadius);
  82. rect.fill = fill || Canvas2D.GetSolidColorFillFromHex("#FFFFFFFF");
  83. rect.border = border;
  84. return rect;
  85. }
  86. public static roundSubdivisions = 16;
  87. protected createModelRenderCache(): ModelRenderCache<Rectangle2DInstanceData> {
  88. let renderCache = new Rectangle2DRenderCache();
  89. let engine = this.owner.engine;
  90. // Need to create vb/ib for the fill part?
  91. if (this.fill) {
  92. var vbSize = ((this.notRounded ? 1 : Rectangle2D.roundSubdivisions) * 4) + 1;
  93. let vb = new Float32Array(vbSize);
  94. for (let i = 0; i < vbSize; i++) {
  95. vb[i] = i;
  96. }
  97. renderCache.fillVB = engine.createVertexBuffer(vb);
  98. let triCount = vbSize - 1;
  99. let ib = new Float32Array(triCount * 3);
  100. for (let i = 0; i < triCount; i++) {
  101. ib[i * 3 + 0] = 0;
  102. ib[i * 3 + 1] = i + 1;
  103. ib[i * 3 + 2] = i + 2;
  104. }
  105. ib[triCount * 3 - 1] = 1;
  106. renderCache.fillIB = engine.createIndexBuffer(ib);
  107. renderCache.effect = engine.createEffect({ vertex: "rect2d", fragment: "rect2d" }, ["index", "zBias", "transformX", "transformY", "origin", "properties"], [], [], "");
  108. }
  109. return renderCache;
  110. }
  111. protected createInstanceData(): Rectangle2DInstanceData {
  112. return new Rectangle2DInstanceData();
  113. }
  114. protected refreshInstanceData(): boolean {
  115. if (!super.refreshInstanceData()) {
  116. return false;
  117. }
  118. let d = this._instanceData;
  119. let size = this.size;
  120. d.properties = new Vector3(size.width, size.height, this.roundRadius || 0);
  121. return true;
  122. }
  123. private _size: Size;
  124. private _notRounded: boolean;
  125. private _roundRadius: number;
  126. }
  127. }