JavaFX Bild zur ImageView in einem Kreis anzeigen.

[Marczii]

Hallo Leute,

Also ich möchte einen Kreis haben, der als Avatar dient und ein Bild beinhaltet. Am Besten soll das Bild über die FXML Datei existieren. Nun habe Ich aber das Problem, dass das Bild nicht im Programm angezeigt wird, aber im Scenbuilder schon.

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.shape.*?>
<?import java.net.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane fx:id="meinArchorpane" prefHeight="540.0" prefWidth="740.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.client.gui.views.JFXTabs.profile.FXAvatarView">

<stylesheets>
<URL value="@profile_style.css" />
</stylesheets>

   <children>
    
      <Circle fx:id="avatarCircle" fill="#1f93ff00" layoutX="370.0" layoutY="123.0" radius="103.0" stroke="WHITE" strokeType="INSIDE" />
      <Button fx:id="imageUploadButton" layoutX="327.0" layoutY="234.0" mnemonicParsing="false" text="Bild bearbeiten" textFill="WHITE" />
      <Label fx:id="usernameLabel" layoutX="356.0" layoutY="282.0" text="Label" />

      <ImageView fx:id="avatarImageView" fitHeight="200.0" fitWidth="200.0" layoutX="270.0" layoutY="23.0">
         <image>
            <Image url="@../images/icons/user.png" />
         </image>
      </ImageView>

   </children>
</AnchorPane>

package com.client.gui.views.JFXTabs.profile;

import javafx.event.Event;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Parent;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.effect.DropShadow;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.AnchorPane;
import javafx.scene.paint.Color;
import javafx.scene.paint.ImagePattern;
import javafx.scene.shape.Circle;
import javafx.stage.FileChooser;
import javafx.stage.FileChooser.ExtensionFilter;

import javax.imageio.ImageIO;
import java.awt.event.ActionEvent;

import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;

import static javafx.embed.swing.SwingFXUtils.toFXImage;

/**
*
*/
public class FXAvatarView implements AvatarView, Initializable {

    private ProfilePresenter presenter;

    @FXML
    private AnchorPane mainAnchorPane;
    @FXML
    private Button imageuploadButton;
    @FXML
    private Label usernameLabel;
    @FXML
    private ImageView avatarImageView;
    @FXML
    private Circle avatarCircle;
   
    @Override
    public void initialize(URL location, ResourceBundle resources) {
        presenter = new ProfilePresenter(this);

        Image image = new Image(getClass().getResource("user.png").toExternalForm());
        avatarImageView.setImage(image);
        avatarImageView.setFitHeight(200);
        avatarImageView.setFitWidth(200);
        avatarImageView.setPreserveRatio(true);

    }




    @Override
    public void setPresenter(ProfilePresenter presenter) {
        this.presenter = presenter;
    }
}

CSS-File:

.table-view {
    -fx-background-color: transparent;
}

.table-view .column-header-background {
    -fx-background-color: transparent;
}

.table-view .column-header-background .label {
    -fx-text-fill: #ffffff;
    -fx-alignment: center-left;
}

.table-view .column-header {
    -fx-background-color: transparent;
}

.table-row-cell {

}

.table-row-cell:odd {


}
#avatarImageView{
    -fx-pref-height: 200;
    -fx-pref-width: 200;
}


#imageUploadButton{
    -fx-background-color: #BA4646;
    -fx-background-radius: 20;
    -fx-boarder-radius: 20;
}

#avatarCircle {
    -fx-stroke: #eeebeb;
    -fx-stroke-width: 3.0;
    -fx-effect: dropshadow(three-pass-box, rgba(0,0,0,0.8), 30, 0 ,0 ,0)

}

 

[dzim]

Ich nehme an, dass das Bild nicht im angegebenen Pfad gefunden wird. Du lädst es im Programm ja aus dem Classpath, während SceneBuilder es tatsächlich als File liest.
Verwende bitte einmal den vollständigen Pfad zum Bild (also so was wie /my/package/structure/image.png).

#edit: leading slash ist optional und muss nicht verwendet werden my/package/structure/image.png

#edit2: Alternativ einfach mal ./image.png probieren...

 

[Marczii]

Also mit /icons/user.png ist es ja grün hinterlegt, beim ausführen wirft er mir jetzt ne Exception:

Caused by: java.lang.IllegalArgumentException: Invalid URL or resource not found
at javafx.scene.image.Image.validateUrl(Image.java:1110)
... 40 more

 

[dzim]

Dein Pfad muss schon stimmen. Z.B. ist das Bild ja augenscheinlich unter ../images/icons/user.png relativ vom FXML zu finden, dann sieht /icons/user.png als absoluter Pfad irgendwie falsch aus.
Wie gesagt: Schau, wo im Classpath das Bild liegt, und passe den Pfad entsprechend an.

 

[Marczii]

Hab es übrigens hinbekommen. Gibt unter Intellij ja mit Rechtsklick, zwei Optionen den relativen und absoluten Path zu kopieren.