2 Replies Latest reply: Oct 8, 2012 9:44 AM by 966626 RSS

    CSS for Image-view and resource image

    966626
      I have a resource image in a "resources jar" (a jar just with images), inside the resources jar i have a /com/mycompany/resources/MYIMAGE.png...
      i have a Image view that has been linked to a CSS file with something like:

      #myImage{
      -fx-image: url("@/com/mycompany/resources/MYIMAGE.png");
      }
      #myImage:hover{
      -fx-image: url("@/com/mycompany/resources/MYIMAGE2.png");
      }


      this doesn't work, neither with the image view (at least the image view seems to be responding but the image is not shown) or a Button (the button doesn't put the image neither iwth -fx-image, -sf-background-image or -fx-border.image)

      the idea is to let designers to create CSS files and developers worry about the code, so i don't like the idea to change the images sith code (that's why i am trying to use the CSS)...
      Any help will be helpfull...
      thanks in advance.
        • 1. Re: CSS for Image-view and resource image
          925593
          Hi,

          @ seems to be not supported in CSS url address. That's why your images are not loaded.

          The URL path could be absolute or relative to the CSS file location.

          ex:

          resources
          stylesheets/main.css
          images/test.png

          should give:

          -fx-image=url("../images/test.png")


          Like in web development, it a good thing to put together css stylesheets and associated graphics, to let the UI developers the ability to design skin whith their own graphics...
          • 2. Re: CSS for Image-view and resource image
            966626
            That did it!!!!
            i put the CSS file in the same jar than the images (and that made sense since the "resources jar" is supposed to be done for designers) and then i just used a relative path considering the CSS path... and it worked, at least for the image.
            Thanks a lot.