Langsom billede rotation om punkt X

Jeg kender ikke noget færdigt kode til det, men det kan da laves.

Kan du selv lidt Java ?

Jeg kan desværre ikke selv kode java

søøøde arne... :-)

Glædelig jul :)

Jeg overvejer staadig om jeg orker at gaa igang med det i weekenden.

Lidt kode.

<img src="redsquare.gif" onClick="document.ImageFun.setImage('redsquare.gif')">
<img src="greensquare.gif" onClick="document.ImageFun.setImage('greensquare.gif')">
<img src="bluesquare.gif" onClick="document.ImageFun.setImage('bluesquare.gif')">
<hr>
<applet name="ImageFun" codebase="." code="ImageFunApplet.class" width="400" height="400">
</applet>

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Graphics2D;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.geom.AffineTransform;
import java.awt.image.BufferedImage;

import javax.swing.ImageIcon;
import javax.swing.JApplet;
import javax.swing.JButton;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class ImageFunApplet extends JApplet {
    private double v;
    private int dx;
    private int dy;
    private String imgnam;
    private JLabel imgicn;
    public void init() {
        v = 0;
        dx = 0;
        dy = 0;
        imgnam = null;
        imgicn = null;
        getContentPane().setLayout(new BorderLayout());
        JPanel rot = new JPanel();
        rot.setLayout(new GridLayout(1, 4));
        JButton clockfast = new JButton("Rotate ++");
        clockfast.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v += 5;
                update();
            }
        });
        rot.add(clockfast);
        JButton clock = new JButton("Rotate +");
        clock.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v += 1;
                update();
            }
        });
        rot.add(clock);
        JButton cclock = new JButton("Rotate -");
        cclock.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v -= 1;
                update();
            }
        });
        rot.add(cclock);
        JButton cclockfast = new JButton("Rotate --");
        cclockfast.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v -= 5;
                update();
            }
        });
        rot.add(cclockfast);
        getContentPane().add(rot, BorderLayout.SOUTH);
        update();
    }
    public void setImage(String imgnam) {
        this.imgnam = imgnam;
        update();
    }
    private void update() {
        if(imgicn != null) {
            getContentPane().remove(imgicn);
        }
        if(imgnam == null) {
            imgicn = new JLabel(getBlankIcon());
        } else {
            imgicn = new JLabel(getIcon());
        }
        imgicn.addMouseListener(new MouseListener() {
            public void mouseClicked(MouseEvent ev) {
                dx = ev.getPoint().x - imgicn.getWidth() / 2;
                dy = ev.getPoint().y - imgicn.getHeight() / 2;
            }
            public void mouseEntered(MouseEvent ev) {
            }
            public void mouseExited(MouseEvent ev) {
            }
            public void mousePressed(MouseEvent ev) {
            }
            public void mouseReleased(MouseEvent ev) {
            }
        });
        getContentPane().add(imgicn, BorderLayout.CENTER);
        invalidate();
        validate();
        getContentPane().repaint();
    }
    private ImageIcon getIcon() {
        ImageIcon imgicn = new ImageIcon(getClass().getClassLoader().getResource(imgnam));
        BufferedImage bi = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_RGB); 
        Graphics2D g2 = bi.createGraphics(); 
        AffineTransform at = new AffineTransform();
        at.translate((bi.getWidth()-imgicn.getIconWidth())/2, (bi.getHeight()-imgicn.getIconHeight())/2);
        at.rotate(Math.toRadians(v), imgicn.getIconWidth()/2 + dx, imgicn.getIconHeight()/2 + dy);
        g2.setColor(Color.WHITE);
        g2.fillRect(0, 0, bi.getWidth(), bi.getHeight());
        g2.drawImage(imgicn.getImage(), at, this); 
        g2.transform(at);
        g2.dispose(); 
        return new ImageIcon(bi);
    }
    private ImageIcon getBlankIcon() {
        BufferedImage bi = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_RGB); 
        Graphics2D g2 = bi.createGraphics(); 
        g2.setColor(Color.WHITE);
        g2.fillRect(0, 0, bi.getWidth(), bi.getHeight());
        g2.dispose(); 
        return new ImageIcon(bi);
    }
}

Jeg er ved at hente og installere jdk

kan du poste kommandoen for at compile? og gerne step-vis... :-)

C:\hvorjavaligger\bin\javac ImageFunApplet.java

C:\Program Files\Java\jdk1.6.0_17\bin>javac ImageFunApplet.java
ImageFunApplet.java:1: illegal character: \187
´&#9559;&#9488;import java.awt.BorderLayout;
^
ImageFunApplet.java:1: illegal character: \191
´&#9559;&#9488;import java.awt.BorderLayout;
  ^
2 errors

C:\Program Files\Java\jdk1.6.0_17\bin>

Check lioge om der er kommet noget snask ind oeverst i filen.

det første tegn er et i, ingen mellemrum eller andet snask

Proev og gem filen som ANSI i.s.f. UTF-8.

ok :)

SÅDAN

yes, det er fanme smart.

Kan du gøre sådan at man kan resette på en knap
og gøre så den resetter når man loader et nyt billede ind i appleten? :))

aaahhh, kan du gøre sådan at rotationen centreres i appletten? :)) hehe

jeg kunne ikke forstå hvorfor den ikke roterede om der hvor man klikkede, men fandt ud af at det gjorde den, men den ikke centrerede billedet til midten af appletten...

altså punktet X skal gerne centreres i midten af appletten

Ah.

Klik skal ikke vare nyt omdrejnings punkt men klik punkt skal flyttes til centrum og saa roterer man igen om det.

Jeg kan foerst selv proeve senere.

Men har du mod paa selv at eksperimentere saa lav:

        at.translate((bi.getWidth()-imgicn.getIconWidth())/2, (bi.getHeight()-imgicn.getIconHeight())/2);
        at.rotate(Math.toRadians(v), imgicn.getIconWidth()/2 + dx, imgicn.getIconHeight()/2 + dy);

om til:

        at.translate((bi.getWidth()-imgicn.getIconWidth())/2 + dx, (bi.getHeight()-imgicn.getIconHeight())/2 + dy);
        at.rotate(Math.toRadians(v), imgicn.getIconWidth()/2, imgicn.getIconHeight()/2);

nemlig

Men den ændring gjorde desværre ikke nogen forskel, den roterer stadig om klik

Fik du recompilet og genstartet browseren efter aendringen ?

Hvis ja, saa maa jeg nok teste lidt selv i aften (min tid).

PS: er du god til matematik ?

ja recompilet og genstartet browser.

nej desværre er jeg ikke god til matematik :) har du en matenatik opgave du skal have lavet? hehe

AffineTransform klassen er den som laver alt det sjove.

Docs er her:

http://java.sun.com/javase/6/docs/api/java/awt/geom/AffineTransform.html

Men docs forudsaetter ligesom at man kan taenke i matrics transformeringer.

Jeg proever at kigge paa at centrere roteringen senere (om en 6-7 timer).

super, og også gerne resetknap og reset ved load af nyt billede :)

jeg tjekker igen imorgen

<img src="redsquare.gif" onClick="document.ImageFun.setImage('redsquare.gif')">
<img src="greensquare.gif" onClick="document.ImageFun.setImage('greensquare.gif')">
<img src="bluesquare.gif" onClick="document.ImageFun.setImage('bluesquare.gif')">
<hr>
<applet name="ImageFun" codebase="." code="ImageFunApplet.class" width="500" height="500">
</applet>

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Graphics2D;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.geom.AffineTransform;
import java.awt.image.BufferedImage;

import javax.swing.ImageIcon;
import javax.swing.JApplet;
import javax.swing.JButton;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class ImageFunApplet extends JApplet {
    private double v;
    private int x;
    private int y;
    private String imgnam;
    private JLabel imgicn;
    public void init() {
        v = 0;
        x = getWidth()/2;
        y = getHeight()/2;
        imgnam = null;
        imgicn = null;
        getContentPane().setLayout(new BorderLayout());
        JPanel rot = new JPanel();
        rot.setLayout(new GridLayout(1, 4));
        JButton clockfast = new JButton("Rotate ++");
        clockfast.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v += 5;
                update();
            }
        });
        rot.add(clockfast);
        JButton clock = new JButton("Rotate +");
        clock.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v += 1;
                update();
            }
        });
        rot.add(clock);
        JButton cclock = new JButton("Rotate -");
        cclock.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v -= 1;
                update();
            }
        });
        rot.add(cclock);
        JButton cclockfast = new JButton("Rotate --");
        cclockfast.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v -= 5;
                update();
            }
        });
        rot.add(cclockfast);
        JButton reset = new JButton("Reset");
        reset.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                v = 0;
                x = getWidth()/2;
                y = getHeight()/2;
                update();
            }
        });
        rot.add(reset);
        getContentPane().add(rot, BorderLayout.SOUTH);
        update();
    }
    public void setImage(String imgnam) {
        this.imgnam = imgnam;
        v = 0;
        x = getWidth()/2;
        y = getHeight()/2;
        update();
    }
    private void update() {
        if(imgicn != null) {
            getContentPane().remove(imgicn);
        }
        if(imgnam == null) {
            imgicn = new JLabel(getBlankIcon());
        } else {
            imgicn = new JLabel(getIcon());
        }
        imgicn.addMouseListener(new MouseListener() {
            public void mouseClicked(MouseEvent ev) {
                x = ev.getPoint().x;
                y = ev.getPoint().y;
                update();
            }
            public void mouseEntered(MouseEvent ev) {
            }
            public void mouseExited(MouseEvent ev) {
            }
            public void mousePressed(MouseEvent ev) {
            }
            public void mouseReleased(MouseEvent ev) {
            }
        });
        getContentPane().add(imgicn, BorderLayout.CENTER);
        invalidate();
        validate();
        getContentPane().repaint();
    }
    private ImageIcon getIcon() {
        ImageIcon imgicn = new ImageIcon(getClass().getClassLoader().getResource(imgnam));
        BufferedImage bi = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_RGB); 
        Graphics2D g2 = bi.createGraphics(); 
        AffineTransform at = new AffineTransform();
        g2.setColor(Color.WHITE);
        g2.fillRect(0, 0, bi.getWidth(), bi.getHeight());
        at.translate(x - imgicn.getIconWidth()/2, y);
        at.rotate(Math.toRadians(v), bi.getWidth()/2 - x + imgicn.getIconWidth()/2, bi.getHeight()/2 - y + imgicn.getIconHeight()/2);
        g2.drawImage(imgicn.getImage(), at, this); 
        g2.transform(at);
        g2.dispose(); 
        return new ImageIcon(bi);
    }
    private ImageIcon getBlankIcon() {
        BufferedImage bi = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_RGB); 
        Graphics2D g2 = bi.createGraphics(); 
        g2.setColor(Color.WHITE);
        g2.fillRect(0, 0, bi.getWidth(), bi.getHeight());
        g2.dispose(); 
        return new ImageIcon(bi);
    }
}

Nu har jeg fået testen den

Opfører den sig ikke lidt mærkeligt?
Når billedet loades, så bliver billedet ikke centreret i appletten. Og når jeg klikker på billedet bliver X heller ikke midtpunktet. Gør den ved dig?

Da jeg testede virkede det som at billedet kom ind i centrum.

Jeg legede lidt med det og syntes at det var alt for forvirrende at goere klik sted til centrum saa i.s.f. valgte jeg at flytte centrum af billedet til klik sted.

Centrum af billedet bliver ikke flyttet til klik sted.

Men det skal være kliksted som skal være centrum af appleten, samt omdrejningspunkt X.

Forestil dig et rundt objekt på billedet som skal dreje rundt for ikke at se det på hovedet. Eksempelvis en porcelænsmalet dyb tallerken.

man skal så klikke i midten af tallerknen for at få tallerkens midte centreret i appletten og så kan den roteres.

arne du må ligge et svar så får du point :) jeg opretter et nyt spm så der er andre der kan give et bud på at få det sidste på plads.

OK

mange tak for din tid. Jeg håber nogen kan justere det sidste. Hvis du får tid på et tidspunkt igen, så hop på :)