I've got a set of Java2D calls that draw vectors on a graphics context. I'd like for the image to be doubled in size and then rotated 90 degrees.
I'm using the following code to do this:
Graphics2D g2 = // ... get graphics 2d somehow ...
AffineTransform oldTransform = g2.getTransform();
AffineTransform newTransform = (AffineTransform)oldTransform.clone();
newTransform.concatenate(AffineTransform.getTranslateInstance(x1, x2));
newTransform.concatenate(AffineTransform.getScaleInstance((double)newW/(double)iconW, (double)newH/(double)iconH));
newTransform.concatenate(AffineTransform.getRotateInstance(Math.toRadians(rotationAngle), (double)iconW/2.0d, (double)iconH/2.0d));
// ... do my drawing ...
This rotates and scales, however, the scale isn't applied the way I would like. It is as if it is rotated before scaling, thus making the image wider on the wrong axis.
Is there a better way to do this?
I believe those transforms are implemented like a stack - so the last transform is performed first. Try reversing the order of the rotate and scale transformations and you should get what you are looking for.
newTransform.concatenate(AffineTransform.getTranslateInstance(x1, x2));
newTransform.concatenate(AffineTransform.getRotateInstance(Math.toRadians(rotationAngle), (double)iconW/2.0d, (double)iconH/2.0d));
newTransform.concatenate(AffineTransform.getScaleInstance((double)newW/(double)iconW, (double)newH/(double)iconH));
Rotations are always performed about the origin. In order to rotate about a certain point you must translate the points.
This page explains the maths behind what you're trying to do and show why transformations need to be applied in a certain order.
Change the order in which you concatenate the transforms to control the order in which they are applied in the composite.
Related
Can anyone share a code how to draw a rectangle like this?
(not vertical, not horizontal, somewhere between)
Because as I see you can only specify 4 ints to function DrawRect(), not 4 points.
The area of rectangle must be sensitive to touch (I use Contains() method)
As I tried, Matrix and Rotate() update only graphics, the rect's area remains the same it was
After transforming as #fortran suggested, you can use one of the Matrix.mapPoints overloads to find out what the new corners of your rectangle are. You'll probably have to find some fancy math and do hit testing yourself. Might be easier to call Matrix.mapPoints() on the inverse of the transformation used to draw the rectangle, passing the touched coordinates, and then hit test on the original rectangle.
Push a rotation transformation, draw the rectangle, pop it.
http://developer.android.com/reference/android/graphics/Canvas.html#rotate%28float,%20float,%20float%29
I found solution - the easiest way is to use Path class, make a free-turned rectangle by points and then create a region method, which has function Contains()
No need for math and hard work, pretty and easy.
I was wondering if there is a way to plot a point using a double value in the built in java graphics utility. I am making a simple clock but I want it to be as precise as possible. The method drawLine(int, int, int, int) in Graphics obviously won't take a double as a parameter. Is there a work-around to this?
P.S. The doubles in question are the change in x and y for each hand on the clock as 1 second passes.
Graphics2D has an internal AffineTransform Matrix that you can alter. I have not tested the following code, but i think this or a variant might get close to what you want (Although really, the pixels are all at integer positions...)
Graphics2D g; // get a Graphics2D from somewhere
g.rotate(Math.PI/4);
g.drawLine(0,0,1,0); //draw a line at 45°
// now you should probably rotate back...
Pixels only exist at integer positions. think of it like a chess board, each square is only one colour and it means nothing to say half a square.
There are some things you can do (bi linear interpolation for example) to draw in between pixels but all they do is modify all the pixels around the point according to a suitable algorithm and the position you select.
If you want higher resolution then the simplest thing is just to increase the resolution of the image you are using. More pixels gives more possible precision, until you reach the limits of your display device...
I have a java.awt.canvas object and I draw stuff with the Graphics2D (which I get from the bufferStrategy) and I'd like to "zoom" in and out.
So if I zoom in (scaling it up by a factor of 1) such that a line I draw from (0,0) to (10,10) Would be in reality drawn from (0,0) to (20,20)
Is this possible, or do I have to implement this myself?
Take a look at Graphics2D: http://docs.oracle.com/javase/7/docs/api/java/awt/Graphics2D.html
You apply a suitable transformation to the graphics to achieve many transformations, rotate, scale (aka zoom) and translation. Simplest way to zoom would probably be
graphics2d.scale(2.0, 2.0); // draw everything twice the original size
I've been looking around and i couldn't find an answer to this but what I have done is create a cube / box and the camera will squash and stretch depending on where I am looking at. This all seems to resolve it self when the screen is perfectly square but when I'm using 16:9 it stretches and squashes the shapes. Is it possible to change this?
16:9
and this is 500px X 500px
As a side question would it be possible to change the color of background "sky"?
OpenGL uses a cube [-1,1]^3 to represent the frustum in normalized device coordinates. The Viewport transform strechtes this in x and y direction to [0,width] and [0,height]. So to get the correct output aspect ratio, you have to take the viewport dimensions into account when transfroming the vertices into clip space. Usually, this is part of the projection matrix. The old fixed-function gluPerspective() function has a parameter to directly create a frustum for a given aspect ratio. As you do not show any code, it is hard to suggest what you actually should change, but it should be quite easy, as it boils down to a simple scale operation along x and y.
To the side question: That color is defined by the values the color buffer is set to when clearing the it. You can set the color via glClearColor().
I have been using Affine Transform to rotate a String in my java project, and I am not an experienced programmer yet, so it has taking me a long time to do a seemingly small task.. To rotate a string.
Now I have finally gotten it to work more or less as I had hoped, except it is not as precisely done as I want... yet.
Since it took a lot of trial and error and reading the description of the affine transform I am still not quite sure what it really does. What I think I know at the moment, is that I take a string, and define the center of the string (or the point which I want to rotate around), but where does matrices come into this? (Apparently I do not know that hehe)
Could anyone try and explain to me how affine transform works, in other words than the java doc? Maybe it can help me tweak my implementation and also, I just would really like to know :)
Thanks in advance.
To understand what is affine transform and how it works see the wikipedia article.
In general, it is a linear transformation (like scaling or reflecting) which can be implemented as a multiplication by specific matrix, and then followed by translation (moving) which is done by adding a vector. So to calculate for each pixel [x,y] its new location you need to multiply it by specific matrix (do the linear transform) and then add then add a specific vector (do the translation).
In addition to the other answers, a higher level view:
Points on the screen have a x and a y coordinate, i.e. can be written as a vector (x,y). More complex geometric objects can be thought of being described by a collection of points.
Vectors (point) can be multiplied by a matrix and the result is another vector (point).
There are special (ie cleverly constructed) matrices that when multiplied with a vector have the effect that the resulting vector is equivalent to a rotation, scaling, skewing or with a bit of trickery translation of the input point.
That's all there is to it, basically. There are a few more fancy features of this approach:
If you multiply 2 matrices you get a matrix again (at least in this case; stop nit-picking ;-) ).
If you multiply 2 matrices that are equivalent to 2 geometric transformations, the resulting matrix is equivalent to doing the 2 geometric transformations one after the other (the order matters btw).
This means you can encode an arbitrary chain of these geometric transformations in a single matrix. And you can create this matrix by multiplying the individual matrices.
Btw this also works in 3D.
For more details see the other answers.
Apart from the answers already given by other I want to show a practical tip namely a pattern I usually apply when rotating strings or other objects:
move the point of rotation (x,y) to the origin of space by applying translate(-x,-y).
do the rotation rotate(angle) (possible also scaling will be done here)
move everything back to the original point by translate(x,y).
Remember that you have to apply these steps in reverse order (see answer of trashgod).
For strings with the first translation I normally move the center of the bounding box to the origin and with the last translate move the string to the actual point on screen where the center should appear. Then I can simply draw the string at whatever position I like.
Rectangle2D r = g.getFontMetrics().getStringBounds(text, g);
g.translate(final_x, final_y);
g.rotate(-angle);
g.translate(-r.getCenterX(), -r.getCenterY());
g.drawString(text, 0, 0);
or alternatively
Rectangle2D r = g.getFontMetrics().getStringBounds(text, g);
AffineTransform trans = AffineTransform.getTranslateInstance(final_x, final_y);
trans.concatenate(AffineTransform.getRotateInstance(-angle));
trans.concatenate(AffineTransform.getTranslateInstance(-r.getCenterX(), -r.getCenterY()));
g.setTransform(trans);
g.drawString(text, 0, 0);
As a practical matter, I found two things helpful in understanding AffineTransform:
You can transform either a graphics context, Graphics2D, or any class that implements the Shape interface, as discussed here.
Concatenated transformations have an apparent last-specified-first-applied order, also mentioned here.
Here is purely mathematical video guide how to design a transformation matrix for your needs http://www.khanacademy.org/video/linear-transformation-examples--scaling-and-reflections?topic=linear-algebra
You will probably have to watch previous videos to understand how and why this matrices work though. Anyhow, it's a good resource to learn linear algebra if you have enough patience.