2

I have a .fxml file with a <Label> tag and a <ImageView> in it. In my controller class there an event function that is called, the ImageView is updated but my label stays the same. All help is definetly appreciated.

My controller:

public class LayoutController implements BrowserPlaybackEvent {
    @FXML
    public ImageView currentTrack;

    @FXML
    public Label trackTitle;

    SpotySync spotySync;
    public LayoutController(){
        this.spotySync = Main.spotySync;
        spotySync.addBrowserPlaybackEventListerners(this);
    }



    @Override
    public void browserPlaybackEvent(JSONObject playBackState) {
        System.out.println("Layout controller handling browser event");
        Track track = new Track((JSONObject) ((JSONObject) playBackState.get("track_window")).get("current_track"));
        trackTitle.setText(track.name);
        currentTrack.setImage(track.tAlbum.image);

    }
}

.jfxml file:

<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="729.0" prefWidth="861.0" styleClass="HBox" stylesheets="@stylesheet.css" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="nl.nothic.spotysync.ui.LayoutController">

   <children>
      <Pane prefHeight="200.0" prefWidth="617.0" />
      <Pane prefHeight="200.0" prefWidth="200.0" />
      <Pane id="currentlyPlaying" maxHeight="300.0" minHeight="300.0" prefHeight="300.0" prefWidth="200.0">
         <Label>
            <graphic>

               <ImageView fx:id="currentTrack">
                  <image>
                     <Image url="https://i.scdn.co/image/ab67616d00001e02eb9888357d422ff3e6bf0321" />
                  </image>
               </ImageView>

            </graphic>
         </Label>

         <Label fx:id="trackTitle" alignment="CENTER" layoutX="300.0" layoutY="14.0" prefHeight="45.0" prefWidth="550.0" text="Song title" textAlignment="CENTER" textFill="WHITE" wrapText="true">
            <font>
               <Font size="30.0" />
            </font>
         </Label>

      </Pane>
   </children>
</VBox>

Application class:

public class Gui extends Application{
    SpotySync spotySync = null;

    @Override
    public void start(Stage primaryStage) throws IOException {

        Parent root = FXMLLoader.load(Objects.requireNonNull(getClass().getClassLoader().getResource("nl/nothic/spotysync/ui/Layout.fxml")));


        Scene scene = new Scene(root,600,600);
        scene.getStylesheets().add(getClass().getClassLoader().getResource("nl/nothic/spotysync/ui/stylesheet.css").toExternalForm());

        primaryStage.setTitle("SpotySync");
        primaryStage.setScene(scene);
        primaryStage.show();


    }

    public static void launch(){
        Application.launch();
    }

}

The problem I am getting is in the controller. When the browserPlaybackEvent is called a new track is played and the application updated. The Imageview (currentTrack) is updated, also visually in the application itself. I have debugged the code and track.name is valid text and the object is also updated with new text. However in the application only the image gets updated.

I have spent about an hour trying to pinpoint the issue without results.

Thanks in advance

2
  • The Label's text is by default "Song title", just a quick question : when you call the event, what happens to the text? Commented Mar 10, 2020 at 21:42
  • Well, nothing. The image updates to the next track, text stays the same. But I think i found a solution. Commented Mar 10, 2020 at 21:49

1 Answer 1

3

I am not sure why but I think the problem has to do that the event is called on a different Thread (I am no expert on threading so I might be wrong). The reason I didn't suspect this was because the ImageView element did update.

For the solution. To get the correct thread to update the text I used:

Platform.runLater(() -> {
    trackTitle.setText(track.name);
});

This (I think) moves the update to the correct Thread and updates the <Label>.

Sign up to request clarification or add additional context in comments.

1 Comment

Assuming you’re correct that the callback is executed on another thread, you would also need to update the image in the Platform.runLater(...)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.