JavaFX、Swingで画像表示、拡大縮小回転移動
JavaFXを使って画像を表示する方法のサンプルプログラムです。
Java
楽天 Swingを使う方法もあわせて記載しました。
画像の表示
Imageを読み込み、ImageViewに入れて、これをPaneに乗せればイメージが表示される。
package tomojavalib.swingfx;
import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class ImageTestFx extends Application {
public static void main(String[] args) {
Application.launch(args);
}
@Override
public void start(Stage stage) throws Exception {
stage.setTitle("JavaFX楽天 ");
StackPane pane = new StackPane();
Scene scene = new Scene(pane, 320, 240);
//Paneの中心に配置
pane.setAlignment( Pos.CENTER);
//imageの読み込み
Image image = new Image( "file:C:/a.jpg" );
//imageviewの作成
ImageView imgView = new ImageView( image );
//Paneにimageviewを載せる
pane.getChildren().add( imgView );
stage.setScene(scene);
stage.show();
}
}
画像の拡大縮小、平行移動、回転
画像を拡大縮小、平行移動、回転は、ImageViewを操作することで行う。
下の例では、画像を0.5倍に縮小して30度回転、X方向に30平行移動している。
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class ImageTestFx extends Application {
public static void main(String[] args) {
Application.launch(args);
}
@Override
public void start(Stage stage) throws Exception {
stage.setTitle("JavaFX");
StackPane pane = new StackPane();
Scene scene = new Scene(pane, 320, 240);
//Paneの中心に配置
pane.setAlignment( Pos.CENTER);
//imageの読み込み
Image image = new Image( "file:C:/a.jpg" );
//imageviewの作成
ImageView imgView = new ImageView( image );
//Paneにimageviewを載せる
pane.getChildren().add( imgView );
//拡大縮小
imgView.setScaleY( 0.5 );
imgView.setScaleX( 0.5 );
//回転
imgView.setRotate( -30. );
//平行移動
imgView.setTranslateX( 30. );
imgView.setTranslateY( 0. );
stage.setScene(scene);
stage.show();
}
Swingからの移行
awtで読み込んだイメージをFXで使いたい場合は、下記のように変換する。
FXで読み込む場合
javafx.scene.image.Image image = new javafx.scene.image.Image( "file:C:/a.jpg" );
awtで読み込んでFXに変換
java.awt.image.BufferedImage imgsw = javax.imageio.ImageIO.read(new java.io.File( "C:/a.jpg") );
javafx.scene.image.Image image = javafx.embed.swing.SwingFXUtils.toFXImage( imgsw , null);
Swingで画像表示
Swingの場合は、paintメソッドの中で描画する。サンプルプログラムではJPanelの拡張classを作って、その中で描画を行っている。
まずはJpanelを表示するためのJFrame class
package tomojavalib.swingfx;
import javax.swing.JFrame;
public class ImageTestSwing extends JFrame {
/*コンストラクタ*/
public ImageTestSwing()
{
//サイズ設定
this.setBounds(500, 500, 320, 240);
//タイトル設定
this.setTitle("JavaSwing");
ImageTestSwingPanel itsp = new ImageTestSwingPanel();
add(itsp) ;
}
public static void main(String[] args) {
ImageTestSwing ets = new ImageTestSwing();
ets.setVisible(true);
}
}
Jpanelの拡張クラス
ダブルバッファリングは、ウインドウのちらつきを防止するためのもの。
package tomojavalib.swingfx;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Image;
import java.awt.image.BufferedImage;
import javax.swing.JPanel;
public class ImageTestSwingPanel extends JPanel {
BufferedImage imgsw =null;
public ImageTestSwingPanel(){
try{
imgsw = javax.imageio.ImageIO.read(new java.io.File( "C:/a.jpg") );
}catch( Exception e ){}
}
/**描画 */
public void paint(Graphics g1){
//ダブルバッファリング
Image offImage = createImage(this.getWidth(), this.getHeight() );
Graphics2D g2 = (Graphics2D)offImage.getGraphics();
//要素の描画
g2.drawImage( imgsw , 0 , 0 , this );
//バッファ領域に書き込んでおいたイメージを描画
g1.drawImage(offImage, 0, 0 , this );
}
}
Swingで画像の拡大縮小、平行移動
画像の移動と拡大縮小をするときは、drawImage()メソッドで位置、幅高さを指定する。
下はx,y方向に50,50移動し、0.5倍に縮小して表示。
//描画位置
int x = 50 ;
int y = 50 ;
//画像のサイズを取り出す
int w = imgsw.getWidth();
int h = imgsw.getHeight();
//拡大縮小
double scale = 0.5;
w = (int)( w * scale );
h = (int)( h * scale );
//要素の描画
g2.drawImage( imgsw , x , y , w , h , this );
Swingで画像の回転表示
画像を回転させて表示するには、記入する側のjava.awt.Graphics2Dを回転させる。
回転して画像を描画し、そのあと元に戻す。
//回転
double rotate = 30.;
//回転
g2.rotate( - rotate * Math.PI/180 , x , y );
//要素の描画
g2.drawImage( imgsw , x , y , w , h , this );
//回転戻す
g2.rotate( rotate * Math.PI/180 , x , y );
平行移動、拡大縮小、回転させる場合は下のように記述する。
package tomojavalib.swingfx;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Image;
import java.awt.image.BufferedImage;
import javax.swing.JPanel;
public class ImageTestSwingPanel extends JPanel {
BufferedImage imgsw =null;
public ImageTestSwingPanel(){
try{
imgsw = javax.imageio.ImageIO.read(new java.io.File( "C:/a.jpg") );
}catch( Exception e ){}
}
/**描画 */
public void paint(Graphics g1){
//ダブルバッファリング
Image offImage = createImage(this.getWidth(), this.getHeight() );
Graphics2D g2 = (Graphics2D)offImage.getGraphics();
//描画位置
int x = 50 ;
int y = 50 ;
//画像のサイズを取り出す
int w = imgsw.getWidth();
int h = imgsw.getHeight();
//拡大縮小
double scale = 0.5;
w = (int)( w * scale );
h = (int)( h * scale );
//回転
double rotate = 30.;
//回転
g2.rotate( - rotate * Math.PI/180 , x , y );
//要素の描画
g2.drawImage( imgsw , x , y , w , h , this );
//回転戻す
g2.rotate( rotate * Math.PI/180 , x , y );
//バッファ領域に書き込んでおいたイメージを描画
g1.drawImage(offImage, 0, 0 , this );
}
}
FXとSwingの違い
FXの場合は、一度描画すればよい。移動や拡大縮小などは後から変更することができる。
Swingの場合は、paintメソッド内で一旦消去し再描画する必要がある。
画像の座標起点はFXの場合中央、Swingは左上隅になっている。
最終更新日: 2019-01-28 08:10:13