ImageView not resizing to AnchorPane in JavaFX SceneBuilder/Layout XML

Question

I'm having trouble with layout in JavaFX SceneBuilder.

I have a GridPane, one cell of which contains an ImageView inside an AnchorPane, and want the image to resize to the anchor.

I tried this, but it doesn't work. Just shows the image at full size.

        <AnchorPane fx:id="imageAnchor" GridPane.columnIndex="4" GridPane.rowIndex="1">
            <ImageView pickOnBounds="true" fitHeight="${imageAnchor.height}">
            <image>
                <Image url="https: / /www.mydomain.com/path/image.png" />
            </image>
            </ImageView>
        </AnchorPane>

I also tried

        <AnchorPane fx:id="imageAnchor" GridPane.columnIndex="4" GridPane.rowIndex="1">
            <ImageView pickOnBounds="true" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
            <image>
                <Image url="https: / /www.mydomain.com/path/image.png" />
            </image>
            </ImageView>
        </AnchorPane>

... but neither work. Any ideas what the problem might be?

I'd like to achieve this via SceneBuilder / XML.

Answer 1

I eventually solved this using:

         <AnchorPane fx:id="imageAnchor" GridPane.columnIndex="1" GridPane.rowIndex="1">
             <ImageView fitHeight="${imageAnchor.height}" managed="false" pickOnBounds="true" preserveRatio="true" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
                 <image>
                     <Image url="image.png" />
                 </image>
             </ImageView>
         </AnchorPane>