title: JavaFX ImageView fits container
body: <p>I'm trying to fit an ImageView in an AnchorPane, the ImageView is obtained from a database, so no CSS, I tried binding the width and height of the ImageView withe the width and height of the AnchorPane, but I get this result:</p>
  
  <p><a href="https://i.stack.imgur.com/HhSI1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HhSI1.png" alt="anchorPane problem"></a></p>
  
  <p>Here's my fxml:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  
  &lt;?import javafx.scene.control.Label?&gt;
  &lt;?import javafx.scene.image.ImageView?&gt;
  &lt;?import javafx.scene.layout.AnchorPane?&gt;
  &lt;?import javafx.scene.text.Font?&gt;
  
  &lt;AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1"&gt;
     &lt;children&gt;
         &lt;AnchorPane style="-fx-background-color: grey;" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"&gt;
             &lt;children&gt;
                 &lt;Label fx:id="nombrePlato" alignment="CENTER" contentDisplay="CENTER" maxHeight="50.0" prefHeight="50.0" text="Nombre del Plato" textAlignment="CENTER" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"&gt;
                     &lt;font&gt;
                         &lt;Font size="30.0" /&gt;
                     &lt;/font&gt;
                 &lt;/Label&gt;
             &lt;/children&gt;
         &lt;/AnchorPane&gt;
         &lt;AnchorPane fx:id="anchorPane" layoutY="300.0" styleClass="anchorPane" stylesheets="@../../../../core/resources/css/MainCSS.css" AnchorPane.bottomAnchor="5.0" AnchorPane.leftAnchor="5.0" AnchorPane.rightAnchor="5.0" AnchorPane.topAnchor="50.0"&gt;
           &lt;children&gt;
              &lt;ImageView fx:id="imagenPlato" fitHeight="100.0" fitWidth="100.0" pickOnBounds="true" preserveRatio="true" /&gt;
           &lt;/children&gt;
        &lt;/AnchorPane&gt;
     &lt;/children&gt;
  &lt;/AnchorPane&gt;
  </code></pre>
  
  <p>And here's my method:</p>
  
  <pre><code>public void rellenar(Label nombrePlato, ImageView imagenPlato, Plato plato, AnchorPane anchorPane) throws SQLException {
  
          nombrePlato.setText(plato.getNombre());
          Blob blob = plato.getRutaImagen();
          int blobLength = (int) blob.length();
          byte[] blobAsBytes = blob.getBytes(1, blobLength);
          Image convertToJavaFXImage = convertToJavaFXImage(blobAsBytes, 1024, 768);
          imagenPlato.setImage(convertToJavaFXImage);
  
          imagenPlato.fitWidthProperty().bind(anchorPane.widthProperty());
          imagenPlato.fitHeightProperty().bind(anchorPane.heightProperty());
      }
  </code></pre>
  
  <p>Any idea how to make it fit he anchorPane and make it responsive?</p>