New feature: component affine transforms


#1

Just in case people don’t notice it in the GIT log comments, I’ve just added a new feature that lets you apply a transform to a component with Component::setTransform()… It’s a neat feature and I’ve got a couple of ideas that I want to use it for, I’d be interested to hear what y’all make of it…


#2

With Component::setOpacity(), it’ll be the perfect system for very attractive blink & rotate 2D interface!


#3

Very cool!

Does it apply to the children too?


#4

It does warp also mouse events ?


#5

Yep, it does all the stuff you’d expect it to do - try it out on the widgets page of the demo app.


#6

wicked stuff !


#7

I’m guessing, this doesn’t apply to top level windows :lol:


#8

Very, very cool. Very cool indeed.


#9

Jules for president!


#10

Jules, this is stupendously useful! I was dreading how I was going to support a scalable UI, but you have done the hard work for everyone, this is truly amazing.

I've just spent around 30 mins adding a resizer control to the bottom right corner of the AU component holder, and now I have a fully scalable bitmap based gui :) I just have to listen for resized messages in my editor and set the affine transformation accordingly. My users are now going to have a gorgeous fully scalable UI that looks like this (you should be able to scale the image much like the end users by changing the size of the web browser window):

http://www.cytomic.com/files/drop-vis-12-big.jpg


#11

Glad to be of service! smiley


#12

Jules, is there any way to set the quality of resampling of sub comonents that are being affine transformed that do bitmap image operations?


#13

It depends on the rendering engine - they all behave slightly differently, and will respond to Graphics::setImageResamplingQuality() in different ways.


#14

Jules, would you expect a different result in these two situations?

1) a component that has an affine transform applied to it and inside paint calls:

context.setImageResamplingQuality (Graphics::highResamplingQuality);

contex.drawImageAt (image, 0, 0);

2) a component that does the affine transform itself by calling:

context.setImageResamplingQuality (Graphics::highResamplingQuality);

contex.drawImageTransformed (image, AffineTransform::scale (scale));

#15

No - it all boils down to the same thing internally. There's only one entry-point for rendering images, and it doesn't care whether its transform came from a component tranformation or elsewhere.

Maybe if you're seeing a difference it's because the transform involved has been shifted by a different sub-pixel translation?


#16

Great, that's the answer I wanted to hear :) When I have a little time I'll try and investigate further as to why some of the text is looking a little blurrier in other places, but only sometimes. I think it is to do with the fractional vertical / horizontal translation which is needed to keep everything in place but since I have text baked into the images then I get issues. The background image which always has no translation is looking crisper to me for some reason, even though it is being scaled.