# Vision Component Size restrictions

**URL:** <https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103>\
**Category:** Module Development\
**Tags:** vision\
**Created:** [December 13, 2023, 6:59pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103 "2023-12-13T18:59:40Z")\
**Posts on this page:** 11\
**Page:** 2

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [December 18, 2023, 7:30pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/21 "2023-12-18T19:30:39Z")

</div>

You'll have to blaze the trail for the rest of us. 🤷‍♂️

Of course, it has only been four days, two of which were weekend days, and we are right at the major holiday boundary. Might want to let this simmer a bit more.

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [December 18, 2023, 7:59pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/22 "2023-12-18T19:59:59Z")

</div>

Maybe you can "just" have your component implement [`Bounds2DComponent`](https://files.inductiveautomation.com/sdk/javadoc/ignition81/8.1.35/com/inductiveautomation/vision/api/client/components/model/Bounds2DComponent.html)?

---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [December 18, 2023, 8:23pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/23 "2023-12-18T20:23:07Z")

</div>

Would you have an example of Bounds2DComponent being used?

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [December 18, 2023, 8:38pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/24 "2023-12-18T20:38:08Z")

</div>

Nope. You're on uncharted territory. But implementing the interface directly _might_ be easier than subclassing one of the existing Vision shapes, which are currently the one things that implement the interface.

---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [December 21, 2023, 7:23pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/25 "2023-12-21T19:23:19Z")

</div>

I got it mostly figured out now using `AbstractVisionShape`. My component automatically resizes depending on the properties entered.  
The one issue I still have is that when I grab the component from the Palette and drop it on the screen, it initially goes to a predefined x,y location. I want it to show up wherever I click with the mouse instead. How do I access the mouse coordinates from within the component java code?

---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [January 3, 2024, 7:18pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/26 "2024-01-03T19:18:29Z")

</div>



---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [January 3, 2024, 7:21pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/27 "2024-01-03T19:21:18Z")

</div>

I hope the video is visible to everyone.  
So defining the component's outline based on properties is possible with the `AbstractVisionShape` class.  
Thanks to @pturmel for pointing me towards vision shapes!

The three key functions under that class are:

```auto
setBoundingRect(Rectangle2D rd)
/* rd is the bounding rectangle that is sent down from ignition, either when
 * the component is initially dropped on the window or when it is resized or moved.
 * Define the component's area in here by using the given rectangle and then modifying
 * it as needed.
 */

getShapeBounds(Rectangle2D rd)
/* this function determines the size of the boundary to show around the component.
 * Use a clone of the component's area that was created under setBoundingRect()
 */

getArea()
/* this function determines the area of the component that will allow the component to be
 * selected by the mouse.
 */

```

---

<div class="post-metadata">

**Author:** ![MG3](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mg3/32/84125_2.png) [@MG3](https://forum.inductiveautomation.com/u/MG3)\
**Post date:** [September 18, 2024, 11:55am UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/28 "2024-09-18T11:55:06Z")

</div>

Hi Mathias,

I am trying to implement something similar to this in some components I am creating. Thankyou for documenting everything so well. Though may I ask though how you resolved:

> [@Mathias\_Melling](#):
>
> The one issue I still have is that when I grab the component from the Palette and drop it on the screen, it initially goes to a predefined x,y location. I want it to show up wherever I click with the mouse instead. How do I access the mouse coordinates from within the component java code?

Looking forward to your response!

Thanks!

---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [September 18, 2024, 7:46pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/29 "2024-09-18T19:46:34Z")

</div>

Hi Max,

I'm not sure what my code looked like back in January, that would have caused the component to go to predefined x, y coordinates when first dropped onto the container. As stated in my comment under the `setBoundingRect(Rectangle2D rd)` function, rd gives you `x, y, width` and `height` of your component when it is first placed onto a container and when it is moved or resized.

Here is what I currently do and it works:

```python
public void setBoundingRect(Rectangle2D rd) {        
  double newX = rd.getX();
  double newY = rd.getY();
  double newWidth = rd.getWidth();
  double newHeight = rd.getHeight();
  
  boundingRect.setFrame(newX, newY, newWidth, newHeight);
}

```

Of course you can manipulate `rd` whichever way you want. Just make sure that `boundingRect` is a property in the `BeanInfo` class for your component. That's how the location and size of the component gets saved.

And here is what you want under `getShapeBounds(Rectangle2D rd)`. This code is based on the JComponent's `getBounds(Rectangle rv)` method:

```python
public Rectangle2D getShapeBounds(Rectangle2D rd) {
  if (boundingRect == null) {
      return new Rectangle2D.Double( getLocation().x,
                                     getLocation().y,
                                     getPreferredSize().width,
                                     getPreferredSize().height);
  } else if (rd == null) {
      return boundingRect.getBounds2D();
  } else {
      rd.setRect(boundingRect.getBounds2D());
      return rd;
  }
}

```

I hope this helps!

---

<div class="post-metadata">

**Author:** ![Bohdan](https://avatars.discourse-cdn.com/v4/letter/b/bbce88/32.png) [@Bohdan](https://forum.inductiveautomation.com/u/Bohdan)\
**Post date:** [September 22, 2024, 7:46am UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/30 "2024-09-22T07:46:15Z")

</div>

Hi Mathias,

Could you please have a look at:  
[Error-When-Saving-Bounds2DComponent (Serialization error)](https://forum.inductiveautomation.com/t/error-when-saving-bounds2dcomponent-serialization-error/96276)

It is related to what Max is trying to do too. I am asking you since you mentioned about need of `boundingRect` property... something I suspect I am doing wrong (any particular flags must be set for it to work, e.g. when using `addProp(..)` in the `BeanInfo`?). Any chance you can advice how exactly that property needs to be added and if you aware of anything else needed for such component to be saved?

Thank you.

---

<div class="post-metadata">

**Author:** ![Mathias\_Melling](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mathias_melling/32/67682_2.png) [@Mathias\_Melling](https://forum.inductiveautomation.com/u/Mathias_Melling)\
**Post date:** [September 23, 2024, 2:11pm UTC](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103/31 "2024-09-23T14:11:55Z")

</div>

See reply over here:

> [@Error when saving Bounds2DComponent (serialization error)](https://forum.inductiveautomation.com/t/error-when-saving-bounds2dcomponent-serialization-error/96276/5):
>
> Hi Bohdan, I've been building my components by extending the AbstractVisionShape class, which itself is an extension of AbstractVisionComponent and it also implements the Bounds2DComponent interface. Maybe that's the way to go for you as well, instead of trying to implement Bounds2DComponent yourself. As to your question here: I add the boundingRect property just like any other property: addProp("boundingRect", "Bounds", "Bounding rectangle of the component.", CAT\_POSITION, HIDDEN\_M…

[Previous page](https://forum.inductiveautomation.com/t/vision-component-size-restrictions/83103.md?page=1)
