The repeating-image-pattern() JavaFX CSS function is a convenience function used to create an <image-pattern> object, which represents a texture consisting of a series of repeating images that stretch across a container.

The <image-pattern> object produced will contain tiled images with the following properties:

  • Each tile will be the width and height of the referenced image
  • The tiling pattern will start at (0,0), the top left of the container

The function:

-fx-background-color:
        repeating-image-pattern("specifiedImage.png");

Is equivalent to the following invocation of image-pattern():

-fx-background-color:
        image-pattern("specifiedImage.png", 0, 0, imageWidth, imageHeight);
    /* where imageWidth is the width of specifiedImage.png
       and imageHeight is the height of specifiedImage.png */

Both produce:

repeating-image-patter() function can be used to simplify productino of the <image-pattern> <paint> object

Warning

Errors associated with loading images:

There are significant inconsistencies in the way JavaFX currently resolves errors in loading images. Different errors and program behaviour result from different sources of the image specified (e.g. file vs URL). See ‘Loading Errors’ as described in the entry for the image-pattern() function

Limitations on Image Location:

The URI can be specified as a URL, or as a file reference, although the current CSS Parser (as of JavaFX 15) has significant problems navigating to images that are specified as a local file. See ‘‘Location Limitations’ as described in the entry for the image-pattern() function

Syntax

/*Image pattern used to color the background of a container 
   In this case, it produces a grid of EdenCoding icons, which
   are rendered at the size of the image provided.
   The tile pattern will start in the top-left of the container */
repeating-image-pattern("EdenCodingIcon.png");

See Also