Scaling Components

I often make a component out of stencil shapes. (e.g. I can make an envelope out of a rectangle & the triangle flipped)

• Another odd thing, the panel doesn't have a text field embedded, but the rectangle does? That seems the wrong way around to me. It is also odd that the circle and rectangle are missing from the shapes asset pack. I realise they are in the normal list, however, this can be inconvenient as it is spread apart.

Often I re-use that component elsewhere and need to scale it down. This can cause some strange things to happen.

Sometimes it scales down fine. Then if I copy and paste the scaled down component the scaling on the newly pasted version is broken. (no longer scaled properly and trimmed off the edges)

The way it appears if you export as a PDF is also different from what it looks like in wireframe sketcher.

It seems the only way for me to fix the scaling issues so it looks correct in the PDF is to detach the component.

But this defeats the point of using components. :(

Brek, what version of WireframeSketcher are you using? The issue you are describing looks like something I have fixed some time ago.

If you are using the latest version and the issue is still there then please email me as much info as possible so I can reproduce it. Also attach your log file using WireframeSketcher > Preferences > WireframeSketcher > Report a Bug. Thanks!

It says I am using version...

3.8.0.20121023-0753

I'm not sure if the fix has gone into 3.8.1 which I believe is the latest version, but I didn;t think I was that out of date.

I still can't install updates from the Help>Check for Updates. :(

Neither can I install the new version from the Help>Install New Software. :(

The only way for me to install the updates is to download the latest version and install that.

I am usually reluctant to install the updates in the middle of a project in case anything goes wrong. But I will give it a go. :)

It looks like you are sufficiently up to date. The issue I was thinking about is fixed in your version.

Could you create a small project that shows the issue and then send it to me?

Check for updates does not work because it requires Administrator privileges. The only way to make it work for now is like this:

• Stop WireframeSketcher
• Run it as Administrator (right-click on the icon and choose the option from the context menu)
• Use Check for updates to update
• Stop WireframeSketcher
• Run it as a normal user

As you can see it's not trivial so I generally recommend downloading the latest version manually.

Ok. got the latest.

It does seem to work better, but there are still issues with it.

ISSUE 1: It appears to apply the scaling of the component when it is scaled down or non-uniformly. This means if you scale it back up again it is distorted and broken.

Repro steps.

1. Add a circle & a rectangle side by side.
2. Select Both and right click to convert to component.
3. Go to another screen and add the component.
4. Drag to scale the component to a width of only a few pixels.
5. Drag to scale the component back to a normal width.
6. Observe that the Component no longer looks similar, the relative widths of the objects in the component have changed. (they now overlap etc)

Upon further investigation this issue also occurs with Grouped objects.

It does not occur if both objects are selected and are NOT grouped. (the amount of scale that can be applied seems to be limited at times, until your release and then scale again)

ISSUE 2: Text is not scaled properly as part of the scaling.

1. Add a label to the component and set the font size to be very large.
2. Observe scaling the width works quite well. (still has the position issues)
3. Scale the component vertically so it is smaller than the text.
4. Observe how the text position & font size remains the same while the other shapes scale down.
5. Then scale the component so it's width is smaller than the text.
6. Observe how the text size stays the same but now is clipped as the label box has been scaled.

I would expect the font size & position is maintained in the correct position relative to the shapes. (I'm not sure how you go about doing that)

Brek, I think you are hitting the limits of what components are able to do. Your first issue must be caused by the fact that coordinates and sizes are stored as integers. So scaling down and then back up necessarily loses some precision. SVGs work better in this regard and I think you should use them if resizing precision is important for your components.

Automatic text scaling is also not something that we do automatically. I think the expected behavior depends on the component and scaling font down is not always desirable.

Generally it looks like you need more advanced control over component's layout. It would help if you could send me a few of those components you are trying to create. Perhaps we could envision a layout tool for components and groups that could be used for that. It will have to implement some ideas that are generally found in layout managers in GUI frameworks.

You've also mentioned a problem with PDF export and that components on screen look differently from PDF. Is it the same issue or a different one? It would help me if you could send me more details.

I looked more into your example with Circle and Rectangle. It looks like both Circle and Rectangle (and actually all other widgets) have a minimum size of 8px so you cannot make them smaller than that. So when you resize a group to a small size the relative layout breaks because of that. I could try to remove the minimum size limitation, but is this the actual issue you have with your components?