Перетяжка в фоновом режиме

Question

Я создал этот небольшой пример кода для того, чтобы представлять проблему, которую я сталкиваюсь:

package test.barimages; 

import javafx.application.Application; 
import static javafx.application.Application.launch; 
import javafx.beans.property.ObjectProperty; 
import javafx.beans.property.SimpleObjectProperty; 
import javafx.geometry.Insets; 
import javafx.scene.Scene; 
import javafx.scene.control.ContentDisplay; 
import javafx.scene.control.Label; 
import javafx.scene.image.Image; 
import javafx.scene.image.ImageView; 
import javafx.scene.layout.FlowPane; 
import javafx.scene.text.Font; 
import javafx.stage.Stage; 

public class MainApp extends Application 
{ 
    ObjectProperty<Label> selectedText = new SimpleObjectProperty<>(); 

    @Override 
    public void start(Stage stage) throws Exception 
    { 
     selectedText.addListener((obs, oldSelectedText, newSelectedText) -> 
     { 
      if (oldSelectedText != null) 
      { 
       oldSelectedText.setStyle(""); 
      } 
      if (newSelectedText != null) 
      { 
       newSelectedText.setStyle("-fx-background-color: lightgray; -fx-padding: 5;"); 
      } 
     }); 

     FlowPane navigationBar = new FlowPane(); 
     navigationBar.setMaxHeight(45); 
     navigationBar.setPadding(new Insets(5, 5, 5, 5)); 
     navigationBar.setVgap(10); // Set vertical gap size 
     navigationBar.setHgap(10); 

     Label FirstIcon = FirstIcon(); 
     Label SecIcon = SecIcon(); 
     Label ThurIcon = ThurIcon(); 

     selectedText.set(FirstIcon); 

     navigationBar.getChildren().addAll(FirstIcon, SecIcon, ThurIcon); 

     Scene scene = new Scene(navigationBar); 

     stage.setTitle("JavaFX and Maven"); 
     stage.setScene(scene); 
     stage.show(); 
    } 

    public static void main(String[] args) 
    { 
     launch(args); 
    } 

    private Label FirstIcon() 
    { 
     Image image = new Image("http://goo.gl/kYEQl"); 
     ImageView imageView = new ImageView(); 
     imageView.setImage(image); 

     Label label = new Label("First"); 
     label.setFont(Font.font("Verdana", 12)); 
     label.setContentDisplay(ContentDisplay.LEFT); 

     label.setGraphicTextGap(8); 

     imageView.setFitWidth(40); 
     imageView.setFitHeight(40); 
     imageView.setPreserveRatio(true); 
     imageView.setSmooth(true); 
     imageView.setCache(true); 

     label.setGraphic(imageView); 

     label.setOnMouseClicked((event) -> 
     { 
      selectedText.set(label); 
     }); 

     return label; 
    } 

    private Label SecIcon() 
    { 
     Image image = new Image("http://goo.gl/kYEQl"); 
     ImageView imageView = new ImageView(); 
     imageView.setImage(image); 

     Label label = new Label("Second"); 
     label.setFont(Font.font("Verdana", 12)); 
     label.setContentDisplay(ContentDisplay.LEFT); 

     label.setGraphicTextGap(8); 

     imageView.setFitWidth(40); 
     imageView.setFitHeight(40); 
     imageView.setPreserveRatio(true); 
     imageView.setSmooth(true); 
     imageView.setCache(true); 

     label.setGraphic(imageView); 

     label.setOnMouseClicked((event) -> 
     { 
      selectedText.set(label); 
     }); 

     return label; 
    } 

    private Label ThurIcon() 
    { 
     Image image = new Image("http://goo.gl/kYEQl"); 
     ImageView imageView = new ImageView(); 
     imageView.setImage(image); 

     Label label = new Label("Thurd"); 
     label.setFont(Font.font("Verdana", 12)); 
     label.setContentDisplay(ContentDisplay.LEFT); 

     label.setGraphicTextGap(8); 

     imageView.setFitWidth(40); 
     imageView.setFitHeight(40); 
     imageView.setPreserveRatio(true); 
     imageView.setSmooth(true); 
     imageView.setCache(true); 

     label.setGraphic(imageView); 

     label.setOnMouseClicked((event) -> 
     { 
      selectedText.set(label); 
     }); 

     return label; 
    } 
} 

При запуске кода и нажать кнопку над изображениями вы увидите, что выбранный Ярлык выталкивает следующий , Это вызвано заполнением. Есть ли способ сохранить добавление фона без нажатия на близкие изображения?

Answer 1

Я ничего не могу сделать из этого вопроса, поэтому из вашего примера можно предположить, что вы не хотите, чтобы выбор был отрезан на изображении/тексте.

Первое: наличие прокладки без занимаемого пространства является противоречием.

Вы должны подойти к вопросу по-другому: вы изменяете атрибуты FlowPane. Вы можете легко отбросить hgap/vgap из области обработки и вместо этого добавить дополнение к каждому кликабельному узлу.

изменения Пример:

selectedText.addListener((obs, oldSelectedText, newSelectedText) -> 
{ 
    if (newSelectedText != null) 
    { 
     newSelectedText.setStyle("-fx-background-color: lightgray"); 

    } 
}); 

FlowPane navigationBar = new FlowPane(); 
navigationBar.setMaxHeight(45); 
navigationBar.setPadding(new Insets(5, 5, 5, 5)); 
navigationBar.setVgap(10); 
navigationBar.setHgap(0); // set to 0, instead add padding to every node 

Label FirstIcon = FirstIcon(); 
FirstIcon.setPadding(new Insets(5)); // add padding 
Label SecIcon = SecIcon(); 
SecIcon.setPadding(new Insets(5)); // add padding 
Label ThurIcon = ThurIcon(); 
ThurIcon.setPadding(new Insets(5)); // add padding 

Нечто подобное. Это дает вам пространство вокруг узла, сохраняя пространство общей компоновки так, как оно было у вас. У меня нет информации о том, чего вы действительно хотите достичь. Таким образом, вы должны играть со значениями вставки, если некоторые пиксели не так, как вы хотите.