Transitions

Hi,

I am thinking about doing a slide show application involving transitions between one image and the next.

I haven抰 really looked into it much, so I抦 just looking for pointers in the right direction.

What would be ideal is some code I can get teeth into.

I抳e been looking into transitions, but the only downloads I can contain the .class files. Does anyone know where I can find some source downloads?

Thanks

Luke

[458 byte] By [dfgstga] at [2007-11-26 22:37:06]
# 1

This is a tip for horizontal transition

Draw every keynote in an image, one-to-one. Also create a master-image, and when you want to make the transition, call:

public void makeTransition(Keynote k1, Keynote k2){

long transition_time=<choose the speed>

long time_base_start_time=System.getCurrentTime();

long elapsed_time=System.getCurrentTime()-time_base_start_time

while( (elapsed_time)<transition_time )

{

Graphics2D g2=(Graphics2D)master_image.getGraphics();

Dimension d =master_image.getSize();

//moving to left

g2.translate(-d.gethWidth()*elapsed/time/transition_time,0);t

g2.drawImage(k1.getImage());

//moving to right

g2.translate(d.getWidth(),0 );

g2.drawImage(k2.getImage());

repaint()//your component must draw master_image

}

}

>

RaulHuertasa at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 2

That抯 cool. I抳e managed to do a class now that takes two images (front and back) and uses a clipping rectangle that slowly gets bigger over time:

(Were gg is the Graphic2D of the buffer or master image)

public void actionPerformed(ActionEvent e)

{

/*

* Draw the back

*/

gg.drawImage(back,0,0,null);

/*

* Make the clip

*/

// TODO: Look at getPathIterator(AffineTransform at)

// TODO: Try translating and scaling

// Width

int w=((buff.getWidth()/dur))*tick;

// Height

int h=((buff.getHeight()/dur))*tick;

// Get the drawX

int x=(buff.getWidth()/2)-(w/2);

// Draw y

int y=(buff.getHeight()/2)-(h/2);

// Redraw the shape

Rectangle2D clip= new Rectangle2D.Double(x,y,w,h);;

// Set clip

gg.setClip(clip);

// Draw the front

gg.drawImage(front,0,0,null);

}

I抳e also been experimenting with shapes, it would be nice to use any shape, a star for instance, but for that I whould have to scale the shape, I can抰 make it a new each time like I did for a rectangle because I don抰 know what the shape is.

I抳e made a tester app playing with shape scaling and I抳e got code to scale a shape:

tempBut=new JButton("Make bigger");

tempBut.addActionListener(new AbstractAction () {

public void actionPerformed(ActionEvent e)

{

AffineTransform af = new AffineTransform();

af.scale(1.1,1.1);

GeneralPath tmp = new GeneralPath();

tmp.append(s.getPathIterator(af),false);

s=tmp;

sur.repaint();

}

});

But what I really want is to scale around the centre point, does anyone know how this can be done?

Thanks

Luke

dfgstga at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 3
The idea of Shapes is cool!I've just designed a bean that can make zoom and rotate an image with the mouse. Now I want to add your idea :D.Bye
RaulHuertasa at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 4

For Scale around center:

Graphics2D gg=(Graphics2D) your_component.getGrahics();

gg.translate( your_component.Width(), your_component_Height() );//You move to the center

gg.translate( -image.getW()*zoom, -image.getH()*zoom )//Look at the minus!

gg.scale(zoom, zoom);//Preparing for zooming

gg.draw(image);

If you want to draw a non-rectangular shape, use the dimensions of the bounding rectangle

RaulHuertasa at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 5

Sorry!!!!!!!!

In the first translation:

gg.translate( your_component.Width(), your_component_Height() );//You move to the center

change for

gg.translate( your_component.Width()/2, your_component_Height() /2 );//You move to the center

Now you are in the center ;)

RaulHuertasa at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 6

I抦 glad you like me code :) I抳e came up with a class to help me manipulate shapes easier:

public abstract class ShapeMan

{

public static Shape normalise(Shape s)

{

double x=s.getBounds().getX();

double y=s.getBounds().getY();

AffineTransform af = new AffineTransform();

af.translate(-x,-y);

GeneralPath tmp = new GeneralPath();

tmp.append(s.getPathIterator(af),false);

return tmp;

}

public static Shape translate(Shape s,Point2D p)

{

AffineTransform af = new AffineTransform();

af.translate(p.getX(),p.getY());

GeneralPath tmp = new GeneralPath();

tmp.append(s.getPathIterator(af),false);

return tmp;

}

public static Shape moveTo(Shape s,Point2D p)

{

s=normalise(s);

AffineTransform af = new AffineTransform();

af.translate(p.getX(),p.getY());

GeneralPath tmp = new GeneralPath();

tmp.append(s.getPathIterator(af),false);

return tmp;

}

}

I haven抰 commented it (woops), but I think some of it look similar to your code.

One thing that would be good is to resize a shape instead of scaling it.

I did think of a method that would go round scaling the X and Y by a small amount until the bounding rectangle抯 width and height matched the desired width and height, by I haven抰 tried that yet and if you scale too much, the loop may go on forever.

Does anyone know how to resize a shape?

Luke

dfgstga at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 7

Shapes... well:

AfineTransform my_scaltion_transform=(z,0,0,0,1,...);//you know what to put here

Shape scaled_shape= my_scaltion_transform.getTransfromedShape(your_original_shape);

For images, just draw the original image in a new image of the desired size and apply the desired transformation.

ByE!

RaulHuertasa at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...
# 8

I抳e updated my ShapeMan class now with a method to resize a shape:

public static Shape resize(Shape s,Dimension2D d)

{

// A temp shape

GeneralPath tmp = new GeneralPath();

// The affine transform

AffineTransform af = new AffineTransform();

// The bounds of s

Rectangle2D bounds=s.getBounds2D();

// How much to scale the X

double scaleX=d.getWidth()/bounds.getWidth();

// How much to scale the Y

double scaleY=d.getHeight()/bounds.getHeight();

// Scale

af.scale(scaleX,scaleY);

tmp.append(s.getPathIterator(af),false);

// Return the resized shape

return tmp;

}

So using that I抳e updated the actionPerformed method in my Transition class:

int w=((buff.getWidth()/dur))*tick;

// Height

int h=((buff.getHeight()/dur))*tick;

// Get the drawX

int x=(buff.getWidth()/2)-(w/2);

// Draw y

int y=(buff.getHeight()/2)-(h/2);

// Resize the shape

clip=ShapeMan.resize(clip,new Dimension(w,h));

// Move it

clip=ShapeMan.moveTo(clip,new Point2D.Double(x,y));

Now, as I said, this transition makes the clipping shape slowly grow to cover the screen, the next step, I think, would be to start with the shape the same size as the screen and then slowly shrink it. This can抰 be that hard to do.

Any thoughts?

Luke

dfgstga at 2007-7-10 11:47:56 > top of Java-index,Security,Cryptography...