Ridimensionamento delle immagini per adattarsi al nodo padre

Question

Come si ottiene un'immagine in un ImageView da ridimensionare automaticamente in modo che si adatti sempre al nodo principale?

Ecco un piccolo esempio di codice:

@Override 
public void start(Stage stage) throws Exception { 
    BorderPane pane = new BorderPane(); 
    ImageView img = new ImageView("http://..."); 

    //didn't work for me: 
    //img.fitWidthProperty().bind(new SimpleDoubleProperty(stage.getWidth())); 

    pane.setCenter(img); 

    Scene scene = new Scene(pane); 
    stage.setScene(scene); 
    stage.show(); 
} 

Answer 1

@Override 
public void start(Stage stage) throws Exception { 
    BorderPane pane = new BorderPane(); 
    ImageView img = new ImageView("http://..."); 

    img.fitWidthProperty().bind(stage.widthProperty()); 

    pane.setCenter(img); 

    Scene scene = new Scene(pane); 
    stage.setScene(scene); 
    stage.show(); 
} 

Answer 2

Uso ScrollPane o semplicemente riquadro per superare questo problema: Esempio:

img_view1.fitWidthProperty().bind(scrollpane_imageview1.widthProperty()); 
img_view1.fitHeightProperty().bind(scrollpane_imageview1.heightProperty()); 

Answer 3

Questa è una soluzione migliore rispetto impegnare la larghezza proprietà (meglio perché spesso quando si associa un figlio al suo contenitore, potrebbe non essere possibile rendere il contenitore più piccolo. In altre occasioni il contenitore potrebbe anche automaticamente iniziare a crescere).

La soluzione seguente si basa sulla sostituzione di un ImageView in modo da consentirne il comportamento come "ridimensionabile" e quindi fornire implementazioni per la larghezza minima, preferita e massima/altezze. Inoltre, è importante implementare effettivamente la chiamata resize().

class WrappedImageView extends ImageView 
{ 
    WrappedImageView() 
    { 
     setPreserveRatio(false); 
    } 

    @Override 
    public double minWidth(double height) 
    { 
     return 40; 
    } 

    @Override 
    public double prefWidth(double height) 
    { 
     Image I=getImage(); 
     if (I==null) return minWidth(height); 
     return I.getWidth(); 
    } 

    @Override 
    public double maxWidth(double height) 
    { 
     return 16384; 
    } 

    @Override 
    public double minHeight(double width) 
    { 
     return 40; 
    } 

    @Override 
    public double prefHeight(double width) 
    { 
     Image I=getImage(); 
     if (I==null) return minHeight(width); 
     return I.getHeight(); 
    } 

    @Override 
    public double maxHeight(double width) 
    { 
     return 16384; 
    } 

    @Override 
    public boolean isResizable() 
    { 
     return true; 
    } 

    @Override 
    public void resize(double width, double height) 
    { 
     setFitWidth(width); 
     setFitHeight(height); 
    } 
} 

Answer 4

Se si desidera che l'ImageView per adattarsi all'interno di una cornice di Windows, utilizzare questa riga di codice:. imageView.fitWidthProperty() bind (scene.widthProperty()).

Nota che sto usando widthProperty della scena, non lo stadio. Esempio:

import java.io.FileNotFoundException; 
import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.image.ImageView; 
import javafx.stage.Stage; 

public class MapViewer extends Application { 

    public static void main(String[] args) { 
     Application.launch(args); 
    } 

    @Override 
    public void start(Stage primaryStage) throws FileNotFoundException { 
     String strTitle = "Titulo de la Ventana"; 
     int w_width = 800; 
     int w_height = 412; 
     primaryStage.setTitle(strTitle); 
     primaryStage.setWidth(w_width); 
     primaryStage.setHeight(w_height); 

     Group root = new Group(); 
     Scene scene = new Scene(root); 

     final ImageView imv = new ImageView("file:C:/Users/utp/Documents/1.2008.png"); 
     imv.fitWidthProperty().bind(scene.widthProperty()); 
     imv.setPreserveRatio(true); 

     root.getChildren().add(imv); 
     primaryStage.setScene(scene); 
     primaryStage.show(); 

    } 

} 

La radio aspetto della fase (primaryStage) dovrebbe essere simile a quella dell'immagine (1.2008.png)

Answer 5

Questo è un metodo larghezza calcolato che rimuove la larghezza della barra di scorrimento .

primi:
myImageView.setPreserveRatio(true);

monitorare i cambiamenti di larghezza barra di scorrimento:

scrollPane.widthProperty().addListener((observable, oldValue, newValue) -> { 
      myImageView.setFitWidth(newValue.doubleValue() - (oldValue.doubleValue() - scrollPane.getViewportBounds().getWidth())); 
     }); 

Larghezza barra di scorrimento:
oldValue.doubleValue() - scrollPane.getViewportBounds().getWidth()

Come faccio a impostare la larghezza init?
dopo primaryStage.show();

myImageView.setFitWidth(scrollPane.getViewportBounds().getWidth());